skip to primary navigation skip to content
 

Vision

Our sense of vision allows us to perceive the world in images, motion and colour. We use information from our vision to move around and interact with objects and environments. The effective design of any product or environment should take the range of human visual capabilities into account.

On this page:

Important note: This page highlights factors to consider when designing or assessing products, and provides some useful suggestions, but the advice should be followed within the context of an Inclusive design process.

Introduction

Vision is used to perceive graphical, textual, colour and shape information, and thus is extremely important for product interaction.

Vision involves different parts of the eye and nervous system working together. Problems with any of these can make aspects of vision more difficult or impossible. Common conditions such as short and long-sightedness can often be corrected by glasses. However, as people age, their eye muscles weaken and the lens becomes stiffer. This means that the eye can no longer adapt to focus on objects at different distances.

Because of ageing and various eye conditions, the structure and function of the eye can also deteriorate, which can result in blurry vision, reduced contrast sensitivity, and loss of vision at the centre or the outskirts of our vision. Colour blindness is another condition, which can make it difficult or impossible to distinguish between certain colours.

Some general visual factors to consider when designing or assessing products are to:

  • Use multiple media. Think about assisting those with vision impairments by supplementing information through auditory or tactile means. However, be careful not to overload people with information and remember that a significant number of people with vision problems also have difficulties with hearing (1.8% of the GB population).
  • Use a simulator. Think about minimising exclusion by ensuring the design remains usable with a vision impairment simulator.

More detailed advice on specific aspects of visual design is given below.

Size and shape of visual elements

Various vision conditions can cause blurry vision and loss of visual acuity. This can make it difficult to see fine detail.

Text and other graphical elements need to be large enough to be seen clearly without being so large that it is difficult to see the whole picture or sentence at one time.

However, it is not just overall size that determines how clear an object is. Users need to be able to distinguish the features or parts of the object. For example, recognising a letter involves distinguishing the strokes in a letter. This is affected by factors such as line thickness and spacing.

Important things to consider in design are to:

  • Consider size. Ensure visual elements (e.g. text, graphics) are big enough to be seen without bringing the product close to the eyes.
  • Consider shape. Make the shapes of elements distinctive and make sure they have enough space around them.
  • Choose fonts carefully. Avoid italicised or decorative font styles for blocks of text or signs. Note that common practice is to use a serif font for large blocks of text, and a sans serif font for signs, labels or headings.
  • Consider symbol clarity. Carefully consider the line thickness, line spacing and overall size when designing graphical symbols or logos.

Contrast

Contrast sensitivity is the ability to perceive the difference in brightness between a foreground and background colour. It is related to the size, distance and illumination of the object to be detected. Maximum contrast occurs with white on black or vice versa.

Contrast sensitivity is important for activities such as detecting and reading text, moving around in the environment, and detecting the outlines of buildings, roads and pavements.

It is important to consider the contrast levels used in designs. Low contrast text will be more difficult to discriminate than high contrast text. In addition, controls on products need to be of sufficient contrast against product chassis to be easily detected.

The diagrams opposite show some different foreground and background colours for text and the corresponding images viewed with a reduced brightness contrast. Note how a sharp colour distinction helps to discriminate between the foreground and background when the brightness contrast is reduced.

Important things to consider in design are to:

  • Consider contrast of objects. Ensure that important objects and features have sufficient contrast with their environment, e.g. adding high contrast strips to the edges of steps can make them much easier to detect and thus reduce falls.
  • Consider contrast of elements. Ensure that graphical and textual elements have sufficient contrast with their background.
  • Choose backgrounds carefully. Be particularly careful with patterned or picture backgrounds as they can interfere with the legibility of text or other graphical elements.

Colour

Colour conveys information about the physical world. It is detected by cells in the eye that function best in relatively bright light. Thus colours are harder to discriminate in low lighting.

Some people are affected by a loss of colour discrimination (or colour blindness). They can still perceive colour, but cannot effectively distinguish between particular colours. The most common form of colour blindness is red-green colour blindness, which affects the ability to distinguish between colours from red to green in the colour spectrum. This can make interaction with products difficult if colour alone is used to provide information.

The diagram opposite shows various foreground and background colour combinations (top) and the corresponding simulated appearance for a red-green colour blind person (bottom). Note that images in which the foreground and background have similar brightness contrasts can disappear when viewed by someone with colour blindness.

Important things to consider in design are to:

  • Supplement colour. Think about using colours to help convey information but ensure they are supplemented by presenting the information in alternative ways (e.g. use shapes and text).
  • Ensure sufficient contrast Consider using colour contrast to help make things stand out, but ensure there is also sufficient brightness contrast
  • Check in greyscale. Check that a product remains usable when its image is converted to greyscale.

Layout

Layout is an important aspect of a design and can have a large impact on its visual accessibility. It is particularly important when considering issues to do with reduced visual field.

Someone's visual field refers to area that they can see without moving their eyes. With increasing age and various eye conditions, the usable visual field can change. This loss can either start from the centre of the visual field (central field loss) or from the outer edge of the visual field (peripheral field loss).

The central visual field is used for focusing and perceiving detail. When it is obscured, tasks that require perception of detail (such as reading) become very difficult. People generally adapt to compensate for this loss and attempt to use the peripheral visual field. However, this part of the retina is less sensitive, resulting in a loss of acuity and contrast sensitivity. The same guidance given for acuity and contrast will help users with central field loss.

A reduction in the usable peripheral visual field results in tunnel vision and can affect mobility. The upper images opposite show a rail ticket machine with widely spaced controls. This can result in problems when viewed with a peripheral loss. The lower images show a proposed redesign of the same machine where the continuity between the required action areas has been emphasised, resulting in a more usable interface.

Important things to consider in design are to:

  • Consider visual field loss. Arrange the design so that it remains visible and usable for those who have some loss of visual field.

Lighting and glare

The context in which a product is used can affect its visual usability.

The level of ambient illumination impacts on the ability to perceive visual detail. The positioning of the light source in relation to the user and the product is also important. For example, users may have difficulty reading the text on the back of a television, or reading a road sign whilst facing the sun.

Glare can also cause significant difficulties when reflective surfaces such as a screen are viewed from a certain angle relative to the light source. Consideration of reflectivity, distance and viewing angle is particularly significant when the position of the product or user is fixed or constrained, such as when viewing a road-sign.

Important things to consider in design are to:

  • Consider lighting conditions. Consider the likely lighting conditions when choosing the size, font and contrast of text and graphics
  • Enable users to control lighting. Contemplate enabling users to control the intensity, position, and angle of lighting sources to best suit their own vision ability and the task.
  • Consider glare. Consider potential issues with glare, based on: the surface finish of the item being looked at, the intensity of the light source, and the angle of view.

Further information

More information on the impact of context on usability can be found in the Activities in context section of the Designing with people website. Different lighting conditions are of particular relevance to vision.

Vision simulations

Vision simulations provide one way to understand the impact of vision conditions on usability. They demonstrate the effects of various vision conditions and impairments. Software simulators show the effects of these conditions on photographs and other images, while physical simulators can be worn while interacting with products and prototypes. It is a good idea to try out designs with a simulation to ensure that they remain usable with various vision impairments.

The following are just a few examples of the vision simulations available:

  • The Impairment simulator software in this toolkit simulates a range of vision impairments at different degrees of severity.
  • The Cambridge Simulation Glasses are also available through this toolkit. These wearable glasses demonstrate the impact of a range of visual acuity losses.
  • Vischeck simulates colour blindess and corrects images to be accessible to colourblind viewers. It can be used online or downloaded.
  • aDesigner simulates different levels of short sightedness, lens transparency and colour blindness. It also checks vision aspects of web accessibility. Is it available for free download.
  • Many blind and visually impaired people use screen readers to read out the contents of webpages. The WebAIM screenreader simulation simulates the use of a screenreader on an example website.
  • Eyeware is a smart phone app designed to help you see through the eyes of someone with an eye condition. This is intended to be used with the Eyeware Cardboard headset, which is available for sale through their website.

Population statistics

Information on the numbers of people in the British population with different levels of capability is available in the 1996/1997 Family Resources Survey. More information on this survey and why it is used here can be found on the Assessing demand and exclusion page of this toolkit.

The graph on the right shows the proportion of the British adult population living in private households who would be excluded by tasks with the following levels of vision demand:

  • No demand: No need to see anything
  • Newspaper headline: As visually clear as a newspaper headline
  • Large print: As visually clear as large print text
  • Newsprint: As visually clear as ordinary newspaper print

Important Note

These statements refer to the level of vision ability that a product or service demands, in order to use it. For a particular demand level, the 1996/97 Disability Follow-up Survey is used to calculate the total number of people who do not have this level of ability, and will therefore be excluded. The GB adult population living in private households was 43.3 million at the time of the survey. Please see the Assessing demand and exclusion page for more detail.

Further information

A report from the Department of Social Security (2000): 'Disability Follow-Up to the 1996/97 Family Resources Survey' provides data on the capability levels in the UK population. (Department of Social Security. Social Research Branch. [computer file]. Colchester, Essex: UK Data Archive [distributor], March 2000. SN: 4090.)

Further information

Statistics on the numbers of people in Great Britain with different levels of vision capability can be found by using the Exclusion calculator in this toolkit.

Further information on vision loss and how to address it in design can be found in the following sources:

Feedback

We would welcome your feedback on this page:

Your name:


Your email:


Please tick this box if you would like to receive updates on inclusive design training and tools from the Engineering Design Centre.

Your comments:


Please leave this field blank (it's a spam trap):
Submit feedback

Any information that you send us will be handled in accordance with our privacy policy.