Design and Usability of Mobile Apps and Websites

Mobile apps and websites are all the rage, with the deepening market penetration of devices like the iPhone and the Blackberry, over the last few years. Gartner reports that 2009 sales of smartphones increased more than 20% over 2008, with expectations that that growth will continue. Examples of mobile’s growth are everywhere but here are a few:

  • You can now bank from your mobile device
  • you can connect with strangers on the street through services like Urban Signals
  • a Google executive in early 2010, famously predicted that the desktop will be “dead in three years.”

However, a usability study done in the summer of 2009 concluded that mobile was at about the same place as the desktop was in 1994. That is, people were often frustrated by interaction with the mobile web and had difficulty completing simple tasks. Today, a composite usability score for web interactions is about 80%; mobile interactions score 40% or lower.

So if you’re designing an application or a website for mobile, what are some of the things you should know?

Some obvious basics

  • Small screens restrict most interaction to single-tasking.
  • Limited ability to download and upload.
  • Short attention span of users and short bursts of use.

For now, people are still saving their robust interactions for the desktop where they have time to read, reply and otherwise interact.

Does context crown content?

Traditionally, content is king and context is queen, if not prince or princess. But with mobile, some contexts are going to crown content. Users are now interacting with and using information in places where they never have before.

If done right, design for mobile has the ability to be sympathetic to context. An interactive trail map is going to be very useful for a hiker as is a properly robust street map for a stranger to a city. Create an app or site that has the right information for the right context and you may have a winner.

When you design, design for a variety of contexts. The best way to find out how and where users are interacting with your application is to test the interaction in the field, with real users.

Web design vs. mobile design

No one is better equipped to adapt to mobile interaction design than web designers. However, mobile web designers should not make the same mistakes as designers of many websites of the early to mid 1990’s – that is, drafting an old medium onto a new one. To rephrase: print design is to web design as web design is to design for mobile. Design and usability considerations must take this into account.

The page and the card

The above being said, the metaphor of the printed page was carried over to the web with validity in many cases: the vast majority of web pages were two dimensional, flat, and contained a mix of mostly text with some images. All of this was very similar to printed pages in magazines and books. Of course, many other web pages were interactive, multi-dimensional and nothing at all like printed pages.

A metaphor for mobile design is the card. Cards come in many forms, if you think about it. There are playing cards, business cards, credit cards, index cards and many more possibilities. As you design an interaction, think about which card it is most like, what you can learn from the design of that card and what can be carried over to the design of your mobile app or interaction. How is it going to be different?

Some basics of deigning usable apps for mobile

Designers of mobile apps and websites would serve themselves very well if they went back to the essentials of user experience design.

Prototype your design using paper and other models. What features will create loyalty? How and where do you brand your interaction? What kind of interaction are you making and how does the design reflect this – i.e. is it cool and catchy, practical and smart? How can you simplify your mobile interaction? How can you optimize space usage and practicality?

Test on users. Go out an interview them with respect to the feasibility of your app. Send them out in the field with an iteration of your app and let them test it in a variety of locations and contexts, with adequate ways of reporting test findings.

Problems with mobility and usability are mostly platform-based.

Many of the issues related to mobile usability are built right into mobile devices, with their too-small screens and keyboards and problems with infrastructure like interrupted service and limited bandwidth. However, smart app designers will overcome these or at least work around them.

And in fact, many unsuccessful mobile apps and websites fail because of their own poor design. If mobile is important to your company’s strategy, build and design specifically for mobile users. User testing and user experience design can result in at least a 20% increase in effectiveness. This can effect a huge gap in user loyalty to your product over competitors’ interactions.


Author: Michael Mantel