Design the Best Mobile Device Experience

Eric Schmidt, the former CEO of Google recommended designers should follow the “mobile first” rule in product design.

What is Mobile First Design?

To understand the concept of mobile first design, let's break it down.

Responsive Web Design (RWD)

Responsive web design is a web design method that enable web to fit to the screens of different devices automatically, displaying the content in a way that people feel comfortable.

This greatly reduces users’ operations like panning, zooming and scrolling when browsing the web.


“Progressive Advancement” & “Graceful Degradation”

These two concepts were put forward before responsive web design. In order to make web or application interface display reasonably on different devices, designers provide customized versions of product for different ends.

Progressive Advancement means that when we design a product, first we build a version for relatively lower browser (like that on a mobile phone). This version includes the most basic functions & features.

After that we tend to the advanced version for a tablet or PC, which is created by adding interactions, more complicated effects, etc. on the basic version for a better user experience.

“Graceful Degradation”, on the contrary, starts the product design from an advanced end like desktop and builds a version with well-rounded features at the beginning.

Then designers make the product compatible to mobile ends by cutting some functions or contents.

Progressive Advancement is normally preferred.  

Looking at mobile end product design as a starting point, under the restrictions like bandwidth, screen size and so on, designers will naturally seize the key points of a product, head for a lean & neat product with prioritized features.

When the platform is expanded to a tablet or PC, designers are able to take advantages of the unique features of these advanced ends to strengthen the product step by step. This might be the core reason that progressive advancement strategy is widely used.

A “mobile first” strategy is a rule of “progressive advancement”.

"Mobile first", as the name suggests, means that you start the product design from the mobile end which has more restrictions, then expand its features to create a tablet or desktop version.