Top

Mobile First: What Does It Mean?

March 5, 2012

Mobile first has become a popular trend within the UX design and development communities. But, what does mobile first mean, exactly? I first encountered this concept at TechWeek, in Chicago, in the summer of 2011, when I attended a talk on mobile UX design by John Buda, who taught the audience how to write responsive behavior. I was stunned. By implementing responsive JavaScript, it’s possible to tell Web sites to adapt to whatever device a person is using to view a Web site. I had seen Web sites behave in this manner, but until that moment, I hadn’t understood that mobile first is both a strategy and a new way of writing code. I left the conference with some questions, including: What is mobile first? What is a mobile-first strategy? And, why is mobile first becoming increasingly popular? I’ve since come up with some answers to these questions that I’ll share with you in this article.

Champion Advertisement
Continue Reading…

Mobile First: A Paradigm Shift

Many companies caught on to the mobile-first trend awhile back. Google surfaced their mobile-first strategy in 2010. As you’ve probably guessed from the name of this approach to site design, mobile first means designing an online experience for mobile before designing it for the desktop Web—or any other device. In the past, when users’ focus was on the desktop Web, mobile design was an afterthought. But today, more people are using their mobile devices for online shopping and social networking than ever before, and most companies are designing for mobile. Mobile first requires a new approach to planning, UX design, and development that puts handheld devices at the forefront of both strategy and implementation. The digital landscape has changed, and companies have realized that consumers are now accessing more content on their mobile devices than anywhere else.

Mobile first shifts the paradigm of a Web-site user experience. Instead of users’ viewing desktop versions of Web sites on their mobile device with some adjustments, users are now viewing sites that have been created specifically for their mobile device. This begs the question: how will stationary, desktop computer users view these Web sites? They’ll still view versions of Web sites that were developed for the desktop Web—but designed with mobile in mind. This means designers should tailor site user experiences to the needs of users who are on the go and in multiple contexts. Text must be easier to read and navigate. Photos and maps should be easily accessible, and all content should adjust to display properly on the device on which a user is viewing it.

Digital Strategy

Defining a digital strategy is an essential part of developing a successful product or brand. A desktop-Web user experience strategy differs from a mobile user experience strategy. A traditional desktop-Web user experience is designed for keyboard and mouse interactions, and a strategy for such a user experience should take into consideration the context, the behavior, the audience, the targeted behavior, and the technology channel. The typical assumption is that users are stationary and viewing a browser on a large screen. It’s essential to design desktop-Web user experiences for all users who might access a site—from children to the elderly. On a stationary desktop computer, users can read and understand in-depth content and can type lengthy responses. For games on the Web, users manipulate controls using the keyboard or the mouse.

A strategy for a mobile user experience considers all of the same factors: the behavior, the audience, the targeted behavior, and the technology channel, but the relative importance of these factors shifts depending on the user’s context. Mobile design employs less screen real estate, but introduces greater breadth to a user experience, according with the context of the overall experience. The needs of users change because their context continually changes. Users have a harder time reading in-depth content on a small screen. Without a keyboard, their ability to type is hindered. Mobile devices introduce new modes of interaction such as touch and gestures. It’s possible to play games in a number of different ways, by activating touch targets across an entire screen.

Let’s consider an insurance company’s site as an example, highlighting the differences between a desktop-Web user experience strategy and a mobile user experience strategy. An insurance company wants to build an online experience. The home page of a desktop-Web experience might provide the means for users to call an agent and get a quote as its primary call to action. However, if the insurance company wanted to build a mobile experience, the focus might instead be on users’ context. Users might use the insurance company’s site on the go—to make a claim or get roadside assistance. Therefore, for a site that is optimized for mobile, it would be necessary to reorganize the desktop-Web content.

Why Now?

Currently, many Web sites are embracing a mobile-first strategy, but it’s taken awhile. Why is mobile first finally becoming a popular strategy? Mobile devices are now the primary means by which users are accessing Web sites, and the number of people using sites on mobile devices is projected to triple within the next year. Today, smartphone sales have actually surpassed personal computer sales.

In addition to the consumption of content on mobile devices, another reason is the arrival of HTML5 and CSS3, which together offer new features that support responsive JavaScript calls. Developers can now tell Web sites to adjust their size and, as necessary, optimize their page layouts for particular devices. The mobile environment allows developers to create rich, context-aware applications. The way people access sites on their mobile devices is yet another reason mobile first has become so popular. The limited screen real estate of mobile devices encourages designers and developers to focus on the most important pieces of content. Thus, mobile devices provide users with a better overall experience for shopping, playing games, and making purchases.

These days, the Internet is moving fast. By the end of 2012, it is projected that, in some countries, mobile networks will deliver one gigabyte of data per second through the Internet. This is 200 times faster than the current speed of the Internet in the United States. This increased speed will better support mobile browsing and Internet access, enabling users to complete many more tasks within a small time period when on the go. Cloud computing has also contributed to the popularity of mobile Web site use. When on the go, people can easily and quickly access large amounts of data in the cloud.

All things considered, mobile first is changing the landscape of the Internet. It is a strategy that we cannot ignore. Examine mobile first as a new approach to designing the best user experiences possible. Considering a user’s context and behavior, as well as nature of your audience helps you to determine the best digital strategy for your product or brand. As new devices continually come onto the market, mobile first—an approach to design and development that considers a variety of devices and contexts—will be pivotal to your creating a successful product or brand. 

References

Albanesius, Chloe. “Google’s New Rule: Mobile First.” PC Mag, February 16, 2010. Retrieved February 29, 2012.

Buda, Jon. “Mobile UX Design.” TechWeek, July 23, 2011. Retrieved February 29, 2012.

Kim, Ryan. “It’s Becoming a Mobile First World.” Gigaom, January 6, 2012. Retrieved February 29, 2012.

Wroblewski, Luke. “Mobile First Helps with Big Issues.” LukeW Ideation+Design, June 4, 2010. Retrieved February 29, 2012.

Wroblewski, Luke. “Why Mobile Matters.” LukeW Ideation+Design, February 21, 2012. Retrieved February 29, 2012.

Associate Director at Pivotal Labs

Chicago, Illinois, USA

Riley Graham LongoRiley has a passion for creating innovative, engaging user experiences. She is a firm believer that the best innovations stem from overlapping disciplines, thinking outside of the box, and adapting to change. Riley received her Masters of Science in Human-Computer Interaction from DePaul University and is local leader of the Chicago chapter of the Interaction Design Association.  Read More

Other Articles on UX Strategy

New on UXmatters