To date, most design for the web has naturally started on the desktop and migrated to the mobile browser in the form of either a mobile-specific site or a responsive design. By design and requirement, these versions are frequently subsets of their desktop progenitor.
However, as web traffic shifts to toward smart-phones and tablets, we are starting to see design and content decisions and conventions move back upstream from mobile to desktop. And it is likely we are going to see more new site designs moving this way.
The reasons for this are easy-to-understand for anyone that has been in the planning meeting for a new site design or redesign. In those meetings three groups hash it out for ultimate supremacy:
- Marketing/product/sales factions fighting for primacy in the main navigation and home page
- Designers arguing for the value of user-centered UX and white space
- Producers arguing for simplicity in the design - especially looking to increase the number of shared elements for the different versions of the site (web, mobile, language/region-specific)
These conflicting agendas are exacerbated further in mobile development which, like transistor/chip development before it, is required to do more with less space. As a result, like chip designers, mobile interface designers have become very adept at miniaturizing important elements and creating new conventions that handle a lot of the heavy lifting in the tiny screen space.
A prime example is the 3 horizontal bars indicating a drop-down menu - you've seen it on responsive sites as well as mobile apps.
Click on the bars and a panel slides out or down offering navigation and feature options. Click on an option and the panel slides back in and you are off to your new destination.
"Flyout" navigation elements have been used to save space while allowing options to be easily accessed are nearly a decade old, but never before have they hid nearly the entire navigation under a single icon. But along came the tiny screens on mobile devices and issues of space and usability forced a new convention to be born.
 |
| Inter-site navigation icon on Gawker.com |
"Flyout" navigation elements have been used to save space while allowing options to be easily accessed are nearly a decade old, but never before have they hid nearly the entire navigation under a single icon. But along came the tiny screens on mobile devices and issues of space and usability forced a new convention to be born.
Content sites like Gawker, Slate and National Journal have already started using this convention on their desktop version and it's just a matter of time before we see other ecommerce, content and B2B sites taking this lead.
While it may take a bit longer with the big e-commerce sites like Amazon, (Unbridled Brain client) Walmart, and Target, the smaller, more nimble e-commerce and content sites will quickly adopt these conventions to provide themselves with more of that valuable header and home page real estate.
What this means is UX and UI designers will continue to evolve a common visual vocabulary that works across multiple devices and screen sizes - saving needed space on phones, and opening up new content opportunities on the bigger screens of tablets and desktops.
Eventually - likely in the next year or two as mobile traffic becomes the majority for most sites - the current design process will be flipped on its head. Mobile will be the starting point and the desktop will benefit from the extra space as a secondary consideration.
All of this means, the next time you are in a meeting about the redesign of your site the UX or UI designer will be able to make far more of her internal constituents happy without sacrificing the needs of their external constituents for a usable and consistent site experience.
While it may take a bit longer with the big e-commerce sites like Amazon, (Unbridled Brain client) Walmart, and Target, the smaller, more nimble e-commerce and content sites will quickly adopt these conventions to provide themselves with more of that valuable header and home page real estate.
What this means is UX and UI designers will continue to evolve a common visual vocabulary that works across multiple devices and screen sizes - saving needed space on phones, and opening up new content opportunities on the bigger screens of tablets and desktops.
Eventually - likely in the next year or two as mobile traffic becomes the majority for most sites - the current design process will be flipped on its head. Mobile will be the starting point and the desktop will benefit from the extra space as a secondary consideration.
All of this means, the next time you are in a meeting about the redesign of your site the UX or UI designer will be able to make far more of her internal constituents happy without sacrificing the needs of their external constituents for a usable and consistent site experience.
