UX For #togs: Mental Models – Push or Pull?

June 28th, 2012 by Theodore Stark

HNewImageave you ever been in the situation where you go to pull open a door only to find that you should have pushed? What made you think you could have opened the door one-way when, in actuality, it was the opposite? Was it your fault?

Every day, we interact with hundreds, if not thousands, of objects. Based on that experience, our minds establish an expectation of how similar objects should work in the future.

When we begin to play with a new object, we rely on these experiences and expectations to aid us in discovering how this new object should work.

In essence, this is the concept of a mental model.

Mental models help users bridge the gap in terms of cognition and pedagogy. Designers use visual indicators and cues to assist the user in determining the right mental model(s) that should be utilized as part of the exploration of a new interface. In this case, an interface is not limited to the software model. It could be a car gas cap, a toothbrush, a door handle, etc.

Take, for instance, Apple’s iOS unlock mechanism. For those who are unfamiliar, you unlock an iOS device (iPod Touch, iPhone, or iPad) by using your finger to swipe from left to right. The design behind this mechanism is based on the slide lock used in airline lavatories. The iOS design works both from a visual perspective but also from a mental model perspective. The slider button has an arrow providing a hint as to which it should slide. Further, there is a brilliant use of subtle animation in the slide to unlock text to further the implied action.

NewImageAlthough it may not have been the first thing you thought of when unlocking an iOS device, the experience of using an airline lavatory helps you in determining how the iOS device should be used. After all, how many of you have ever been unable to get out of the toilet on an airplane?

With the unlock gesture, Apple then extended the concept of swiping left to right when answering a telephone call when your phone is locked. All based on mental models.

A good design must leverage the mental models of the end users. The only way to achieve this is leveraging the correct visual indicators to trigger the intended mental model.

Consider the following example. You have just logged into your credit card’s website with the intent of checking on your recent card activity. You want to, easily, distinguish between pending and posted charges. Once you have logged in and clicked on the account activity link, you see the following UI control:


In this example, assume this is the first time you have seen this element. So how do you know how to use it? You brain begins examining the new UI control for indicators and/or cues that will serve as mental clues on the control’s intended use. Your brain is essentially looking for patterns based on previous experience.

In this case, the UI control looks a lot like a switch. Your brain, based on previous experience, knows that a switch is binary. Next, it looks at the labels on the switch, pending and posted. Then, based on the examination of the control, and your previous experiences with similar objects, infers that by flipping the switch you may alter the charges you see. All of this mental processing is done in a fraction of a second. Your brain, finally, confirms all of the assumptions and hunches, by clicking on the switch and seeing that when you do, the data toggles from pending to posted charges.

Humans are rather inquisitive and we like to try to figure out how things work. When designing your website, always consider the mental models, and their associated indicators and cues, of your users. What experiences can you tap into that will aid your users in determining how to use your site?

Mental models help us bridge the gap when determining how a new object works. When properly used, and validated via user testing, they can help differentiate your website from others.

Therefore, the next time you find yourself in the situation where you should have pushed rather than pulled, no need to feel embarrassed or frustrated. It reminds us that mental models needs to be validated and designs need to be tweaked. It all focuses around the user and their experiences.

OK! Now get up from your computer and go chase the light.



Check out Ted’s work on his website, and follow him on Twitter.



The Outdoor Photo Gear Blog is an outdoor photographer's resource for photo and camera tips about photography in nature, wildlife and other outdoor settings. Throughout the blog you'll find great articles on composition, lighting, general photography and imaging techniques used by professional photographers.

The Outdoor Photo Gear Store sells great photography equipment and accessories for the wildlife, landscape, and nature photographers. If you haven't visited The Outdoor Photo Gear Store to see all great camera and flash accessories for the avid outdoor photographer, you should check out all the great gear we offer.

Leave a Comment