Human Centred Design

Designing for your user is of course, the primary goal of any project. But before you get to the user, it’s important to make sure that your product covers a few basic areas of which the user is a subset of.

The VIMM Model consists of a set of simple guidelines that help make sure your designs are meet the basic requirements of any target audience.

To start off, what is the VIMM Model?

VIMM describes four areas that influence the way a person would perceive your product. The usability goal of VIMM is to reduce the load in these key areas:

1.         Visual

2.         Intellectual

3.         Memory

4.         Motor

Visual Load:

The Visual Cortex of the brain is HUGE. It has many separate areas, each with different functions such as recognising shapes, colours, motion, facial expressions, etc.

Visual load is increased when a user is bombarded with too many signals from a page. This could be the result of too much clutter, unorganised content, poor alignment, busy backgrounds and images, bad aesthetics, or even too many options to choose from.

The first step in knowing how to reduce visual load is to understand how the human eye works. Humans don’t see the whole picture. There are central points of focus, called Fixations and blurred edges, called Fringes. The human eye moves from fixation to fixation, only focusing on one central point.

The brain puts together a continuous visual experience from a sequence of fixations and saccades. Saccadic vision is blurry, because the eyes are moving. This information is often ignored by the brain.

Keeping this in mind, it’s important to design for fixations, rather than having a continuous flow of information that might visually overwhelm the user.

Research based on human vision has provided us with a clear understanding that people:

?          Form mental models on how frequently something will occur on any given channel.

?          Pay attention to different or unique things.

?          Remember to scan if they see a visual cue.

?          Learn to skip useless content (*cough* ads *cough*).

?          Do not like to scan diagonally.

?          Start off on the upper left corner, but eventually move to the centre of the visual field, avoiding the edges.

Eye Tracking studies have shown that people tend to scan a website in an F pattern. It has also been found that it’s easy to influence and predict where the user’s eye will go. People first tend to scan:

?          Complex areas

?          Saturated colours

?          Dark areas

?          Human faces

It’s important to note that colour plays a very important role in guiding the human eye. So it’s vital that colour is used sparingly and with purpose.

Users are also very sensitive to facial details. There is a specific part of the brain just for recognising faces. The Fusiform Face Area (FAA) of our brain allows us to identify faces faster than objects. And even more specifically, people tend to primarily focus on the eyes.

An eye-tracking study conducted by www.usableworld.com shows how users are immediately drawn to faces. Not only that, if the face is looking in another direction, they also tend to pay attention in that direction. Ergo, faces can be used to establish emotional connection with the user (by having the face look directly at them), or direct their attention (by having the face looking at the product).

It’s important to note that task-oriented users tend to ignore the faces, i.e. the more task-oriented a user is, the less likely they are to believe that the information they are looking for is associated with a photo of a face. The takeaway from this point is that it is important to determine whether the photos are being used in information-seeking tasks or browsing tasks.

Here are a few things to keep in mind:

The role of motion: Avoid wiggly stuff. Give users manual control of videos and carousels. And limit the use of animations of any kind.

The Stroop Effect: The Stroop Effect occurs when a user is presented with different signals from the same source. For example, the word “red” written in blue.

Maintain consistency with colours. Do not have clashes between the colour and its meaning. Use only colour codes that people expect.

Redundant Coding: Provide more than one method for people to get a cue. For example, phones provide auditory and haptic feedback when you get a notification.

A few common issues with colour that one should note:

1.         Colour Deficiencies

2.         Purkinje Shift

3.         Chromatic Aberration

4.         Chromostereopsis

5.         Small Field Tritanopia

6.         Insufficient Contrast

7.         Canonic Perspectives

8.         Ambiguous Imagery

To avoid these, always design in monochrome, and add colour to enhance. Make sure there is enough contrast - avoid red or blue on black, avoid yellow on white. Avoid pure blue or red. Avoid red on blue.

Intellectual Load:

You’re not the one making the decisions. Your brain is. More specifically, your lower brain and prefrontal cortex.

Humans are single-channel processors - our attention can only be on one thing. When designing user experiences, do not expect people to do two things at once. While people can handle multiple things when one is automatic - or by switching attention quickly - it is risky.

Similarly, humans cannot respond to two things at once. We can only respond to one and perceive another. For example, it is easy to listen to instrumental music and read, but hard to listen to music with words and read.

The Hick-Hyman Law summarises this perfectly. It states that the time taken to respond to anything increases when presented with an increasing number of alternative stimuli. This can be taken one step further by noting that there is also a response time delay in stopping doing something, known as the Psychological Refractory Period. As a UX practitioner, it’s important to pay attention to the reaction times of every task.

Colour creates an intellectual load as well. Studies have found that using more than 6 colours degrades detection, as people are faced with that many more active stimuli. Note that users can only discriminate among 5 - 9 things in each channel (sound, colour, vibrations, etc).

Ultimately, users will fall back on their training and habits. Design for efficiency, simplicity and established habits to lower their intellectual load.

Memory Load:

Humans have three distinct types of memory, each with progressively fewer details and accuracy. They are:

1.         Sensory Memory

2.         Working (short-term) Memory

3.         Long Term Memory

Sensory Memory or Sensory Information Storage holds sensory information for a brief period of time while the brain works on it. It’s very high resolution, but also lasts for a very short period.

Short Term Memory holds the interpretation of the sensory information for about 20 seconds. For example, if a sentence is spoken, Sensory information holds the sounds, but the Short Term Memory holds the words/meanings. Repetition can help items stay in the Short Term Memory. Avoid relying on Short Term Memory while designing user experiences.

Limit memory and attention problems by not putting too much information on a single screen. Too much ‘noise’ will distract the users from the actionable target. Display the essential information so users do not have to rely on their Short Term Memory. Provide navigation cues and redesign navigation structures so that they provide a good sense of place. Chunking large pieces (typically 3 - 4 chunks of 3 - 4 items) of data can also help to reduce the memory load.

Long Term Memory is where information is stored permanently. But the catch here is that once information is stored in the Long Term Memory, you can only retrieve the interpretation of the event. Most human memories did not happen the way they remember, as they only retrieve their interpretation of what actually happened.

It is important to design for Recall rather than Recognition, where recalling is to pull information from memory without cues, and recognition is to identify information with cues.

Motor Load:

There are limits to how fast people can perform tasks. Human movement can be categorised into Voluntary, Motor, and Reflex.

The usability law most associated with reducing motor load is Fitt’s Law, which states that there is a speed-accuracy trade off associated with pointing, whereby targets that are smaller and/or further apart require more time to acquire.

Keeping Fitt’s Law in mind, it’s important to:

?          Make your targets big.

?          Make your movements short.

?          Take special considerations when designing for touch screens.

If designing for touch screens, make sure to place actionable buttons in areas where the thumb naturally moves without the user having to strain.

In summary:

The VIMM System is a set of guidelines to follow that will help you create products that are easy to use. It focuses on reducing the “load” on your users in four areas: Visual, Intellectual, Memory, Motor.

Visual: Optimise visual comprehension by matching screen flow to the task flow, using good grouping and labelling, including no gratuitous colour.

Intellectual: Simplify decision making providing previews and easy escapes, using controls consistently, providing good system feedback.

Memory: Minimise the memory load by making options visible, designing for recognition vs. recall, providing defaults.

Motor: Minimise movement time and interactions by using short distances and large targets, optimising for the input device, using natural response mappings, reducing windows and steps.