The Weilers version 1

Jack, Maggie and their 5 year old Melissa approach the entrance to the brand new shopping mall that just recently opened in their hometown. Melissa, thrilled with the opportunity to finally go to a Build-A-Bear Workshop store, skips ahead in pure excitement.

Just inside the main walkway, Jack sees the large vertical store directory and map. Rather than getting lost in such a large place through exploratory wandering, he decides to use the directory to figure out exactly where in the mall the Build-A-Bear store is.

The directory in front of him is typical. A floor plan is illustrated that labels each store using a particular arbitrary number. Those numbers are referenced and sorted by category making up the store directory.

Immediately, Jack’s frustration begins building. He struggles to determine what category Build a Bear falls into…he’s looking under Gifts, then Baby…no luck. Maggie chimes in and finally finds the store under of Fun & Games with a label of L34.

Once again, frustration builds when neither of the family members can locate their current location. They can’t seem to see any “You are here” indicator. Annoyed, by this barrier, Jack and the family give up, and walk further inside the mall in hopes of eventually run into the store.

The Weilers version 2

Jack, Maggie and Melissa are excited about visiting the Build-A-Bear Workshop in the new shopping center. As they approach the inside for the first time, they see a crowd of people gathering at the story directory kiosk.

As they approach the crowd, they are amused to see that the mall is using a multi-touch interactive table to display the shopping centers layout and directory. Jack places his fingers on a portion of the screen to begin. That portion of the interface lights up and generates a pop-up where with option to locate a store or to begin a video chat with the Mall’s general Customer Service.

Jack is presented the option to filter his search by general category, proxemics to his current location, or alphabetized store name. Jack selects the alpha search, which reveals a vertical list of stores with location jump controls, as well as a text field with touch keyboard.

Excited about this experience, Melissa engages with the table and uses the location jump control to find the stores that begin with “B”. Build-A-Bear Workshop displays within the list. As she selects the name, an interactive floor plan of the mall immediately populates illuminating the stores location.

The floor plan at first shows the entire mall’s layout with call-outs to their current and Build-A-Bear location. Then, the display slowly zooms and reorients to the family’s current position and animates an eye level view of the walking route path from their location to Build-A-Bear’s.

Having visually seen that the store is located on the second level next to the food court, the family heads that way still excited by the engaging user experience.

The difference

The two different scenarios provide polar examples of how a common task of locating information can lead to a frustrating or an enriching user experience. The solution was not just the power of the technology. It was also, and more importantly, how the content was organized, displayed, and made available to the user.

In the first scenario, all of the information was presented at one level tier without the user’s ability to use controls to drilldown, sort, and filter information for their current needs. This lack of user control caused the experience to fail.

In the second scenario, the Weilers had access to a variety of information controls, such as location jump, search within, zoom and scale, and sort and filter, which made searching for relevant information much quicker. Each particular control provided a unique way of revealing different types of information.

Information Controls in the Mobile Space

Consider how we understand the use of a magnifying glass to see detail. Some zoom and scale controls use this metaphor to communicate ability to see more or less information.

For more information on designing controls for people, refer back to chapter 5: Revealing More Information, A suggested read is, The Design of Everyday Things, by Donald Norman, 1988.

Patterns for Information Controls

Using the Information Control widgets allow users to quickly access they type and amount of information within the current state of the device. Within this chapter, the following patterns will be discussed.