This document provides an overview of user experience (UX) basics, components, goals, and design. It defines UX as encompassing all aspects of a user's interaction with a company, service, or product. The goal of UX design is to improve customer satisfaction and loyalty. Key aspects of UX include usability, utility, aesthetics, and emotions. UX research methods are discussed for different stages of product development, including creating personas, user journey mapping, card sorting, heuristic evaluation, and usability testing of prototypes. Usability testing measures how easy products are to use by observing users perform tasks.

1. USER EXPERIENCE
BASICS
BY LUCIA TREZOVA
Prague
2018

2. UX?

3. UX = USER EXPERIENCE deals with people
interacting with your product or service and
experience they receive from that interaction…

4. UX encompasses all aspects of the end-
user's interaction with the company,
its services, and its products.
https://www.nngroup.com/articles/definition-user-experience/
“The first requirement for an exemplary
user experience is to meet the exact
needs of the customer, without fuss or
bother.
Next comes simplicity and elegance
that produce products that are a joy to
own, a joy to use“
UX COMPONENTS…?
UX isn’t limited to the digital interfaces. UX covers entire journey including all touchpoints a
person takes.
• The process they go through to discover your company’s product
• The sequence of actions they take as they interact with product
• The thoughts and feelings that arise as they try to accomplish their task
• The impressions they take away from the interaction as a whole
Norman Nielsen

5. THE GOAL
OF UX DESIGN IS TO
improve customer satisfaction and loyalty through the utility,
ease of use, and pleasure provided in the interaction with a
product (UserTesting)
UX DESIGN:
„is a process for designing
systems that offer a great
experience to users“(Justin Mifsud)
UX DESIGN:
„is a commitment to building
products with the customer in
mind“ (Marieke McCloskey)

6. UX
vs
USABILITY…?

7. Usability is about task-based interaction. It is the characteristic
of the interface indicating how quickly and easily (how intuitively)
users reach their goals – perform indented task.
It is measured with metrics such as: success rate, error rate,
abandonment rate, time to complete task, clicks to completion, etc.

8. User experience (UX)
is a broader concept including also
how people feel while they interact
with your product. So, UX is also about
emotional connection

9. Excellent usability is definitelly the
crucial component of a great UX
There is no good UX without a good usability
However, good usability is not enough to create an excellent UX….

10. Great UX creates users’ joy and amusement when using your
product, great UX is about the esthetic values being fulfilled.
UX is about a personal identity and a personal mastery being
created or proved by using your product. It is about social
connections gathered or deepened by using your product.
Thus UX affects overall users’ engagement, therefore influences:
likelihood to continue use, and likelihood to recommend your product
to others.
Because….

11. UX IS A
COMPLEX
DISCIPLINE
User experience design is multi-
dimensional including many different
disciplines - such as interaction
design, information architecture, visual
design, usability, etc.

12. UX vs UI ?
For some: UX is a broader term
including UI as one of its
component.
But… there are also different opinions
on their distinction, such as:
UX: covers all processes and touchpoints while UI:
covers only digital interfaces; OR
UX = usable, UI = beautiful

13. WHAT WE HAVE TO CONSIDER IN UX / PRODUCT
DEVELOPMENT ?
Pr. CONTEXT: market trends, competition
Pr. USER: users’ needs, expectations, user behavior, feelings, pain points
Pr. UTILITY to create something which has value for users, what
they need, what is meaningful for them (Product Value Proposition)
Pr. USABILITY: is it easy to understand, easy to use, intuitively
Pr. ESTHETICS: is it beautiful, emotionally satisfying, pleasure to use

14. IT IS NOT A LINEAR PROCESS,
BUT RATHER A CYCLE (iterative
model)
So…unlike in a Waterfall model, we can
go back, refine our thoughts, refine our
product (prototype), research and testing
is multiple, etc.
In UX we do not usually repeat the whole cycle. We start with
linear process, then later on we repeat smaller cycles with
product (prototypes) testing and refinement

15. RESEARCH AND TESTING (VALIDATING)
IS AN INTEGRAL AND CRUCIAL PART
OF UX

16. UX
RESEARCH
Where to start…?

17. What are the best research tools?
…It depends:
ON WHAT YOU NEED TO TEST
=
WHAT IS THE STAGE OF YOUR PROJECT

18. There are many research methods useful in the process of a digital
product development
Different methods are applicable in different phases of a project
TEST EARLY. TEST OFTEN.
TEST WITH REAL USERS.
ITERATE.

19. FROM
EXPLORATION TO VALIDATION
Research methods vary from explorative techniques
(in early phase) to validation techniques (in late phases)
based on research objectives set up according to specific
PRODUCT DEVELOPMENT STAGE
Exploring and gathering users’:
• Needs and motivations
• Expectations and desires
• User stories
• Users’ painful moments and the „moments of true“
• Users’ demographics, U&A analysis
• Market and sector insights
• Competitors analysis and best practices, etc.
Validating and testing:
• Product value and concept idea
• IA / taxonomy testing
• Interaction flow testing
• Overall usability testing on:
• Paper or clickable prototypes
• Visual (overall) design evaluation
• Post launch testing, etc.

20. 8 COMMON METHODS USED IN UX RESEARCH
1. Creating personas
2. User journey mapping
3. 2-minutes interview
4. Card sorting
5. Competitive audit
6. Heuristic evaluation
7. Usability testing: Prototype testing
8. Heat Maps

21. CREATING
PERSONAS

22. Before starting any product development it is
crucial to answer: who are the people we are
designing the solution for?
Personas support user-centered design throughout a project’s lifecycle
by making characteristics of key user segments more salient

23. WHAT IS PERSONA?
A fictional character that represents the group of
users described in a such way that we can picture
him or her as an alive tangible person
To understand better who the users are in order to fulfill their
expectations and needs via newly developed product
PURPOSE

24. Demography
• Age
• Family status
• Education
• Occupation and income
• Where he lives
Appearance and personality
• His characteristic traits
• How he communicates
• What is important to him
• What he likes/dislikes
• What kind of problem he solves
Name of persona........... Credo / quote ...........
Interests
• What he does for fun
• Where you can meet him
• What he reads and watch
• Tools he uses (notebook, i-watch, i-pad…)
• Applications and web sites he fancies
• Social nets he uses
Needs and motivators
• What he aspires for, wishes, dreams
• What kinds of problems he solves
• What are his personal and work goals
• What motivates him
• Who is an idol figure for him
• What is important for him at work
• What frustrates him

25. PROCESS TO CREATE PERSONAS
1. Organize the team cross-functional workshop: using the team
knowledge to make a raw draft of personas
2. Do research: interview (possibly combine with observations) 2 – 6
people per persona to verify and tune the team assumptions and
knowledge about personas
3. Have presentation: show the final image of users’ personas to the
whole team, so each project member has the consistent knowledge of
the users target groups usable during the whole project cycle

26. What is it?
Technique used to define and describe
your groups of potential or current
customers / users
In the very beginning of the project
When to do it?
Why to use it? Objectives?
To ensure that all project members
know who the target user is throughout
the whole project cycle
To understand better your users’ needs
and expectations
RECAP

27. USER JOURNEY
MAPPING

28. A customer journey map tells the story of the customer’s experience

29. A user journey map is a
visualization of the process
that a person goes through in
order to accomplish a goal.
It’s used for understanding and addressing
customer needs and pain points

30. 1. PERSONA: THE USER / THE
CUSTOMER
2. USERS’ STORIES / SCENARIOS
3. TOUCHPOINTS AND DEVICES
CUSTOMERS USE
4. WHAT THE USERS THINK
5. WHAT THE USERS FEEL
6. INSIGHTS + OPPORTUNITIES
Users journey map consists of:

31. OPTIMAL PROCESS TO CREATE USERS’ JOURNEY
1. Organize a team cross-functional workshop in order to:
a. Define a use case you want to explore - in terms of a goal users should reach
b. Make a draft of an optimal (using our product) users’ journey
2. Do research: 2 – 6 interviews (optimally combined with observations) per
persona - to explore real users’ journey: find out what users do, what devices and
touchpoints they use, explore users’ motivation, painful moments, explore what
users think and feel and identify all insights and opportunities
3. Organize a team cross-functional workshop in order to:
a. Visualize the whole process
b. Based on research insights make reco how to improve it and fine-tune the user journey process

32. User journey map example

33. User journey map structure

34. What is it?
Technique used to understand how
people / users behave right now when
reaching their goals
As a second step of the project after
creating persona
When to do it?
Why to use it? Objectives?
To solve and eliminate all painful moments
for the users
To create more effective, more intuitive
and more enjoyable ways for users to
reach their goals using your new product
To describe users’ current flow, users
touchpoints, devices and steps they take
when reaching their goals
To identify users painful moments, to
explore their motivation behind it in order to
create more enjoyable UX
RECAP

35. 2-MINUTE INTERVIEW:
THE BIGGEST ISSUE DETECTION

36. GOAL AND PROCESS
• A semi-quantitative approach if you want to identify the only one
and „the biggest problem and issue“ users face while using SW,
site or app
• It takes 2 minutes to ask: „Tell me one thing you would like to
change in a way you do your job. Just 1 thing.
• You can interview 40+ people = potential for quantitative analysis

37. What is it?
Technique used to identify the most
problematic issue users face when
using current products or services
While you ideate about your future
project idea or while creating
functionalities and features
When to do it?
Why to use it? Objectives?
To find the key „problem“ people want
to get eliminated
To identify the biggest challenges on
the market / industry, etc.
To identify semi-quantitatively users’
painful moments they experience while
using current products or services
RECAP

38. CARD
SORTING

39. What is it?
A method used to help design or
evaluate the information architecture
While you create the content and
structure of your site (taxonomy)
When to do it?
Why to use it? Objectives?
Get insight how to structure the whole
content of your site / app
Test whether the site / app structure
matches the way users think
Find out how users understand and
group information items on your site
Find out how users label categories and
organize items into those categories
RECAP

40. 1. Prepare cards with your site content
items (topics) and blank cards
2. Ask participants to organize cards
(topics) into groups that make sense
to them
3. Ask participants to name (label) each
group they created in a way they feel
it describes best its content - putting
the name of each category on the
blank cards
4. Ask participants to think aloud while
sorting and naming
5. Record thoroughly the whole process
1. Prepare cards with your site content
items (topics) and cards with pre-
defined categories (labels)
2. Ask participants to sort items into pre-
defined categories
3. Ask participants to think aloud while
sorting
4. Record thoroughly the whole process
Open Card Sort Closed Card Sort
PROCESS: there are 2 ways to conduct card sorting

42. COMPETITIVE
AUDIT

43. 1. To keep a finger on the pulse of what other businesses in your
industry are doing, saying and offering
2. Help you position yourself in a differentiated and compelling way
3. To see what works and what doesn’t
4. To collect inspiration
WHAT IS IT GOOD FOR?
Understanding who your key competitors are, how
they’re positioning themselves, what products and
services they offer, and how their talk about them…

44. What is it?
A desk-research method used to learn
industry trends and standards
In the beginning of the project
When to do it?
Why to use it? Objectives?
It is a quick, easy and inexpensive way
to get insight into an industry sector you
are operating in
Find out what and how your competitors
communicate in terms of product offer,
in terms of website design, how they
position themselves, etc.
Find out best practices
RECAP

45. HEURISTIC
EVALUATION

46. • Quick, inexpensive method applicable before testing website or app on real
users
• Based on 10 Heuristic Commandments by Jacob Nielsen ideally broken
down into more specific usability guidelines
• Several experts evaluate the interface toward these guidelines
• Goal: to test how well an interface complies with valid recognized usability
principles = heuristics
• Process: prepare the list of the specific usability principles and let several
experts evaluate how well the interface performs on each using the 5-point
scale
GOAL AND PROCESS

47. 10 Usability Heuristics for User Interface Design
1. Visibility of system status
2. Match between system and the real world
3. User control and freedom
4. Consistency and standards
5. Error prevention
6. Recognition rather than recall
7. Flexibility and efficiency of use
8. Aesthetic and minimalist design
9. Help users recognize, diagnose, and recover from errors
10. Help and documentation

48. DON NORMAN KEY PRINCIPLES OF INTERACTION
DESIGN
• Visibility (also called perceived affordances or signifiers)
• Feedback
• Consistency (also known as standards)
• Non-destructive operations (hence the importance of undo)
• Discoverability: All operations can be discovered by systematic
exploration of menus
• Scalability. The operation should work on all screen sizes, small and
large.
• Reliability. Operations should work. Period. And events should not
happen randomly.

49. What is it?
Technique used to evaluate web sites
or apps by experts
Before testing on real users – before
usability testing
When to do it?
Why to use it? Objectives?
It is a quick and inexpensive way to
eliminate „bugs“, and to improve the
overall interface (flow, content,
structure, etc.)
To create sites or apps in an
accordance with 10 heuristic
commandments
RECAP

50. USABILITY TESTING:
PROTOTYPE EVALUATION

51. One of the most widespread and popular
techniques in UX research applicable during
variety of stages of a project lifecycle
You can have the most beautiful website in the world, but people will
leave immediately if they are unable to figure out how to
navigate your site quickly

52. Usability test
measures on
real users
how easy
an object is to use
In the case of websites and app,
usability has been defined as the ease
at which an average person can use
the software or website to ACHIEVE
INTENDED TASK

53. 1. SPECIFIC USE CASES (SCENARIOS) ARE SET PRIOR TO TESTING
2. USERS OF A PROPER TARGET GROUP ARE INVITED
3. USER IS INSTRUCTED TO PERFORM SPECIFIC TASKS
4. USER IS ASKED TO THINK ALOUD AND COMMENT
5. FACILITATOR OBSERVES BEHAVIOR AND TAKES NOTES
6. THE WHOLE PROCESS IS RECORDED
7. ANALYZED QUANTITATIVELY AND QUALITATIVELY
GOALS AND PROCESS
The goal is to identify any usability problems, and increase the users'
satisfaction with the (digital) product
Usability testing involves 1 user and facilitator in a set up of a moderated interview:

54. ANALYSIS
QUANTITATIVE METRICS:
• success rate
• error rate
• time to complete task
• clicks to completion
• overall satisfaction .
QUALITATIVE INSIGHTS BASED ON:
• all users’ verbal behavior: expressed
thoughts and comments
• users’ non-verbal behavior:
expressed struggles or delight
After completing all interviews results are analyzed quantitatively and qualitatively

55. LOW-FIDELITY prototypes:
paper ones, wireframes, static pages
YOU CAN TEST:
This usability testing method involves creating rough, even
hand-sketched, drawings of an interface to use as
prototypes, or models of a design. Observing a user
undertaking a task using such prototypes enables the testing
of design ideas at an extremely low cost and before any
coding has been done.

56. OR YOU CAN TEST:
This usability testing method involves building an
interactive prototype which can be time and
money consuming due to coding. However it
may enable to test not only interaction design but
also visual design – graphic elements
HIGH-FIDELITY prototypes:
clickable sites,
work-in progress interactive app, etc.

57. MOST EFFECTIVE
RESEARCH TECHNIQUES
involve observing participants doing things
and talking about what they’re doing, rather
than focusing on opinions and discussing
behavior in an abstract manner.
Therefore, the best way to evaluate a new
design is to create a prototype and give
participants something concrete to
interact with and react to.

58. As stated by Jakob Nielsen, 5 users should be able to
identify about 85% of all usability problems

59. What is it?
Technique used to evaluate a web site
or app by testing it with representative
users
During different project stages, in every
iteration of a product development
When to do it?
Why to use it? Objectives?
To eliminate as early as possible
problems with user interface
To safe time and money required by
coding
To identify any usability problems,
collect qualitative and quantitative
data and determine the participant's
satisfaction with the product
RECAP

60. HEAT MAPS

61. On-line quantitative approach to test how
people use the live site or app
How people move on site.
OUTCOME: Move
Heatmaps:
It shows where visitors move
their mouse on the screen.
This gives a very good
indication of where the
visitor is looking on the page
Where people click or tap.
OUTCOME: Click and Tap
Heatmaps:
It shows where visitors click
their cursor on desktop
devices and where visitors
tap their finger on mobile
and tablet devices
How far people
scroll.
OUTCOME: Scroll
Heatmaps:
It shows to what
position your visitors
scroll on the page

62. WHAT KINDS OF PROBLEMS YOU SOLVE BY THIS?
1. The Distraction Test: shows what redundant information distracts users from
following the wanted flow – usually the critical path
2. The Link Test: show when visitors are confused thus using links which are
not active links
3. The Missing Information Test: shows whether visitors look for information
that is missing on your site
4. The Depth-Surface Test: shows whether visitors do not realize there is an
additional content lower on your pages since this is not readily visible
5. Conversion Funnel Test / Abandonment Test: shows when and where
visitors decide to leave your page

64. What is it?
A method used to track users’ behavior
on-line on your completed live site or
app
Before you test your site / app using hi-
fidelity usability testing or along with it,
on a live site / app
When to do it?
Why to use it? Objectives?
It is easy and quick on-line feedback on
your site or app from real users
enabling quantitative testing
To reveal how users move and click on the
site, which elements distract them, or are
missing
To eliminate problematic issues without
necessity to apply hi-fidelity usability testing
RECAP

65. UX PRODUCT DEVELOPMENT - SUMMARY
3. User journey
1. Market insights, trends, competition
2. Persona
4.Product Concept Idea / Value Proposition - Definition
5.Product Concept Idea / Value Proposition – Validating
6.Product Concept Idea / Value Proposition – Refinement

66. 7. Features/functionalities definition, validating
8. Content and structure (IA) development: card sorting
9. Interactions flow (screens) development
10. Interactions flow testing: usability testing (low
fidelity prototypes: sketches, wireframe)
11. Interactions flow refinement
12. Interactions flow testing: usability testing (high
fidelity prototypes: clickable)

67. 13. Visual/graphic design development
14. Overal design - Usabilty testing and refinement
15. Coding
16. Technical testing
17. Launch
18. Post launch testing: heat maps

68. People don't really know what they want!
But people can be amazingly accurate
talking about the things they don't want.
Listen to users and observe the users!
lucia.trezova@gmail.com
www.brandscaping.eu
THAT’S ALL FOLKS, JUST
REMEMBER….