Hardware

Common sense tips for developing usable mobile apps

Justin James discusses the major roadblocks to mobile usability and presents common sense guidelines that should help you write usable apps for mobile computing platforms.

Developers who work on mobile computing platforms (UMPCs, smartphones, cell phones, etc.) frequently overlook the issue of usability. Part of the problem is that there are no clear usability guidelines yet for developing for mobile devices. There is also such a high level of variability between devices that it is difficult to make hard and fast statements, such as "always use this font size as the minimum." And since most desktop application developers don't pay much attention to usability, it doesn't surprise me that developers who are working on mobile devices are missing it too.

Benefits of better cell phone usability

Cell phones can be much more difficult to use than they should be. Sure, it is easy to blame the users. After all, we are talking about a simple cross pad for selections and paging, a central OK button, a Clear button that backs out, and two shoulder buttons for secondary selections. This is a total of five keys and a full scale of eight button pushes to work a cell phone.

Although, despite the relative lack of input options and the fairly obvious (and consistent) mapping of on-screen displays to the buttons, many people are baffled about how to use their cell phones. We can conclude that either: A huge percentage of the population are total morons who have no business operating anything more difficult than a spoon; or, even the most relatively simple device's ability to present UI metaphors to the user that make sense are simply not good enough. Since the prospect of a world filled with people so blindingly dumb truly scares me (particularly since so many of them talk on their cell phone while driving), I am going with the latter option.

Figure A

Figure A

Figure A is a picture I took of my cell phone's screen. (My Samsung FlipShot is fairly typical for a Verizon phone.) The space I marked as Cue 1 indicates that the left shoulder button will activate the Message dialog box. Cue 3 means that the right shoulder button will bring up the Contacts system. Cue 2 indicates that the cross pad's central button will activate the main Menu.

Have you ever really thought about this interface? Without asking someone for help or consulting the manual, how would you know that these items on the screen are metaphors for the functionality of buttons on the device? For example, Cue 1 might be interpreted as, "you have messages" or maybe, "this phone can send a message." There is nothing about it that relates it to the left shoulder button.

My girlfriend has an LG Venus, which has a touch screen area with "soft buttons" instead of the traditional cross pad. (Soft buttons are a display on the touch screen of "buttons," with text indicating each button's functionality.) I dislike touch screens (I like the tactile feel of a button), but they are much more usable because the buttons always indicate their function.

I think the best possible interface would be a combination of a touch screen for some "soft buttons" and a keypad (and probably a cross pad) with OLED keys that allow software to change the button's appearance so that it functions like a hardware "soft button." Sadly, this route is fairly expensive and not likely to be available at a reasonable price in the next few years. Until then, we need to figure out how to make an interface that at least 95% of users can fully understand rather than only 50% of users getting 75% of the functionality. After all, cell phone carriers would make more money if users had a better understanding of their cell phones' features. It really is in everyone's best interest if these phones are more usable.

Mobile usability challenges

There are a lot of roadblocks to mobile usability. Some of these are hardware issues, which may be impossible to resolve while maintaining the form factor; some of the hardware issues can be entirely or partially handled by more awareness on the part of software developers.

Here are the major challenges to mobile usability:

  • Font size: Most phones have fonts that are too small to be read by those with less-than-decent eyesight, and there are no screen readers.
  • Button function indication: I believe this issue (which I discuss in the previous section) is the #1 or #2 biggest challenge.
  • Poor defaults: A good example is the cell phone's "assumes" that the user wants to manually input a number; it forces the user to jump through menus to access their contacts; in reality, the default display on a cell phone should be the Contacts list, since that is what people use the vast majority of the time.
  • Resolution: For non-cell devices (i.e., UMPCs and smartphones), the resolution is getting close to what desktop PCs used circa 1998 (800 x 600) if it is not already there. The problem is, those desktop PCs had 15" monitors, not 3" LCD screens. Programmers have the temptation to stuff a lot of functionality into all of those pixels.
  • Contrast and color choices: With current mobile LCDs reaching the color depth of desktop LCDs (or close to it), programmers take advantage of it and produce interfaces with nuanced color. Mobile devices are supposed to be used "on the go" instead of in an environment that is centered around the monitor. As a result, the screen angle often picks up glare; there are poor light sources nearby, and so on. This makes it much more difficult for the eye to pick up subtle color differences.
  • Pointing devices: Programmers are very used to designing GUIs that use mice; it's too bad that mobile computing platforms don't use mice. Stylus, cross pad, track pad, track ball, etc. devices all operate a pointer, but the best way to design for them is subtly different in all sorts of ways.
  • Lack of proper keyboards: Smartphones and UMPCs usually have QWERTY keyboards, but nothing that you would ask someone to do multi-button combinations (like Ctrl+V for Paste) on. Cell phone keypads are agonizing to use.
  • Too many unknowns: Unless you are writing an application specifically for certain devices, you have no idea about details such as: what kind of pointing device will be available; the screen size; the screen resolution; or what type of keypad will be available when you write your application.

Basic usability guidelines

Let's take another look at the challenges, along with a list of basic mobile usability guidelines:

  • Font size: From a usability standpoint, it is nearly impossible to make the font too big; the problem is, the screens are too small to make the letters big enough. Make the letters as large as you think you can get away with.
  • Button function indication: If the user can start your application, they probably understand their device's paradigms enough to let this one be a wash. Make sure that your button indicators are clear and will make sense to your audience.
  • Defaults: Watch your users closely in "field studies" and look for repetitive behavior. For example, if you observe that cell phone users almost always activate the phone and then go to their Contacts list, you just found your default behavior for what should happen when the phone is activated.
  • Resolution: This is hard to handle since you do not know what the resolution will be upfront. In general, put less information on the screen and make it bigger.
  • Contrast and color choices: Use high contrast color schemes and differentiate UI widgets by making them blocks of color, not merely outlined or shaded. Omit fancy graphics such as drop shadows and such.
  • Pointing devices: At the very least, minimize drag/drop operations -- these are a hassle to do correctly with many common mobile pointing devices. Make anything clickable large, especially since touch screens are becoming quite popular.
  • Lack of proper keyboards: Never require keyed input if possible.
  • Too many unknowns: Make your application flexible and use the lowest common denominator when deciding what to use to test.

While usability guidelines for mobile applications are still not nailed down, these common sense guidelines (drawn from traditional usability theory) should go far in helping you write usable apps for mobile computing platforms.

Don't miss these related resources

J.Ja

About

Justin James is the Lead Architect for Conigent.

4 comments
pennatomcat
pennatomcat

"top" links to reduce scrolling. I also have a "back" link at the bottom of every page.

jpellant
jpellant

It is interesting how the definition of things change over time. Originally the term "softkey" was used to define traditional mechanical keys whose functions were software defined (instead of statically bound in firmware). My first exposure to this was the HP test equipment in the early 80s. I was working on the "Smartphone" and the Meridian phones when I was working at BNR (Bell Northern Research-- the R&D arm of Northern Telecom now both part of Nortel (along with Bay Networks)). This was the first commercially viable marriage of CRT with a telephone and became the iconic executive phone. It had 4 'softkeys' on the bottom of the screen that lined up with mechanical buttons beneath them. Currently MFDs (Multi-Function Displays) in trains, boats, airplanes, and most GPSs still use this 'softkey' HCI approach. Honestly-- I don't believe this (softkeys) is a major source of confusion. I would venture it is more a function of poor readability with very low resolution displays (pixels per inch) and poor situational awareness in navigating the menu hierarchies of features crammed into these small physical devices. To really provide value on small displays found in the phone form factor, one must approach printed resolutions (150 DPI) so aged eyes (those of us above 40) can see the small fonts. This would require a VGA like displays in 4?x3? form factors. The technology is getting there (e.g., PSP display 4.3?x2.4? @112 DPI), but is power hungry and expensive. I too, look forward to the promise of OLED and other low power, high resolution technology. Oh and for you mobile developers-- provide better visual situational awareness! $0.02, Jon

Justin James
Justin James

How big of a concern is mobile app usability to you? Do you develop mobile apps? Or do you use them a lot? J.Ja

Justin James
Justin James

Jon - I agree that "situational awareness" is a huge problem. Between the small screen and the fact that these devices are often (nearly always) operated in a "volume off" mode, the means of providing feedback or status change notifications is severely limited. That's why cell phones, for example, tend to interupt whatever you are doing with a screen filling message for every little thing, you would never notice a 10 x 10 pixel icon flashing. J.Ja

Editor's Picks