Explore Emulators

One of the goals of this program is to introduce students to various approaches in mobile app development. Responsive design with its variations is an important part of it. But there are situations when it might be beneficial the creation of separate mobile sites. An interesting example can be seen in the recent political campaign.

Another aspect of separate mobile site development is in determining exactly when and for what devices such development is necessary. The two mainstream directions of the automation oof such redirecting is in media queries and user agents that you've been introduced in our studies. There is an ongoing evolution of both approaches attempting to increase their precision, while on the other side the users are getting tools allowing to change user agents in order to get different corresponding source code and views.

An important part of the decision is an ability to see how different the content looks like on different devices by using a variety of device emulators. In my opinion the latest beta of Chrome Canary (you can download it) already has a bunch of such emulators working without the need for any special installation. It actually is a useful development tool. Although I do not want to overload the course of studies with a lot of possible sideline information sticking close to the coverage of all modern approaches to mobile app development, advanced students might be interested in some additional exploration.

Exploration Advice: install the latest Chrome Canary. Go to your site and see it on the screen. Go to Tools, Developer Tools and click on any emulator you want to explore in the upper menu (under Device option).

You might also tweak your HTML and CSS in the bottom menu and see how it affects various emulators. The screen will look like the following:

But be aware that richness of the newest development tools is just masking the main challenge – responsive design as automation of responsiveness and adaptation (see RESS in my previous post) versus manual choices. And this is not only about adapting to the screen size or resolution. Modern mobile devices increasingly use additional capabilities in the use of various sensors, user actions, and dynamic UI modifications. Allowing your app automatically adapting in its behavior requires not only the views of the content that you can see in Chrome Canary manual development assistance but access to the decision making system determining app behavior and adaptive changes when dealing with specific devices and their capabilities. But this will be another story that we will touch upon later.