Nowadays, UX goes far beyond the desktop, right? Everybody knows that. The issue is how to design for such a diverse, unpredictable and challeguing scenario. Jennifer Tidwell adressed that issued during her session at Interaction 09. As any other list of guidelines you will probably think it is too general, maybe too obvious. So, what about join the big group and suggest some ideas?
In the meanwhile take a look at Jennifer’s design patterns for rich mobile experience.
* Mobile is important: in Q108 294M mobile vs. 71M PC sales. Tens of millions of Google searches on mobile devices. 80% of those are from outside the US
* Mobile guidelines: fast -need to be responsive, minimize typing, fierce task focus –as little as you need to get done, many others.
* 98% of the world’s mobile phones are keypad phones. Focus on general purpose, always connected phones. While sales of smart phones are small, they have a disproportionate use of Web activities.
* Criteria for patterns: consensus on best practice but not too obvious, specific and buildable, does it improve life for a user (or is it just a technical convenience).
* One column layout: lay out content in a scrolling vertical stack. One of the first things to consider.
* Persistent toolbar: put the most important tools in a short menu anchored to one side of the screen: top or bottom?
* Touch tools: only show tools in response to keypress or touch, in a small, dynamic overlay.
* Item markers: use bold colors, icon and other visual differentiators in menus and lists. Most mobile conditions are not ideal: light, small screen, etc.
* Infinite List: at the bottom of the list, put an item that appends and adds to the list. Can’t load too much into a single screen.
* All in one button: a single target in a form can hold a label and an edit indicator -does two things in one.
* Two-part button: a single button or list that contains a large and small hit target each with different actions.
* Aggressive auto-completion: use whenever typing can be reduced as typing on a phone sucks.
* Text field clear button: clearing a text field with one button is very useful in mobile context.
* Share button: when people find content of interest, enable them to share it.
* Micro-loading indicators: while a page or block is loading, show a tiny progress indicator where the user tapped or clicked.
* Rich interconnections: put direct links to other apps within your app or page and prefill them with data from the users context. It’s difficult to switch apps on mobile devices.
* Data in the cloud: pull user data from networked repository. Synch automatically.
