This is a guest post to the Computer Weekly Developer Network written by Marshal Datkowitz, a senior user experience architect in the ‘user experience’ group at Infragistics.
A mobile device is very different to a PC. Sure they are smaller, but it’s much more than that. People bring to their mobile devices a whole different set of expectations. They use them differently, use them in different places and want different things from them. Mobile devices make different physical and cognitive demands on users. This piece will explore these differences and give you strategies you can put to work right away on your next mobile project.
First the most obvious – display size
The average size of PC monitor is 21 inches, a display resolution no smaller than 1024 X 768. Compare that to the typical smart phone display, 3.9 inches and a resolution of 800 X 480. So clearly there is not as much space to work with. Your screens must be more concise, you can’t show as many options. The paths through your application have to be super clear; therefore you’ll need to spend more time on the functional design than you typically do. Strive to use less text and better icons.
If you want to rely on icons heavily to convey your features, functions and contents, your icons should be more concrete, less complex and represent the concept you’re trying to express as closely as possible. For example, you want to depict the concept of a note. You want it simple, so don’t include much detail – you don’t need lines on the paper or a texture on the clip.
Your text should be as legible and as readable as possible. To make your text more legible, use a font size of at least 10 points and turn up the contrast. Watch for Chromatic Aberration, that’s when you place red on dark blue (or dark blue on red) and cause the colors to vibrate – not good!
Input – how we use it
A mobile device relies mostly on fingers — gestures, on screen keyboard and tapping icons or buttons. The downside to the touch screen is that there is no tactile feedback like we have on a physical keyboard, therefore it is easier to make input mistakes and we are a lot slower using them. To compensate, provide sound or vibration for key presses and minimise text entry. Fingers can be large so make your buttons large (35 pixels square) and visually separated from other buttons or objects to reduce error.
Use innovative ways to input data like photographs Daily Burn’s MealSnap app uses photography’s to add food to its calorie counter, Quick Response codes (links, text and other data), accelerometer to select items by tilting the phone to indicate a choice, use detected location (GPS) so users don’t have to manually enter a current address and lastly voice to input text into fields (Google search). Take advantage of the hardware, Windows Phones have three dedicated buttons (back, start, and search) – use them to reduce clutter on the interface and therefor minimise error.
Context – where we use it
PC’s are used in homes and offices, pretty predictable and stable places. Good lighting, limited distractions and a relatively focused user. Take all those factors we know about PC users and throw it all away for mobile users.
Environmental and cognitive issues that rarely occur at the desktop often appear in a mobile environment. Distractions such as noise will draw the user’s attention away from the device or at least interfere with detecting sounds from your application. Sun glare can obliterate the screen and make it difficult to use your application at all. A cognitive issue such as the overload of information makes it difficult for users to concentrate on your application – they look at the screen, look up at something else and then go back to the screen. Help users by pairing down your application to the bare minimum so they can quickly understand what it is doing for them and allow them to readily find their way back when distracted.
Mobile device users (for the most part) are on the move. They have a limited amount of time and have come to your application for a specific reason. They come with questions that need to be answered immediately. If your application is to be successful it must help the users get to those answers quickly, if you can consistently help users they will come back often, they will spend time in your application.
Your users will be in a rush, so help them get to it! Keep your application to the bare minimum and do it really well.
I hope you have enjoyed this quick look at the difference between a PC and mobile device. Developers who are simply miniaturising the PC experience for the mobile device are missing the point. We need to focus our attention on what users want most from our applications and give it to them – simply but elegantly.