Back to Insights

Designing for mobile first

We've all experienced a shift in our consumption of information over the last decade. We're constantly being bombarded by more and more bits of data all competing for our attention and our action. We spend more time quickly checking things on our phones and other mobile devices. When in front of the computer, notifications pop up everywhere — new emails, new instant messages, new notices from applications. Meanwhile, our phones beep reminding us of meetings, a friend commenting on Facebook, or being mentioned on Twitter. It's hard to keep focused in this environment.

What does this mean for web design? For one thing, it means users have less patience for distractions. This isn't limited to being on-the-run with a mobile device, either. It extends to our desktop environment and "normal" web pages. Designing first for mobile devices, though, enables us to better think about and simplify a design. The result is a far more focused experience — both for desktop and mobile.

The traditional way of designing a website starts with the desktop experience and treats mobile as an afterthought. It typically focuses on wireframing and mock-ups with a 1024x768 monitor in mind. Just as a task will expand to fill the time allotted to it, the design will expand to fit the physical space allotted to it. Often the result is the inclusion of many things tangential to the user's goals and a dilution of what's important. Designing first for a mobile device like the iPhone, for example, results in an 80% reduction of screen real estate. This forces us as designers to think more critically about what's important and deserving of space and what's not.

Does this mean the desktop experience should match the mobile one? Definitely not! But in a world where focus is hard to come by, designing for mobile first helps us better keep our focus as designers.