|
|
Line 4: |
Line 4: |
| | | |
| [https://www.nngroup.com/articles/first-impressions-human-automaticity/ First Impressions Matter: How Designers Can Support Humans’ Automatic Cognitive Processing ] | | [https://www.nngroup.com/articles/first-impressions-human-automaticity/ First Impressions Matter: How Designers Can Support Humans’ Automatic Cognitive Processing ] |
− |
| |
− | ==User Persona Design==
| |
− | [https://www.nngroup.com/articles/computer-skill-levels/ The Distribution of Users’ Computer Skills]. There are four levels of technological proficiency users show when interacting with software.
| |
− | * “Below Level 1” = 14% of Adult Population. Can do basic tasks. For example: Select the obvious button: Send, or Delete.
| |
− | * Level 1 = 29% of Adult Population. Can reason out and do multi-step tasks. For example: find all emails from John Smith.
| |
− | * Level 2 = 26% of Adult Population. Can handle more abstract but well-defined tasks. For example: “You want to find a sustainability-related document that was sent to you by John Smith in October last year.”
| |
− | * Level 3 = 5% of Adult Population. Can handle highly abstract and ill-defined tasks. For example: “You want to know what percentage of the emails sent by John Smith last month were about sustainability.”
| |
− | * Can’t Use Computers = 26% of Adult Population. This is learned helplessness, they learned that they couldn't use computers from very badly designed programs.
| |
− |
| |
− | ==Designing for Accessiblity==
| |
− | Something to be aware of is that users are often limited in some way. It might be needing glasses or having carpel tunnel syndrome. There are quick notes on [https://accessibility.blog.gov.uk/2016/09/02/dos-and-donts-on-designing-for-accessibility/ accessible design] that make the UX easier for everyone.
| |
− |
| |
− | [http://blog.usabilla.com/how-to-design-for-color-blindness/ Designing for users with color blindness]
| |
− | * Use both colors and symbols
| |
− | * Keep it minimal
| |
− | * Use patterns and textures to show contrast
| |
− | * Be careful with contrasting colors and hues
| |
− | * Avoid certain color combinations that are difficult to distinguish
| |
− | * Test page in different filters [https://www.toptal.com/designers/colorfilter].
| |
− |
| |
− | Designing for users with low vision
| |
− | * use good contrasts and a readable font size
| |
− | * publish all information on web pages (HTML)
| |
− | * use a combination of colour, shapes and text
| |
− | * follow a linear, logical layout -and ensure text flows and is visible when text is magnified to 200%
| |
− | * put buttons and notifications in context
| |
− |
| |
− | Designing for users with physical or motor disabilities
| |
− | * make large clickable actions
| |
− | * give form fields space
| |
− | * design for keyboard or speech only use
| |
− | * design with mobile and touchscreen in mind
| |
− | * provide shortcuts
| |
− |
| |
− | Designing for users of screen readers
| |
− | * describe images and provide transcripts for video
| |
− | * follow a linear, logical layout
| |
− | * structure content using HTML5
| |
− | * build for keyboard use only
| |
− | * write descriptive links and heading - for example, Contact us
| |
− |
| |
− | Designing for users who are deaf or hard of hearing
| |
− | * write in plain English
| |
− | * use subtitles or provide transcripts for video
| |
− | * use a linear, logical layout
| |
− | * break up content with sub-headings, images and videos
| |
− | * let users ask for their preferred communication support when booking appointments
| |
− |
| |
− | Designing for users with dyslexia
| |
− | * use images and diagrams to support text
| |
− | * align text to the left and keep a consistent layout
| |
− | * consider producing materials in other formats (for example, audio and video)
| |
− | * keep content short, clear and simple
| |
− | * let users change the contrast between background and text
| |
− |
| |
− | Designing for users on the autistic spectrum
| |
− | * use simple colours
| |
− | * write in plain English
| |
− | * use simple sentences and bullets
| |
− | * make buttons descriptive - for example, Attach files
| |
− | * build simple and consistent layouts
| |
The User Experience is more than just what it looks like but how it works.