The motto ‘Mobile First’ is now established in the development of digital interfaces for several end devices. However, it is worth questioning this approach and exploring visual alternatives.
Luke Wroblewski described Mobile First for the first time on November 3, 2009. Mobile First means more than just starting with the smallest display and thus with the lowest common denominator for responsive pages, which today is the display of a smart watch. ‘Small Screen First’ may therefore be more appropriate. Mobile First is primarily about reducing functionality and information to their essence and relevance and, from this, developing the overall picture.
From the viewpoint of the developer, this approach makes sense. Starting with common program code for all resolutions, you can gradually add special features for extended views. This approach can also be useful for conceptualization, because at the beginning a prioritization takes place and clearly shows why different page elements form the centerpiece of a view, while others are only added if appropriate opportunities exist.
But even conceptually, opinions vary. People are talking more and more about Device First. The special features of a device when it is used are becoming the focus. How do I use the device? Where, and in which context, do I use a digital offering? In this context, it would not be particularly useful to design a tool for capturing time spent working on a desktop computer on a mobile device.
„Flow and context are more important than screen size.“
As a designer, however, I have an additional point of view. The composition of different design elements at a glance, their interplay, and how space and weighting result in user guidance, and the focus of a view, are dependent on the size of the available surface. The visible area plays an essential role in accessing features quickly and easily, or in displaying information in a comprehensible and appealing way.
On small displays, reducing to the essentials may be a necessary evil, and the composition of information plays no role in list elements, as is commonly seen on smartphones. The elements do not depend on each other. In other words, visually, a complex web page with different elements on a small display is inevitably usually a list with a Burger menu.
Anyone who starts with a list as a design basis runs the risk of transferring this blandness to more space. From three listed information blocks, three uninspired teasers can easily be created in a larger space without prioritization. The perspective of the user – or the relevance of information – becomes an ignored point.
Another aspect that makes many interfaces appear like variations of the same is UI Pattern – the uniform and exemplary representation of functionality and information. Naturally, these design templates have advantages: users do not have to learn how an interface works because they can interact with familiar elements. But an overly straightforward use of such building blocks is not a guarantee of good design. Customized views and solutions, which are more exciting and focused in their appearance, are often lacking.
Based on my preference for diversity and courageous compositions, I still prefer a different mode of design: starting with the big picture – the combined appearance of all relevant information and functionality – compact images have to follow in a small space. After all, from a design perspective, there is no space for unnecessary information anyway, and arrangements are first and foremost dependent on the output device and the usage environment. They win if we focus on them. Omitting is visually easier than adding. The concern that a view doesn’t work as well with reduction is therefore unfounded.
If we focus more on complex view types and think about all relevant output devices right from the start, this leads to more experimentation and variety. We create diversity in appearance and focus more on the expectations that users place on the use of interfaces. This ‘Think Big, Reduce Later’ approach brings variety and attractiveness back to the fore, creating more compelling user experiences. We followed the same approach for our own website. The result: each view has its own character and is not the least bit boring.
Image Credits: Ski Safari 2