This document provides an overview of user experience (UX) design and the UX process. It describes the typical roles in UX including research, strategy, interaction design, visual design, and development. Research involves activities like user interviews, personas, and usability testing. Strategy focuses on analysis, journey mapping, and defining goals. Interaction design covers wireframing, prototyping, and user testing. Visual design includes style guides, mockups, and assets. The document also includes examples of personas, journey maps, wireframes, and style guides.
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...
UX Process
1. Dee Sadler | ACP, UGM, ACI, UX Geek
Senior Design Manager | IBM Watson Health
dee.sadler@ibm.com
@DeeSadler
UX Process Demystified
2. What is User
Experience Design?
"User experience" encompasses all aspects
of the end-user's interaction with the
company, its services, and its products.
2
4. UX in general is made up of 4-5 unique
roles and ideas
Discovery Phase: UX Researcher, Strategist
▪ Strategy and content: Data analysis, competitor analysis, customer analysis, personas, journey
mapping, initial focus groups, user testing…
Design Phase: Interaction Designer
▪ Wireframing and prototyping: Co-design sessions, IA, task flows, creating the why and how of
the interaction, based on the user research. Help with user testing.
Develop: UI Designer
▪Execution and analytics: The lay out based on the wires. Defining the standards and design
patterns, style guides, spec docs and assets for the developers.
▪ Visual Design look and feel, animation, adaption to all screens and devices…
Deploy: UI Developer, Front-end designer/developer
▪ HTML, CSS, working with the developers
4
6. RESEARCH
VISUAL
INTERACTION
UI DESIGN
ANALYSIS
PERSONAS
WIREFRAMES
SPEC DOCUMENT
MOCKUPS
COMPONENTS
ASSETS
PROTOTYPING
PROTOTYPES
FOR TESTING
INTERVIEWS
MAPPING
MILESTONE OCCURANCE
AVERAGE
LESS
MORE
GREATER
INFORMATION ARCHITECTURE
INITIAL MEETING
NEEDS ASSESSMENT
USABILITY TESTING
BACK END WORK
COMPONETS
UI
STYLES
PAGE ELEMENTS
FINISHED
PRODUCT
PROTOTYPES
FOR TESTING
USABILITY TESTING
PROTOTYPES
FOR TESTING
USABILITY TESTING
RINSE/ REPEAT
VISUAL STYLE GUIDE
READJUSTMENT
Initial Contact Research Usability
Testing
Interaction
Design
Visual
Design
UI
Design Development
PHASEIMPORTANCEMILESTONES INVOLVEMENT
6
13. HOUSEHOLD INCOME: $48,000
TAX FORM: 1040
PRODUCT: Retail/Assist
CLIENT STATUS: 2 years
AGE: 26
OCCUPATION: Part-time server,
part-time receptionist
LOCATION: Ft. Worth, TX
MARITAL STATUS: Married
DEPENDENTS: 1
HOMELIFE: Married, 1 young child, owns
modest home. Husband employed full-time.
EDUCATION: Some college
HOBBIES: Being a mom, likes to visit flea and
vintage markets, cooking
BEHAVIORS
(social, email, word processing, searching)
to do her own taxes.
GOALS
by a professional
professional prepare her taxes next year.
money for next year. Wants to be able to
have tax prep fees taken out of her refund
“With my life changes, I’m
concerned. I don’t know how to
do my taxes. H&R Block can
make it easy for me.”
Antonia and Greg have a 16-month-old and recently
purchased a modest home. Antonia loves coming to her own
home each day. Antonia believes that you must work hard to
get by in life. She thinks that a happy family equals a happy
life. She has never had much disposable income, and this is
combined income to ease financial strain. She enjoys
time, Antonia enjoys going out to the local flea markets looking
for toys and fun items for her home.
Antonia and her husband agree that all of
their life changes make it too
stressful to tackle taxes on their
making mistakes and needs
the security a professional
can provide when it comes to
concerned about getting the
best refund possible, as they
could use the money.
AntoniaMarried,
One Child
UX RETAIL PERSONAS
H&R Block proprietary and confidential. All rights reserved.
13
22. Review Current State
Dashboard concentrates on Primary number and usage. If more
numbers are available, there should also be a way to access or
change number from Dashboard.
Total Due, and Pay Bill are #1 for calls to care, and complaints in
the App store. Bring it front and center. First thing they see.
Inconsistent bolding, and colors compared to other pages.
Accordian is dated and how the inside functions is too similar to
website, which doesn’t function as responsive, and app, if an
app, should have a better look and feel for viewing.
Fonts are not the same throughout the app. Bold, font family,
sizing, colors are all different.
Looks nothing like the rest of the app. Doesn’t feel a part of the
same app.
Double menus, which are also inconsistent.
Again, the 2nd menu looks nothing like the other page.
Coverage page has inconsistent spacing, font sizing and colors.
Select a store: The use of“Sprint Store”means nothing to the
user. Icon usage and coloring is inconsistent.
Icons are color, while other pages are grey. Size is also different.
Inconsistent icon usage.
Not sure the correct design pattern of a toggle is right here. For
the iPhone, perhaps a check is better.
1
2
3
4
5
1
2
3
4
5
6
7
8
9
10
11
12
13
9
8
10 11 12
13
7
6
Sprint 12:45 PM 100%
Total Due
10/21/15
Manage Devices
Pay Bill$152.96
816-289-3419
Usage Summary Details +
Support
Store Shop Locator
News Manage Network
22
30. 3030
Tools
• Azure
• Adobe Creative Cloud (Edge Animate,
Muse, Dreamweaver, InDesign, Illustrator)
• UXPin
• InVisionApp
• Omnigraffle/Visio
• Sketch
• Affinity Designer
• Balsamiq
• Anything to get the idea across to the
stakeholder and the developers of the
interactions needed.
37. LOGOUTMY CARDS Enrollment Enrollment
Email
Verify Email
Please provide and/or verify e-mail
address and phone number to complete
your enrollment in Online Bill Pay
01 User is not enrolled in Bill Payment
BANK APP UX Uses FLows
Check to Card
Location Finder
Direct Deposit
Emerald Cash Rewards
Bill Payment
Emerald Advance
Savings
More
LOGOUTBACK BACK
Phone
ENROLL ENROLL
Email
Verify Email
Please provide and/or verify e-mail
address and phone number to complete
your enrollment in Online Bill Pay
LOGOUT
Phone
Bill PaymentBACK
CANCEL
CANCEL
SUBMIT
HISTORY
Make a Payment
LOGOUT
Success!
You are now enrolled and can
Use bill pay.
OK
Select a Payee
Amount $
Manage Payees
Date MM/DD/YYYY
BANNER SPACE
$426.58
SWIPE
FOR BALANCE ‹‹
‹‹
H&R Block
Earliest Delivery date
MM/DD/YYYY
Username
Password
Remember Me
Create an Account
Forgot Username
or Password
Log In
Locator Get Help Legal
Member FDIC
Card ending in 5333
Wireframes
41. $105,000
$97,438
TOTAL INCOME
$105,000
TOTAL INCOME
TAXABLE
$92,438
TAXABLE
$8,000
DEDUCTIONS
$8,000
DEDUCTIONS
Home
AT&T 11:56 AM
FEDERAL REFUND STATE REFUND
$3,837 $0 $0
AT&T 11:56 AM
FEDERAL REFUND STATE OWE
$3,837
PERSONAL
INFORMATION
TAKE A PHOTO OF MY W-2
FILE RETURN
FILE RETURN
PERSONAL
INFORMATION
TAKE A PHOTO OF MY W-2
2014 Summary
Search
AT&T 11:56 AM
State Information
Check Return Status
FIle Return
Take a Photo of my W-2
Personal Information
Rate this app
Like us on Facebook
Legal
Privacy Policy
STATE INFO
MY INFO
OTHER
41
52. 52
What — Definition of Design
Thinking
Design thinking is an ideology supported by an
accompanying process. A complete definition
requires an understanding of both.
Definition:The design-thinking ideology
asserts that a hands-on, user-centric approach
to problem solving can lead to innovation, and
innovation can lead to differentiation and a
competitive advantage.This hands-on, user-
centric approach is defined by the design-
thinking process and comprises 6 distinct
phases, as defined and illustrated below.
60. How to make UX Easier
• Identify your users
• Remember the 80/20 rule when looking through data
and catering to the user
• Use task-based design - every function should be
geared to helping them complete a task. Sense their
intent when completing the task.
• Keep it simple
61. How to make UX Easier
• Don't ignore platform UX
• Large calls to action and easily clickable links are easy
for mobile users to navigate
• Get feedback early
• Ensure your buttons and fields are size-appropriate.
Platforms and fingers vary in size.
62. How to make UX Easier
• Standards - user interaction of interfaces, buttons
swipes etc., and not reinventing the wheel.When OS
standards are a part of the requirements.
• Mobile specific touch - location, camera, social
networks, other environmental factors
• Designing for interruption
• Design isn’t perfect - throw away wires and do more
user testing!