From Usability to User Experience

www.UsabilityOne.com
Background
From Usability to User Experience
2011
Copyright & Confidentiality
The concepts, ideas, strategies, information, materials, plans and copy contained in this document are presented in absolute confidence and are the property
of UsabilityOne and must not be reproduced, adapted or communicated to third parties in anyway without express permission of UsabilityOne.

Melbourne Trams – a short story

INTRODUCTIONS
• Organisation
• Role
• Current Project

SCOPE
Introductions
Definitions
Historical Context
Heuristics
Background Key Principles
Information Architecture
Forms/transactions
Search
Multimedia
Social Media
Mobile and other Platforms
Writing for the web Techniques and Tools
Why writing for the web is so important
Top 12 writing tips with examples
Website style guides
Contextual analysis
Concept Testing
Card Sorting
Usability Testing (Moderated/Online)
Website Analytics

Background

WHAT IS USABILITY?
• ...A term used to denote the ease with which people can employ
a particular tool or other human-made object in order to achieve
a particular goal [Wikipedia.org]
• ...How well users can learn and use a product to achieve their
goals and how satisfied they are with that process [Usability.gov]
• The effectiveness, efficiency and satisfaction with which
specified users achieve specified goals in particular
environments. [ISO]

WHAT IS USER EXPERIENCE?
User experience (UX) is about how a person feels about using a
product, system or service. User experience highlights the
experiential, affective, meaningful and valuable aspects of
human-computer interaction and product ownership, but it also
includes a person’s perceptions of the practical aspects such as
utility, ease of use and efficiency of the system. User experience is
subjective in nature, because it is about an individual’s feelings and
thoughts about the system. User experience is dynamic, because it
changes over time as the circumstances change. [Wikipedia.org]

MATCHING THE SYSTEM WITH THE USER’S NEEDS
• Developers usually build a system to meet a certain workflow
View
products
Select
product
Checkout Credit card
Purchase
complete
• Users often take a different workflow to reach their goal
View
products
Make
comparisons
Select
product
Check
shipping
costs
Checkout
Look for
discounts
coupons
Credit card
Purchase
complete
• Users needs are often different to business and designer’s needs

MATCHING USER NEEDS WITH BUSINESS OBJECTIVES
Find form easily
Complete form quickly
Sense of security
Easy to find information
User
needs
Business
objectives
Collect customer information
Secure transaction process
Easily updatable site
Work with existing stock
management system

WHY SHOULD I CARE ABOUT USABILITY AND USER EXPERIENCE?
• Ensures users can complete their goals as quickly and simply as
possible
• Encourages users to undertake new activities using the product
• Ensures greater efficiency
• Less calls to help desks
• Faster task completion for staff
• Greater spend per sale
• Improves user’s perception of the brand
• Increases repeat use of the product
• Competitive advantage

CASE STUDY
Metlink wanted to increase awareness and usage of their late night
bus service

CASE STUDY
Users did not associate the Nightrider links with late night bus
services

CASE STUDY
• We suggested a more descriptive label
• This small change increased visitation to this
area of the site by 128%

http://whichtestwon.com/

How far we’ve come

COMPUTERS FOR PEOPLE
Xerox Star Apple Lisa
Circa 1981 Circa 1982
Microsoft Windows
Circa 1985
NOTE: Internet comes to Australia June 1989
56 kb/s connecting the University of Melbourne
and the University of Hawaii

ACCESSING THE INTERNET
1990s
• Desktop software
• Growth of the internet
• Email for communication
• World Wide Web for information
• Online shopping

ON THE MOVE
2000s
• Online software
• Mobile computing
• Social networking
• Touchscreen interfaces
• Online collaboration

TODAY
2010s
• Ubiquitous and Pervasive technologies
• Mobile computing
• Location based Technologies
• Voice Recognition software
• Tablets, eReaders
• Social Networks platforms for Mass
Movements

MORE OPPORTUNITIES
• As technology advances, so too do the opportunities
• However, with each new opportunity comes potential
difficulties for users
“How do I move or
delete my apps?”
“What does the RSS
button do?”
“What is my security
code?”

The basis of usability

NIELSEN’S 10 HEURISTICS
• Visibility of system status
• Match between system and the real world
• User control and freedom
• Consistency and standards
• Error prevention
• Recognition rather than recall
• Flexibility and efficiency of use
• Aesthetic and minimalist design
• Help users recognise, diagnose, and recover from errors
• Help and documentation

1. Visibility of system status
Keep users informed about what is going on, through appropriate feedback within
reasonable time

2. Match between system and the real world
Speaking the users' language, with words, phrases and concepts familiar to the user,
rather than system-oriented terms. Follow real-world conventions, making information
appear in a natural and logical order.
Useful techniques to help you match the system with the real world
• Metaphors
• Natural Mappings
• Affordances
• Direct Manipulation

2. Metaphors
Desktop Folders Files
Online book Vcr

2. Providing natural mappings

2. Affordances
Chairs – For sitting Knobs – For
turningTables – For putting things on
Slots – For inserting
Handles – For spinning Buttons – For pressing Switch – For toggling

2. Affordances
Using standard affordances, users know what they can do
Drop down list Type here Button to be
pressed
Clicking here does nothing
Must click here
What to do with this?

2. Direct Manipulation
Drop
Drag
Sorting by column headers

3. User control and freedom
Users often choose system functions by mistake and will need
a clearly marked "emergency exit" to leave the unwanted state
without having to go through an extended dialogue.
Support undo and redo.

4. Consistency and standards
Users should not have to wonder whether different words,
situations, or actions mean the same thing. Follow platform
conventions.
Web conventions
• About Us
• Contact Us
• Home
Desktop conventions
• File
• Edit
• Menu
Yahoo! Design Patterns

5. Error prevention
Even better than good error messages is a careful design
which prevents a problem from occurring in the first place.
Either eliminate error-prone conditions or check for them and
present users with a confirmation option before they commit to
the action.
• Prevention is always better than the cure

6. Recognition rather than recall
Minimize the user's memory load by making objects, actions,
and options visible. The user should not have to remember
information from one part of the dialogue to another.
Instructions for use of the system should be visible or easily
retrievable whenever appropriate.

7. Flexibility and efficiency of use
Accelerators -- unseen by the novice user -- may often speed
up the interaction for the expert user such that the system can
cater to both inexperienced and experienced users. Allow
users to tailor frequent actions.
Quick links for frequent tasks
Shortcut keys

8. Aesthetic and minimalist design
Dialogues should not contain information which is irrelevant or
rarely needed. Every extra unit of information in a dialogue
competes with the relevant units of information and diminishes
their relative visibility.

9. Help users recognise, diagnose, and recover from errors
Error messages should be expressed in plain language
(no codes), precisely indicate the problem, and
constructively suggest a solution.

10. Help and documentation
Even though it is better if the system can be used without
documentation, it may be necessary to provide help and
documentation. Any such information should be easy to
search, focused on the user's task, list concrete steps to
be carried out, and not be too large.

Don’t use documentation
unless needed
Poorly written documentation can
make a simple task harder

REFERENCES
• Heuristics (Jakob Nielsen)
http://www.useit.com/papers/heuristic/heuristic_list.html
• Book - Usability Engineering (Jakob Nielsen)
• Affordances - Design of Everyday Things (Donald Norman)
http://www.jnd.org/books.html#DOET
• Direct Manipulation (Ben Shneiderman)
• http://www.interaction-
design.org/references/authors/ben_shneiderman.html

From Usability to User Experience

Recommended

Recommended

More Related Content

Viewers also liked

Viewers also liked (10)

Similar to From Usability to User Experience

Similar to From Usability to User Experience (20)

Recently uploaded

Recently uploaded (20)

From Usability to User Experience