SlideShare a Scribd company logo
1 of 25
Download to read offline
UX FLOW AND PROCESSby Febrina Rahdiyani
UX PROCESS
#1
Strategy
#2 Research
#3 Analysis
#4 Design
#5 Development
#6 Testing
#8
Launch
#7 Evaluate
based on http://uxmastery.com/resources/process/
STRATEGYA plan of action to achieve goals
COMMUNICATION
USER
IDENTIFICATION
BRAND
ALIGNMENT
BUSINESS
OBJECTIVE
Set product objective,
main goal, and the value
that we want to offer
Identify the user, their
needs, goals, and what
are they interested about
The most important things
are the message delivered,
understood, and lead people
to do the action
Objectives:
Expectations to be Achieved
Measuring the Success
Priority
USER IDENTIFICATION
PERSONA EXAMPLE
RESEARCHThe systematic investigation
COMPETITOR
RESEARCH
USER
RESEARCH
COMPETITOR PROFILE
PRODUCT EVALUATION
PRODUCT USAGE ANALYSIS
USER INTERVIEWS
SURVEYS
FOCUS GROUP DISCUSSION
Objectives:
Establish Facts
Reach New Conclusions
Create an Informed UX
ANALYSISGain more insights from the
information that collected in
the Research phase.
SCENARIOS
SYSTEM ANALYSIS
STORYBOARDS
USE CASES
The stories and context
behind why a specific
user comes to your site.
A visual sequence of events
is used to capture a user’s
interactions with a product.
List of steps between
users and systems to
achieve the goal.
A problem solving technique
to study how well each
components work and interact.
Objectives:
Define Product Definitions,
Priorities, and Plan
Formal Design Deliverables
STORYBOARD
DESIGNDesigning the system based on the information from Analysis phase by creating a prototype.
WIREFRAMINGSITEMAPPING
Objectives:
Put Ideas into Design
Evaluate the Design
Refine the Design
SITEMAPPING
Step 1
Create prototype sketch on the paper, based on the information
during Analysis phase
How to do the wireframing
SITEMAPPING
Step 2
Evaluate the sketch with the team
How to do the wireframing
SITEMAPPING
Step 3
Create the functional wireframe
How to do the wireframing
Keep in mind that …
In creating wireframes, keep it simple!
Do not use colour
Use only one
generic font
Do not use image
DEVELOPMENTDevelop a product based on the design that
has been made in Design phase.
DEVELOPMENT
Starts from the
wireframe
Create the visual design
(high-fidelity prototype)
The programmer codes
the program
TESTINGDoing a testing to check the
quality of the product that
have been developed in
Development phase.
How to do the testing?
USABILITY TESTING
A technique to evaluating a product by testing it
directly to representative user
Perform TasksUsers
Watch Listen Take NotesObserver
During the user perform tasks, the observer will …
What you need to do to run an effective usability test?
Step 1
Develop a solid test plan
10 Essential Usability Metrics
1. Completion Rates
2. Usability Problems
3. Task Time
4. Task Level Satisfaction
5. Test Level Satisfaction
6. Errors
7. Expectation
8. Page Views/Clicks
9. Conversion
10. Single Usability Metric (SUM)
What you need to do to run an effective usability test?
Step 2
Create the task scenarios
These are 3 task-writing tips to improve the
outcome of usability testing
1. Make the task realistic
2. Make the task actionable
3. Avoid clues and describing steps
What you need to do to run an effective usability test?
Step 3
Recruit the participants
What you need to do to run an effective usability test?
Step 4
Start the usability testing. Analyze and report the findings.
What if we get …
POSITIVE
FINDINGS
NEGATIVE
FINDINGS
It is useful because what is working well must
be maintained through further development.
If there is a lack of design in the product, we
need feedback from the user what should be
done to fit the users’ needs and fix them.
LAUNCHLaunch a product that
has been developed in
Development phase and
passes the quality
checking in the Testing
phase.
USAGE MEASUREMENT & ANALYTICS
To do the measurement, we can use …
USAGE MEASUREMENT & ANALYTICS
LAUNCH
We could see :
1. Site Usage
• Visits
• Pages/Visit
• Pageviews
• Avg. Time on Site
• Bounce Rate
• % New Visits
2. Visitors Overview
3. Traffic Sources Overview
4. Browsers used to open the
website
USER FEEDBACK & ANALYTICS
After the products being launched, we still can get feedback and review from
the user and do the analysis from it.
The best ways to get feedbacks are …
Conduct
an online survey
Feedback boxes
LAUNCH
Reaching out the user
directly
THE END

More Related Content

What's hot

An Easy Explanation of UX (User Experience) By Think 360 Studio
An Easy Explanation of UX (User Experience) By Think 360 Studio An Easy Explanation of UX (User Experience) By Think 360 Studio
An Easy Explanation of UX (User Experience) By Think 360 Studio Think 360 Studio
 
The UX Process Behind Compelling User Experiences
The UX Process Behind Compelling User ExperiencesThe UX Process Behind Compelling User Experiences
The UX Process Behind Compelling User ExperiencesBelatrix Software
 
THE UX INTERVIEW – 3 Quick Questions. 3 Short Answers.
THE UX INTERVIEW – 3 Quick Questions. 3 Short Answers.THE UX INTERVIEW – 3 Quick Questions. 3 Short Answers.
THE UX INTERVIEW – 3 Quick Questions. 3 Short Answers.Marc-Oliver Gern
 
2014 Evolving Your UX Process 1up
2014 Evolving Your UX Process 1up2014 Evolving Your UX Process 1up
2014 Evolving Your UX Process 1upTom Brinck
 
[Srijan Wednesday Webinars] Bull Session on UI/UX
[Srijan Wednesday Webinars] Bull Session on UI/UX [Srijan Wednesday Webinars] Bull Session on UI/UX
[Srijan Wednesday Webinars] Bull Session on UI/UX Srijan Technologies
 
Product and UX - are the roles blurring?
Product and UX - are the roles blurring?Product and UX - are the roles blurring?
Product and UX - are the roles blurring?Jesse Gant
 
User Experience: Process and Guidelines
User Experience: Process and GuidelinesUser Experience: Process and Guidelines
User Experience: Process and GuidelinesNirish Shakya
 
Tampa UX November 2014 Meetup
Tampa UX November 2014 MeetupTampa UX November 2014 Meetup
Tampa UX November 2014 MeetupMike Gallers
 
UI/UX presentation by Roshan Karunarathna
UI/UX presentation by Roshan KarunarathnaUI/UX presentation by Roshan Karunarathna
UI/UX presentation by Roshan KarunarathnaRoshan Karunarathna
 
Product Design and UX / UI Design Process in Digital Product Development
Product Design and UX / UI Design Process in Digital Product DevelopmentProduct Design and UX / UI Design Process in Digital Product Development
Product Design and UX / UI Design Process in Digital Product DevelopmentVolodymyr Melnyk
 
UX Lesson 4: Task & Feature Analysis
UX Lesson 4: Task & Feature AnalysisUX Lesson 4: Task & Feature Analysis
UX Lesson 4: Task & Feature AnalysisJoan Lumanauw
 
Ux/ui Design Solution Services
Ux/ui Design Solution ServicesUx/ui Design Solution Services
Ux/ui Design Solution Servicesdeorwine infotech
 
Designing Better Applications, Website and Intranets
Designing Better Applications, Website and IntranetsDesigning Better Applications, Website and Intranets
Designing Better Applications, Website and IntranetsDennis Breen
 
Usability audit
Usability auditUsability audit
Usability auditIdeacto
 

What's hot (20)

An Easy Explanation of UX (User Experience) By Think 360 Studio
An Easy Explanation of UX (User Experience) By Think 360 Studio An Easy Explanation of UX (User Experience) By Think 360 Studio
An Easy Explanation of UX (User Experience) By Think 360 Studio
 
The UX Process Behind Compelling User Experiences
The UX Process Behind Compelling User ExperiencesThe UX Process Behind Compelling User Experiences
The UX Process Behind Compelling User Experiences
 
THE UX INTERVIEW – 3 Quick Questions. 3 Short Answers.
THE UX INTERVIEW – 3 Quick Questions. 3 Short Answers.THE UX INTERVIEW – 3 Quick Questions. 3 Short Answers.
THE UX INTERVIEW – 3 Quick Questions. 3 Short Answers.
 
2014 Evolving Your UX Process 1up
2014 Evolving Your UX Process 1up2014 Evolving Your UX Process 1up
2014 Evolving Your UX Process 1up
 
[Srijan Wednesday Webinars] Bull Session on UI/UX
[Srijan Wednesday Webinars] Bull Session on UI/UX [Srijan Wednesday Webinars] Bull Session on UI/UX
[Srijan Wednesday Webinars] Bull Session on UI/UX
 
Product and UX - are the roles blurring?
Product and UX - are the roles blurring?Product and UX - are the roles blurring?
Product and UX - are the roles blurring?
 
What is UX Developer
What is UX DeveloperWhat is UX Developer
What is UX Developer
 
Product UX Integration
Product UX IntegrationProduct UX Integration
Product UX Integration
 
User Experience: Process and Guidelines
User Experience: Process and GuidelinesUser Experience: Process and Guidelines
User Experience: Process and Guidelines
 
User Experience Process
User Experience Process User Experience Process
User Experience Process
 
Tampa UX November 2014 Meetup
Tampa UX November 2014 MeetupTampa UX November 2014 Meetup
Tampa UX November 2014 Meetup
 
UI/UX presentation by Roshan Karunarathna
UI/UX presentation by Roshan KarunarathnaUI/UX presentation by Roshan Karunarathna
UI/UX presentation by Roshan Karunarathna
 
Product Design and UX / UI Design Process in Digital Product Development
Product Design and UX / UI Design Process in Digital Product DevelopmentProduct Design and UX / UI Design Process in Digital Product Development
Product Design and UX / UI Design Process in Digital Product Development
 
UX Lesson 4: Task & Feature Analysis
UX Lesson 4: Task & Feature AnalysisUX Lesson 4: Task & Feature Analysis
UX Lesson 4: Task & Feature Analysis
 
Ux/ui Design Solution Services
Ux/ui Design Solution ServicesUx/ui Design Solution Services
Ux/ui Design Solution Services
 
ChalkboardPortfolio
ChalkboardPortfolioChalkboardPortfolio
ChalkboardPortfolio
 
UX techniques
UX techniquesUX techniques
UX techniques
 
Designing Better Applications, Website and Intranets
Designing Better Applications, Website and IntranetsDesigning Better Applications, Website and Intranets
Designing Better Applications, Website and Intranets
 
Usability audit
Usability auditUsability audit
Usability audit
 
Growth Hacking - UX
Growth Hacking - UXGrowth Hacking - UX
Growth Hacking - UX
 

Viewers also liked

UX Design Process | Sample Proposal
UX Design Process | Sample Proposal UX Design Process | Sample Proposal
UX Design Process | Sample Proposal Marta Fioni
 
UX Research at Scale
UX Research at ScaleUX Research at Scale
UX Research at ScaleNick Cawthon
 
Embedded UX Research by Stijn Nieuwendijk @ UX Istanbul 2016
Embedded UX Research by Stijn Nieuwendijk @ UX Istanbul 2016 Embedded UX Research by Stijn Nieuwendijk @ UX Istanbul 2016
Embedded UX Research by Stijn Nieuwendijk @ UX Istanbul 2016 Valsplat
 
Rethinking UX Research - Design4Drupal 2014 keynote presentation
Rethinking UX Research - Design4Drupal 2014 keynote presentationRethinking UX Research - Design4Drupal 2014 keynote presentation
Rethinking UX Research - Design4Drupal 2014 keynote presentationPerfetti Media
 
Product Design using Lean UX
Product Design using Lean UXProduct Design using Lean UX
Product Design using Lean UXGeorge Elkhabbaz
 
UX Experience Design: Processes and Strategy
UX Experience Design: Processes and StrategyUX Experience Design: Processes and Strategy
UX Experience Design: Processes and StrategyCHI UX Indonesia
 

Viewers also liked (7)

UX Design Process | Sample Proposal
UX Design Process | Sample Proposal UX Design Process | Sample Proposal
UX Design Process | Sample Proposal
 
UX Research at Scale
UX Research at ScaleUX Research at Scale
UX Research at Scale
 
Embedded UX Research by Stijn Nieuwendijk @ UX Istanbul 2016
Embedded UX Research by Stijn Nieuwendijk @ UX Istanbul 2016 Embedded UX Research by Stijn Nieuwendijk @ UX Istanbul 2016
Embedded UX Research by Stijn Nieuwendijk @ UX Istanbul 2016
 
Rethinking UX Research - Design4Drupal 2014 keynote presentation
Rethinking UX Research - Design4Drupal 2014 keynote presentationRethinking UX Research - Design4Drupal 2014 keynote presentation
Rethinking UX Research - Design4Drupal 2014 keynote presentation
 
Product Design using Lean UX
Product Design using Lean UXProduct Design using Lean UX
Product Design using Lean UX
 
UX Experience Design: Processes and Strategy
UX Experience Design: Processes and StrategyUX Experience Design: Processes and Strategy
UX Experience Design: Processes and Strategy
 
Intro to Product Design
Intro to Product DesignIntro to Product Design
Intro to Product Design
 

Similar to UX Process

UX Lead Product Management
UX Lead Product ManagementUX Lead Product Management
UX Lead Product ManagementJohn Wyatt
 
User Research to Validate Product Ideas Workshop
User Research to Validate Product Ideas WorkshopUser Research to Validate Product Ideas Workshop
User Research to Validate Product Ideas WorkshopProduct School
 
USABILITY TESTING TO IMPROVE USER EXPERIENCE
USABILITY  TESTING TO  IMPROVE USER EXPERIENCEUSABILITY  TESTING TO  IMPROVE USER EXPERIENCE
USABILITY TESTING TO IMPROVE USER EXPERIENCEMalang QA Community
 
Majestic MRSS Usability Engineering
Majestic MRSS Usability EngineeringMajestic MRSS Usability Engineering
Majestic MRSS Usability EngineeringMajestic MRSS
 
MMRSS Usability Engineering
MMRSS Usability EngineeringMMRSS Usability Engineering
MMRSS Usability EngineeringMajesticMRSS
 
Using Automated Testing Tools to Empower Your User Research
Using Automated Testing Tools to Empower Your User ResearchUsing Automated Testing Tools to Empower Your User Research
Using Automated Testing Tools to Empower Your User ResearchUserZoom
 
User Zoom Webinar Monster Aug09 Vf
User Zoom Webinar Monster Aug09 VfUser Zoom Webinar Monster Aug09 Vf
User Zoom Webinar Monster Aug09 VfUserZoom
 
UX basics. Testing methods - TechHub Bucharest oct 2014
UX basics. Testing methods - TechHub Bucharest oct 2014UX basics. Testing methods - TechHub Bucharest oct 2014
UX basics. Testing methods - TechHub Bucharest oct 2014Adrian Iacomi
 
Building an MVP | A Step-by-Step Guide to Launching Your Product
Building an MVP | A Step-by-Step Guide to Launching Your ProductBuilding an MVP | A Step-by-Step Guide to Launching Your Product
Building an MVP | A Step-by-Step Guide to Launching Your ProductElina619459
 
User Experience Poster
User Experience PosterUser Experience Poster
User Experience PosterJessica Fisher
 
Usability Testing - Sivaprasath Selvaraj
Usability Testing - Sivaprasath SelvarajUsability Testing - Sivaprasath Selvaraj
Usability Testing - Sivaprasath SelvarajSivaprasath Selvaraj
 
How to come up with the next 'Needle moving’ feature for any product
How to come up with the next 'Needle moving’ feature for any productHow to come up with the next 'Needle moving’ feature for any product
How to come up with the next 'Needle moving’ feature for any productUXDXConf
 
Usability methods to improve EMRs
Usability methods to improve EMRsUsability methods to improve EMRs
Usability methods to improve EMRsJeffery Belden
 
Building a product management data strategy
Building a product management data strategyBuilding a product management data strategy
Building a product management data strategyPatricia LaPaglia
 

Similar to UX Process (20)

ux flow and process
ux flow and processux flow and process
ux flow and process
 
UX Lead Product Management
UX Lead Product ManagementUX Lead Product Management
UX Lead Product Management
 
User Research to Validate Product Ideas Workshop
User Research to Validate Product Ideas WorkshopUser Research to Validate Product Ideas Workshop
User Research to Validate Product Ideas Workshop
 
USABILITY TESTING TO IMPROVE USER EXPERIENCE
USABILITY  TESTING TO  IMPROVE USER EXPERIENCEUSABILITY  TESTING TO  IMPROVE USER EXPERIENCE
USABILITY TESTING TO IMPROVE USER EXPERIENCE
 
Lean UX
Lean UXLean UX
Lean UX
 
Majestic MRSS Usability Engineering
Majestic MRSS Usability EngineeringMajestic MRSS Usability Engineering
Majestic MRSS Usability Engineering
 
MMRSS Usability Engineering
MMRSS Usability EngineeringMMRSS Usability Engineering
MMRSS Usability Engineering
 
Using Automated Testing Tools to Empower Your User Research
Using Automated Testing Tools to Empower Your User ResearchUsing Automated Testing Tools to Empower Your User Research
Using Automated Testing Tools to Empower Your User Research
 
Notes on usability testing
Notes on usability testingNotes on usability testing
Notes on usability testing
 
Benchmarking new
Benchmarking newBenchmarking new
Benchmarking new
 
User Zoom Webinar Monster Aug09 Vf
User Zoom Webinar Monster Aug09 VfUser Zoom Webinar Monster Aug09 Vf
User Zoom Webinar Monster Aug09 Vf
 
UX basics. Testing methods - TechHub Bucharest oct 2014
UX basics. Testing methods - TechHub Bucharest oct 2014UX basics. Testing methods - TechHub Bucharest oct 2014
UX basics. Testing methods - TechHub Bucharest oct 2014
 
Building an MVP | A Step-by-Step Guide to Launching Your Product
Building an MVP | A Step-by-Step Guide to Launching Your ProductBuilding an MVP | A Step-by-Step Guide to Launching Your Product
Building an MVP | A Step-by-Step Guide to Launching Your Product
 
User Experience Poster
User Experience PosterUser Experience Poster
User Experience Poster
 
Usability Testing - Sivaprasath Selvaraj
Usability Testing - Sivaprasath SelvarajUsability Testing - Sivaprasath Selvaraj
Usability Testing - Sivaprasath Selvaraj
 
How to come up with the next 'Needle moving’ feature for any product
How to come up with the next 'Needle moving’ feature for any productHow to come up with the next 'Needle moving’ feature for any product
How to come up with the next 'Needle moving’ feature for any product
 
Measurement of Web Usability: An Approach
Measurement of Web Usability: An ApproachMeasurement of Web Usability: An Approach
Measurement of Web Usability: An Approach
 
Usability methods to improve EMRs
Usability methods to improve EMRsUsability methods to improve EMRs
Usability methods to improve EMRs
 
Usability
UsabilityUsability
Usability
 
Building a product management data strategy
Building a product management data strategyBuilding a product management data strategy
Building a product management data strategy
 

UX Process

  • 1. UX FLOW AND PROCESSby Febrina Rahdiyani
  • 2. UX PROCESS #1 Strategy #2 Research #3 Analysis #4 Design #5 Development #6 Testing #8 Launch #7 Evaluate based on http://uxmastery.com/resources/process/
  • 3. STRATEGYA plan of action to achieve goals COMMUNICATION USER IDENTIFICATION BRAND ALIGNMENT BUSINESS OBJECTIVE Set product objective, main goal, and the value that we want to offer Identify the user, their needs, goals, and what are they interested about The most important things are the message delivered, understood, and lead people to do the action Objectives: Expectations to be Achieved Measuring the Success Priority
  • 5. RESEARCHThe systematic investigation COMPETITOR RESEARCH USER RESEARCH COMPETITOR PROFILE PRODUCT EVALUATION PRODUCT USAGE ANALYSIS USER INTERVIEWS SURVEYS FOCUS GROUP DISCUSSION Objectives: Establish Facts Reach New Conclusions Create an Informed UX
  • 6. ANALYSISGain more insights from the information that collected in the Research phase. SCENARIOS SYSTEM ANALYSIS STORYBOARDS USE CASES The stories and context behind why a specific user comes to your site. A visual sequence of events is used to capture a user’s interactions with a product. List of steps between users and systems to achieve the goal. A problem solving technique to study how well each components work and interact. Objectives: Define Product Definitions, Priorities, and Plan Formal Design Deliverables
  • 8. DESIGNDesigning the system based on the information from Analysis phase by creating a prototype. WIREFRAMINGSITEMAPPING Objectives: Put Ideas into Design Evaluate the Design Refine the Design
  • 9. SITEMAPPING Step 1 Create prototype sketch on the paper, based on the information during Analysis phase How to do the wireframing
  • 10. SITEMAPPING Step 2 Evaluate the sketch with the team How to do the wireframing
  • 11. SITEMAPPING Step 3 Create the functional wireframe How to do the wireframing
  • 12. Keep in mind that … In creating wireframes, keep it simple! Do not use colour Use only one generic font Do not use image
  • 13. DEVELOPMENTDevelop a product based on the design that has been made in Design phase.
  • 14. DEVELOPMENT Starts from the wireframe Create the visual design (high-fidelity prototype) The programmer codes the program
  • 15. TESTINGDoing a testing to check the quality of the product that have been developed in Development phase. How to do the testing? USABILITY TESTING A technique to evaluating a product by testing it directly to representative user Perform TasksUsers Watch Listen Take NotesObserver During the user perform tasks, the observer will …
  • 16. What you need to do to run an effective usability test? Step 1 Develop a solid test plan 10 Essential Usability Metrics 1. Completion Rates 2. Usability Problems 3. Task Time 4. Task Level Satisfaction 5. Test Level Satisfaction 6. Errors 7. Expectation 8. Page Views/Clicks 9. Conversion 10. Single Usability Metric (SUM)
  • 17. What you need to do to run an effective usability test? Step 2 Create the task scenarios
  • 18. These are 3 task-writing tips to improve the outcome of usability testing 1. Make the task realistic 2. Make the task actionable 3. Avoid clues and describing steps
  • 19. What you need to do to run an effective usability test? Step 3 Recruit the participants
  • 20. What you need to do to run an effective usability test? Step 4 Start the usability testing. Analyze and report the findings.
  • 21. What if we get … POSITIVE FINDINGS NEGATIVE FINDINGS It is useful because what is working well must be maintained through further development. If there is a lack of design in the product, we need feedback from the user what should be done to fit the users’ needs and fix them.
  • 22. LAUNCHLaunch a product that has been developed in Development phase and passes the quality checking in the Testing phase. USAGE MEASUREMENT & ANALYTICS To do the measurement, we can use …
  • 23. USAGE MEASUREMENT & ANALYTICS LAUNCH We could see : 1. Site Usage • Visits • Pages/Visit • Pageviews • Avg. Time on Site • Bounce Rate • % New Visits 2. Visitors Overview 3. Traffic Sources Overview 4. Browsers used to open the website
  • 24. USER FEEDBACK & ANALYTICS After the products being launched, we still can get feedback and review from the user and do the analysis from it. The best ways to get feedbacks are … Conduct an online survey Feedback boxes LAUNCH Reaching out the user directly