PART THREE

ESSENTIALS OF DESIGNING
INTERACTIVE SYSTEMS

CHAP. 5 PRINCIPLES AND PRACTICE OF

INTERACTIVE SYSTEMS DESIGN
CHAP. 6 USER-INTERFACE DESIGN GUIDELINES
CHAP. 7 EXPERIENCE DESIGN
Chap. 7 Experience design

1/17/2017 By ZIRARUSHYA Pierre Celestin 2

Introduction
 User experience (UX) refers to a person's
total experience using a
particular product, system or service.
 The international standard on ergonomics of
human system interaction, ISO 9241-210, defines
user experience as "a person's perceptions and
responses that result from the use or anticipated
use of a product, system or service"
 The ISO also list three factors that influence user
experience: system, user and the context of use.
 Note that usability addresses aspects of user
experience
1/17/2017 By ZIRARUSHYA Pierre Celestin 3
What to design
 Need to take into account:
◦ Who the users are
◦ What activities are being carried out
◦ Where the interaction is taking place

 Need to optimize the interactions users have with a

product
◦ So that they match the users’ activities and needs

1/17/2017 By ZIRARUSHYA Pierre Celestin 4

DEFINING DESIGN
 What is design? A simple definition is: achieving
goals within constraints
 Goals
◦ What is the purpose of the design we are intending
to produce?
◦ Who is it for?
◦ Why do they want it?
 For example, if we are designing a wireless
personal movie player, we may think about young
affluent users wanting to watch the latest movies
whilst on the move and download free copies,
and perhaps wanting to share the experience with
a few friends.

1/17/2017 By ZIRARUSHYA Pierre Celestin 5

DEFINING DESIGN (2)
 Constraints
◦ What materials must we use?
◦ What standards must we adopt?
◦ How much can it cost?
◦ How much time do we have to develop it?
◦ Are there health and safety issues?
 In the case of the personal movie player:
◦ does it have to withstand rain?
◦ Must we use existing video standards to
download movies?
◦ Do we need to build in copyright protection?

1/17/2017 By ZIRARUSHYA Pierre Celestin 6

DEFINING DESIGN (3)
 We cannot always achieve all our goals within the
constraints.
 So perhaps one of the most important things about
design is: Trade-off
 Choosing which goals or constraints can be relaxed
so that others can be met.
 For example, we might find that an eye-mounted
video display, a bit like those used in virtual reality,
would give the most stable image whilst walking
along.
 However, this would not allow you to show friends,
and might be dangerous if you were watching a
gripping part of the movie as you crossed the road.

1/17/2017 By ZIRARUSHYA Pierre Celestin 7

Understanding users’ needs
◦ Need to take into account what people are good and
bad at

◦ Consider what might help people in the way they

currently do things
◦ Think through what might provide quality user
experiences

◦ Listen to what people want and get them involved

◦ Use tried and tested user-centered methods

1/17/2017 By ZIRARUSHYA Pierre Celestin 8

 User Experience and Usability
(Preece et al.)

 “User experience”
◦ Encompasses more then usability
 (see innermost)
 Detail, next slide
◦ Also, note Preece’s elements of usability

 In part an affective element of the interface

1/17/2017 By ZIRARUSHYA Pierre Celestin 9

User Experience & Usability
 User Experience goals
 “User Experience” - goals
◦ Satisfying - Rewarding
◦ Fun - Support creativity
◦ Enjoyable - “emotionally fulfilling”
◦ Entertaining - Helpful
◦ Motivating - Aesthetically pleasing
◦ Motivating - …and more

 Usability and user experience goals …

◦ How do usability goals differ from user experience goals?
◦ Are there trade-offs between the two kinds of goals?
 e.g. can a product be both fun and safe?
◦ How easy is it to measure usability versus user experience goals?

1/17/2017 By ZIRARUSHYA Pierre Celestin 11

? WHAT IS
USER
EXPERIENCE
DESIGN

! We believe that User Experience

Design is a seamless blend of…

1/17/2017 By ZIRARUSHYA Pierre Celestin 12

 Creativity
Innovation
Technology
Psychology

Graphics

Ideas
Aesthetics Art

Engineering
Strategy

…and more >>

1/17/2017 By ZIRARUSHYA Pierre Celestin 13

User Experience
Design is
not just about
designing good
looking websites
or interfaces

1/17/2017 By ZIRARUSHYA Pierre Celestin 14

It is about making
it work for you

1/17/2017 By ZIRARUSHYA Pierre Celestin 15

 05 Advocate

04 Client

It’s about designing 03 Customer

websites that can 02 Prospect
convert…
01 Suspect

1/17/2017 By ZIRARUSHYA Pierre Celestin 16

Websites that
build on your
brand image

Websites that
makes the
emotional
connect

1/17/2017 By ZIRARUSHYA Pierre Celestin 17

Websites that can
generate leads

1/17/2017 By ZIRARUSHYA Pierre Celestin 18

Websites
that sell more

12 3 4 56 789012

1/17/2017 By ZIRARUSHYA Pierre Celestin 19

Interfaces which are a
pleasure to use

1/17/2017 By ZIRARUSHYA Pierre Celestin 20

Interfaces which can
differentiate your
product from the rest

1/17/2017 By ZIRARUSHYA Pierre Celestin 21

User Experience It is about
Design is not engaging,
just about acquiring &
attracting retaining
your visitors them

1/17/2017 By ZIRARUSHYA Pierre Celestin 22

Pretty designs But you need User Experience Design
attract to attract, engage, acquire and
retain

ATTRACT ENGAGE ACCQUIRE RETAIN

1/17/2017 By ZIRARUSHYA Pierre Celestin 23

Today it’s
not
much
about the
wow
factor

1/17/2017 By ZIRARUSHYA Pierre Celestin 24

…it’s about the

OOMPH
factor !

1/17/2017 By ZIRARUSHYA Pierre Celestin 25

WOW FACTOR OOMPH FACTOR

ATTRACT ENGAGE ACCQUIRE RETAIN

1/17/2017 By ZIRARUSHYA Pierre Celestin 26

 We call it
SEDUCTIVE
DESIGN:

And that’s no easy task!!

1/17/2017 By ZIRARUSHYA Pierre Celestin 27

 Creativity
Innovation
Technology
Psychology

Graphics

ideas
Aesthetics Art

Engineering
Strategy

It takes the coming together of many

heads
1/17/2017 By ZIRARUSHYA Pierre Celestin 28
 Usability Functional
Design Design
Content
Design

Visual
Design

Information
Architecture

Interaction
Design

User Web
Research Strategy
Ideas/
innovation

1/17/2017 By ZIRARUSHYA Pierre Celestin 29

 U can Design user
experience for …

Corporate & eCommerce Web/ mobile

Brand websites/ application
Websites Online businesses interfaces

1/17/2017 By ZIRARUSHYA Pierre Celestin 30

 Idea/ Content design
Conceptualization

Information
Architecture
Web
Communication
Strategy
Corporate/ Brand
Websites

Development Communication
CMS / Manual Design

Visual & Graphic

Branding &
Design
Identity

1/17/2017 By ZIRARUSHYA Pierre Celestin 31

 User
Requirement Interaction
Analysis Design

Usability Design
Understanding
The idea,
opportunity,
business eCommerce Websites/
Online Business Portals
Development
CMS / Manual Wire framing

Visual/ Information
Graphic Architecture
Design

1/17/2017 By ZIRARUSHYA Pierre Celestin 32

 Personas/ Interaction
Scenarios Design

Usability Design
Understanding
The product,
product strategy
Interfaces for SaaS/
On-premise Applications

Development
CMS / Manual Wire framing

GUI Design & Information

Iconization Architecture

1/17/2017 By ZIRARUSHYA Pierre Celestin 33

BEFORE AFTER

1/17/2017 By ZIRARUSHYA Pierre Celestin 34

1/17/2017 By ZIRARUSHYA Pierre Celestin 35
1/17/2017 By ZIRARUSHYA Pierre Celestin 36
1/17/2017 By ZIRARUSHYA Pierre Celestin 37