Designing a Web app UI, part 1: The design challenge

by Tom August 18, 2009 • 03:07 pm • Comments (1)

One of the exciting new projects we are working on is designing the user interface (UI) for a Web app due for launch later this year.

Designing a UI for Web-based software can be a much different challenge than designing a Web site used for marketing or company information, and has unique requirements not normally a concern with a downloadable application. Even so, many marketing/company Web sites are now integrating additional functionality and evolving to become more like Web applications

While most Web sites aim to attract your attention, a Web app UI should, in many ways, fall into the background of your behaviors; allowing you to concentrate on your tasks and the data you are entering. It’s a more focused environment than you’ll find with most browser-based activities. You may spend 1 to 5 minutes on a Web site, where you could spend an hour or more per day in a Web app.

In case you were wondering, Facebook and Google Docs are examples of Web apps.

The Web app UI needs to be fast, consistent, and predictable. There shouldn’t be any surprises. Users are still leery at trusting a Web app with important information—a friend’s e-mail is one thing to lose, while a report you worked on for 3 weeks for this Friday’s sales meeting is quite another matter. Somehow it still seems safer when it’s on your laptop on your desk instead of a remote server.

The reality is that the security, functionality, and flexibility gained from manipulating data in a browser are sometimes preferable to a localized approach. The advantages of Web apps are not the focus of this post, but it’s important to draw the correlation between Web apps versus more traditional software, because the UI design challenges are very similar.

With regard to performance considerations, with traditional software you are installing a local application that can draw from all of the resources on your machine—the processor, the RAM, hard disk, etc. A Web app needs to stay light and snappy so as not to overburden the browser it’s running in.

Part 2 will look at our first round of concepts and why we presented the ones we did.