User Interface Engineering

Over at UXMatters, Joost Willemsen has written an insightful article about single-screen interfaces.

Joost points out that single-screen interfaces have a big advantage over page-based approaches because they allow users to work in their own, non-linear way. He says:

“In a multi-page environment, there are likely to be separate pages for almost every task in the purchasing process, including a search page, a page listing search results, pages displaying detailed information about individual search results, some options pages, pages showing pricing and availability, and booking pages. It’s difficult to make sense out of such dispersed information. When customers are looking at a page showing details about a particular search result, they can’t see the list of search results, making it difficult to compare and rank different results. When they are looking at a list of results they can’t see the search criteria that produced them, making it difficult to adapt their search criteria and come to grips with all the different offerings.

Customers who need to assess a great many search results must visit and revisit a lot of pages. In doing so, they often lose track of the big picture and waste a lot of time clicking back and forth and waiting for the server to deliver pages. They may become disenchanted with an online travel site that seems to punish them for not knowing exactly what they want.”

Although Joost doesn’t mention them specifically, an excellent example of a single-screen travel interface that realizes much of what he’s talking about is Kayak.com, who have continually iterated their interface over time with incredible results. They combine a single-screen with various filter mechanisms to make finding the right flight really easy. Here’s a screenshot:

To get the real experience of using Kayak’s single-screen interface, simply perform a search from their homepage. The results are a great use of what Joost calls “spatial adjacency”, meaning that multiple items (that used to be on separate pages) are now in adjacent positions on the screen.

This entry was posted on Wednesday, November 22nd, 2006 at 2:06 pm and is filed under Experience Design, Uncategorized, Web Applications, Web Development . You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.