SlideShare a Scribd company logo
1 of 25
Nguyen Tuan Anh, Deputy Director of Digital Content Center
VIVAS , 06/2014.
Introduction to User Experience Design
• What is UX?
• UX # UI
• User – Centered Design
• Introduction to building Wireframes
• Tips for Wireframing.
• Q & A
What is User Experience
(UX)?
• User Experience is the sum experience of a user
interacting with a product or system.
UX ~ Feeling not Function
UX # UIUX # UI
UX # UIUX # UI
UX # UIUX # UI
Why ? Good UI – Bad UX
What is User-Centered
Design (UCD)?
• The user is put in the center of the design
User Requirement Analysis: Determine the user needs and target usability
requirements
Conceptual Design: Rapidly create visual representations (mockups) or interactive
representations (prototypes) of the product.
Design and Implementation : Work with the design and development team to revise
user interface based on concept evaluation
UX Design Process
• Step 1: (PrM)
– Input :Customer Segment, User Behavior, Context
– Out Put: Fetures Ideas (1)
• Step 2: PrM/ UX Designer
– Input: (1) + Feedback
– Out put: Sketching/ Wireframe ( PrM)  Approve UX Designer ( 2)
• Step 3: UI Designer
– Input: (2)
– Out put: Visual Design ( UI Designer )  Approve PrM/UX Designer
Work Flow
Tool ?
Paper + Pencil
Tool ?
Paper + Pencil
• OmniGraffle - For Mac, Ipad
http://www.omnigroup.com/omnigraffle/
• Balsamiq – For Windows – Intro
http://balsamiq.com/
Tool
Tool
• Gomockingbird
https://gomockingbird.com/mockingbird/
• Adobe Fireworks
• Power Mockup
http://www.powermockup
• Invision
http://www.invisionapp.com
• Suggest: Axure for Mac, PC
Trainning : http://www.axure.com/learn
Tips for Wireframing
• Have clear Objective
• Keep It Clean
• Don’t Make me think
• Repetition. Repetition.Repetition
Tips for Wireframing
• Have clear Objective
• Keep It Clean
• Don’t Make me think
• Repetition. Repetition.Repetition
Tips for Wireframing
• Have clear Objective
• Keep It Clean
• Don’t Make me think
• Repetition. Repetition.Repetition
Tips for Wireframing
• Have clear Objective
• Keep It Clean
• Don’t Make me think
• Repetition. Repetition.Repetition
Website
• UX Magazine : http://uxmag.com/
• UX Booth http://www.uxbooth.com/
• Stack Exchange http://ux.stackexchange.com/
• Stack Overflow
• UX Exchange : uxexchange.com
• Uxmatters : http://www.uxmatters.com/index.php
Introduction to User Experience Design
Introduction to User Experience Design

More Related Content

What's hot

Games Design 2 - Lecture 10 - Game Interface Prototyping
Games Design 2 - Lecture 10 - Game Interface PrototypingGames Design 2 - Lecture 10 - Game Interface Prototyping
Games Design 2 - Lecture 10 - Game Interface PrototypingDavid Farrell
 
Wireframes - a brief overview
Wireframes - a brief overviewWireframes - a brief overview
Wireframes - a brief overviewJenni Leder
 
16 ui ux design in the daily basis
16 ui ux design in the daily basis16 ui ux design in the daily basis
16 ui ux design in the daily basisSudirman
 
Intro to User Centered Design Workshop
Intro to User Centered Design WorkshopIntro to User Centered Design Workshop
Intro to User Centered Design WorkshopPatrick McNeil
 
Designing with Sketch App
Designing with Sketch AppDesigning with Sketch App
Designing with Sketch AppIan Soper
 
Game Design 2: 2011 - Introduction to Game Interface Design
Game Design 2: 2011 - Introduction to Game Interface DesignGame Design 2: 2011 - Introduction to Game Interface Design
Game Design 2: 2011 - Introduction to Game Interface DesignDavid Farrell
 
Mobile prototyping kaziak - Codemotion Rome 2015
Mobile prototyping kaziak - Codemotion Rome 2015Mobile prototyping kaziak - Codemotion Rome 2015
Mobile prototyping kaziak - Codemotion Rome 2015Codemotion
 
How to create the best wireframes
How to create the best wireframesHow to create the best wireframes
How to create the best wireframesLior Yair
 
Prototyping Axure
Prototyping AxurePrototyping Axure
Prototyping Axurekkostuch
 
Design System - Fail, Learn, Build, Test
Design System - Fail, Learn, Build, TestDesign System - Fail, Learn, Build, Test
Design System - Fail, Learn, Build, TestPaya Do
 
UX Pres MIni version!
UX Pres MIni version!UX Pres MIni version!
UX Pres MIni version!Jessi Baker
 
Prototyping for effective UX
Prototyping for effective UXPrototyping for effective UX
Prototyping for effective UXRan Liron
 
Modern UX, UI, and front-end tools
Modern UX, UI, and front-end toolsModern UX, UI, and front-end tools
Modern UX, UI, and front-end toolsAlan Roy
 

What's hot (14)

Games Design 2 - Lecture 10 - Game Interface Prototyping
Games Design 2 - Lecture 10 - Game Interface PrototypingGames Design 2 - Lecture 10 - Game Interface Prototyping
Games Design 2 - Lecture 10 - Game Interface Prototyping
 
Wireframes - a brief overview
Wireframes - a brief overviewWireframes - a brief overview
Wireframes - a brief overview
 
16 ui ux design in the daily basis
16 ui ux design in the daily basis16 ui ux design in the daily basis
16 ui ux design in the daily basis
 
Intro to User Centered Design Workshop
Intro to User Centered Design WorkshopIntro to User Centered Design Workshop
Intro to User Centered Design Workshop
 
Designing with Sketch App
Designing with Sketch AppDesigning with Sketch App
Designing with Sketch App
 
Game Design 2: 2011 - Introduction to Game Interface Design
Game Design 2: 2011 - Introduction to Game Interface DesignGame Design 2: 2011 - Introduction to Game Interface Design
Game Design 2: 2011 - Introduction to Game Interface Design
 
Mobile prototyping kaziak - Codemotion Rome 2015
Mobile prototyping kaziak - Codemotion Rome 2015Mobile prototyping kaziak - Codemotion Rome 2015
Mobile prototyping kaziak - Codemotion Rome 2015
 
How to create the best wireframes
How to create the best wireframesHow to create the best wireframes
How to create the best wireframes
 
Prototyping Axure
Prototyping AxurePrototyping Axure
Prototyping Axure
 
Design System - Fail, Learn, Build, Test
Design System - Fail, Learn, Build, TestDesign System - Fail, Learn, Build, Test
Design System - Fail, Learn, Build, Test
 
UX Pres MIni version!
UX Pres MIni version!UX Pres MIni version!
UX Pres MIni version!
 
Prototyping for effective UX
Prototyping for effective UXPrototyping for effective UX
Prototyping for effective UX
 
UX roles
UX rolesUX roles
UX roles
 
Modern UX, UI, and front-end tools
Modern UX, UI, and front-end toolsModern UX, UI, and front-end tools
Modern UX, UI, and front-end tools
 

Similar to Introduction to User Experience Design

UX Design Mini Course
UX Design Mini CourseUX Design Mini Course
UX Design Mini CourseDigital Snack
 
Step to Great User Experience
Step to Great User Experience Step to Great User Experience
Step to Great User Experience Istiaque Reza
 
Bridging user experience design with agile product development
Bridging user experience design with agile product developmentBridging user experience design with agile product development
Bridging user experience design with agile product developmentHarri Kiljander
 
User Experience: Why should you care?
User Experience: Why should you care?User Experience: Why should you care?
User Experience: Why should you care?Nirish Shakya
 
Integrating User Experience Design into the Product Lifecycle
Integrating User Experience Design into the Product LifecycleIntegrating User Experience Design into the Product Lifecycle
Integrating User Experience Design into the Product LifecycleICS
 
Foundation of UI/UX
Foundation of UI/UXFoundation of UI/UX
Foundation of UI/UXAshwinRaj57
 
User Experience as a Strategic Advantage
User Experience as a Strategic AdvantageUser Experience as a Strategic Advantage
User Experience as a Strategic AdvantageMichael Dubakov
 
What is user experience(ux) & ux designer
What is user experience(ux) & ux designerWhat is user experience(ux) & ux designer
What is user experience(ux) & ux designerMetricoid Technology
 
Incorporating UX into Your Projects
Incorporating UX into Your ProjectsIncorporating UX into Your Projects
Incorporating UX into Your ProjectsKarl Kaufmann
 
Simple Steps to UX/UI Web Design
Simple Steps to UX/UI Web DesignSimple Steps to UX/UI Web Design
Simple Steps to UX/UI Web DesignKoombea
 
Design Presentation.pdf
Design Presentation.pdfDesign Presentation.pdf
Design Presentation.pdfVamsiYeduri
 
User Experience and Prototyping
User Experience and PrototypingUser Experience and Prototyping
User Experience and PrototypingKshitiz Anand
 
UX Camp 2017 – How UX survives in agile development
UX Camp 2017 – How UX survives in agile developmentUX Camp 2017 – How UX survives in agile development
UX Camp 2017 – How UX survives in agile developmentJanne_Bjorsted
 
Max Tkachuk, UI Heuristics for everyone
Max Tkachuk, UI Heuristics for everyoneMax Tkachuk, UI Heuristics for everyone
Max Tkachuk, UI Heuristics for everyoneSigma Software
 

Similar to Introduction to User Experience Design (20)

UX Design Mini Course
UX Design Mini CourseUX Design Mini Course
UX Design Mini Course
 
Step to Great User Experience
Step to Great User Experience Step to Great User Experience
Step to Great User Experience
 
UI_UX.pptx
UI_UX.pptxUI_UX.pptx
UI_UX.pptx
 
Bridging user experience design with agile product development
Bridging user experience design with agile product developmentBridging user experience design with agile product development
Bridging user experience design with agile product development
 
User Experience: Why should you care?
User Experience: Why should you care?User Experience: Why should you care?
User Experience: Why should you care?
 
A primer on ux design
A primer on ux designA primer on ux design
A primer on ux design
 
Integrating User Experience Design into the Product Lifecycle
Integrating User Experience Design into the Product LifecycleIntegrating User Experience Design into the Product Lifecycle
Integrating User Experience Design into the Product Lifecycle
 
Foundation of UI/UX
Foundation of UI/UXFoundation of UI/UX
Foundation of UI/UX
 
User Experience as a Strategic Advantage
User Experience as a Strategic AdvantageUser Experience as a Strategic Advantage
User Experience as a Strategic Advantage
 
What is UX v1
What is UX v1What is UX v1
What is UX v1
 
What is user experience(ux) & ux designer
What is user experience(ux) & ux designerWhat is user experience(ux) & ux designer
What is user experience(ux) & ux designer
 
Incorporating UX into Your Projects
Incorporating UX into Your ProjectsIncorporating UX into Your Projects
Incorporating UX into Your Projects
 
Introduction to UI UX
Introduction to UI UXIntroduction to UI UX
Introduction to UI UX
 
UX/UI Introduction
UX/UI IntroductionUX/UI Introduction
UX/UI Introduction
 
Simple Steps to UX/UI Web Design
Simple Steps to UX/UI Web DesignSimple Steps to UX/UI Web Design
Simple Steps to UX/UI Web Design
 
Design Presentation.pdf
Design Presentation.pdfDesign Presentation.pdf
Design Presentation.pdf
 
Engineering UX
Engineering UXEngineering UX
Engineering UX
 
User Experience and Prototyping
User Experience and PrototypingUser Experience and Prototyping
User Experience and Prototyping
 
UX Camp 2017 – How UX survives in agile development
UX Camp 2017 – How UX survives in agile developmentUX Camp 2017 – How UX survives in agile development
UX Camp 2017 – How UX survives in agile development
 
Max Tkachuk, UI Heuristics for everyone
Max Tkachuk, UI Heuristics for everyoneMax Tkachuk, UI Heuristics for everyone
Max Tkachuk, UI Heuristics for everyone
 

More from Tuấn Anh

Kich ban vspace
Kich ban vspaceKich ban vspace
Kich ban vspaceTuấn Anh
 
Vms uisp training
Vms uisp trainingVms uisp training
Vms uisp trainingTuấn Anh
 
Gioi thieu smartbox
Gioi thieu smartboxGioi thieu smartbox
Gioi thieu smartboxTuấn Anh
 
[ Smartbox ] Broucher
[ Smartbox ] Broucher[ Smartbox ] Broucher
[ Smartbox ] BroucherTuấn Anh
 
Changing ux mindset
Changing ux mindsetChanging ux mindset
Changing ux mindsetTuấn Anh
 
Product Development--Của bác Phùng Tiến Công
Product Development--Của bác Phùng Tiến CôngProduct Development--Của bác Phùng Tiến Công
Product Development--Của bác Phùng Tiến CôngTuấn Anh
 
1 top concept 151211
1 top concept 1512111 top concept 151211
1 top concept 151211Tuấn Anh
 
Huong dan ngan de ban hang tren ebay
Huong dan ngan de ban hang tren ebayHuong dan ngan de ban hang tren ebay
Huong dan ngan de ban hang tren ebayTuấn Anh
 
Huong dan ngan de ban hang tren ebay
Huong dan ngan de ban hang tren ebayHuong dan ngan de ban hang tren ebay
Huong dan ngan de ban hang tren ebayTuấn Anh
 
Pay pal overview peacesoft
Pay pal overview peacesoftPay pal overview peacesoft
Pay pal overview peacesoftTuấn Anh
 
Thanh toán Nds
Thanh toán NdsThanh toán Nds
Thanh toán NdsTuấn Anh
 
Tcb event 121211
Tcb event 121211Tcb event 121211
Tcb event 121211Tuấn Anh
 
Global Digital Goods Opportunities
Global Digital Goods Opportunities Global Digital Goods Opportunities
Global Digital Goods Opportunities Tuấn Anh
 
Ban tin doi tac nl so 1
Ban tin doi tac nl so 1Ban tin doi tac nl so 1
Ban tin doi tac nl so 1Tuấn Anh
 

More from Tuấn Anh (15)

Kich ban vspace
Kich ban vspaceKich ban vspace
Kich ban vspace
 
Vms uisp training
Vms uisp trainingVms uisp training
Vms uisp training
 
VMS,
VMS, VMS,
VMS,
 
Gioi thieu smartbox
Gioi thieu smartboxGioi thieu smartbox
Gioi thieu smartbox
 
[ Smartbox ] Broucher
[ Smartbox ] Broucher[ Smartbox ] Broucher
[ Smartbox ] Broucher
 
Changing ux mindset
Changing ux mindsetChanging ux mindset
Changing ux mindset
 
Product Development--Của bác Phùng Tiến Công
Product Development--Của bác Phùng Tiến CôngProduct Development--Của bác Phùng Tiến Công
Product Development--Của bác Phùng Tiến Công
 
1 top concept 151211
1 top concept 1512111 top concept 151211
1 top concept 151211
 
Huong dan ngan de ban hang tren ebay
Huong dan ngan de ban hang tren ebayHuong dan ngan de ban hang tren ebay
Huong dan ngan de ban hang tren ebay
 
Huong dan ngan de ban hang tren ebay
Huong dan ngan de ban hang tren ebayHuong dan ngan de ban hang tren ebay
Huong dan ngan de ban hang tren ebay
 
Pay pal overview peacesoft
Pay pal overview peacesoftPay pal overview peacesoft
Pay pal overview peacesoft
 
Thanh toán Nds
Thanh toán NdsThanh toán Nds
Thanh toán Nds
 
Tcb event 121211
Tcb event 121211Tcb event 121211
Tcb event 121211
 
Global Digital Goods Opportunities
Global Digital Goods Opportunities Global Digital Goods Opportunities
Global Digital Goods Opportunities
 
Ban tin doi tac nl so 1
Ban tin doi tac nl so 1Ban tin doi tac nl so 1
Ban tin doi tac nl so 1
 

Recently uploaded

原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degreeyuu sss
 
ARt app | UX Case Study
ARt app | UX Case StudyARt app | UX Case Study
ARt app | UX Case StudySophia Viganò
 
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档208367051
 
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一Fi sss
 
西北大学毕业证学位证成绩单-怎么样办伪造
西北大学毕业证学位证成绩单-怎么样办伪造西北大学毕业证学位证成绩单-怎么样办伪造
西北大学毕业证学位证成绩单-怎么样办伪造kbdhl05e
 
Passbook project document_april_21__.pdf
Passbook project document_april_21__.pdfPassbook project document_april_21__.pdf
Passbook project document_april_21__.pdfvaibhavkanaujia
 
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证nhjeo1gg
 
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档208367051
 
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCRdollysharma2066
 
group_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfgroup_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfneelspinoy
 
Call Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full NightCall Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full Nightssuser7cb4ff
 
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10uasjlagroup
 
Call Girls in Okhla Delhi 💯Call Us 🔝8264348440🔝
Call Girls in Okhla Delhi 💯Call Us 🔝8264348440🔝Call Girls in Okhla Delhi 💯Call Us 🔝8264348440🔝
Call Girls in Okhla Delhi 💯Call Us 🔝8264348440🔝soniya singh
 
Mookuthi is an artisanal nose ornament brand based in Madras.
Mookuthi is an artisanal nose ornament brand based in Madras.Mookuthi is an artisanal nose ornament brand based in Madras.
Mookuthi is an artisanal nose ornament brand based in Madras.Mookuthi
 
Design Portfolio - 2024 - William Vickery
Design Portfolio - 2024 - William VickeryDesign Portfolio - 2024 - William Vickery
Design Portfolio - 2024 - William VickeryWilliamVickery6
 
3D Printing And Designing Final Report.pdf
3D Printing And Designing Final Report.pdf3D Printing And Designing Final Report.pdf
3D Printing And Designing Final Report.pdfSwaraliBorhade
 
How to Be Famous in your Field just visit our Site
How to Be Famous in your Field just visit our SiteHow to Be Famous in your Field just visit our Site
How to Be Famous in your Field just visit our Sitegalleryaagency
 
Call Us ✡️97111⇛47426⇛Call In girls Vasant Vihar༒(Delhi)
Call Us ✡️97111⇛47426⇛Call In girls Vasant Vihar༒(Delhi)Call Us ✡️97111⇛47426⇛Call In girls Vasant Vihar༒(Delhi)
Call Us ✡️97111⇛47426⇛Call In girls Vasant Vihar༒(Delhi)jennyeacort
 
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,Aginakm1
 
PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024
PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024
PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024CristobalHeraud
 

Recently uploaded (20)

原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
 
ARt app | UX Case Study
ARt app | UX Case StudyARt app | UX Case Study
ARt app | UX Case Study
 
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
 
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
 
西北大学毕业证学位证成绩单-怎么样办伪造
西北大学毕业证学位证成绩单-怎么样办伪造西北大学毕业证学位证成绩单-怎么样办伪造
西北大学毕业证学位证成绩单-怎么样办伪造
 
Passbook project document_april_21__.pdf
Passbook project document_april_21__.pdfPassbook project document_april_21__.pdf
Passbook project document_april_21__.pdf
 
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
 
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
 
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
 
group_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfgroup_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdf
 
Call Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full NightCall Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full Night
 
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
 
Call Girls in Okhla Delhi 💯Call Us 🔝8264348440🔝
Call Girls in Okhla Delhi 💯Call Us 🔝8264348440🔝Call Girls in Okhla Delhi 💯Call Us 🔝8264348440🔝
Call Girls in Okhla Delhi 💯Call Us 🔝8264348440🔝
 
Mookuthi is an artisanal nose ornament brand based in Madras.
Mookuthi is an artisanal nose ornament brand based in Madras.Mookuthi is an artisanal nose ornament brand based in Madras.
Mookuthi is an artisanal nose ornament brand based in Madras.
 
Design Portfolio - 2024 - William Vickery
Design Portfolio - 2024 - William VickeryDesign Portfolio - 2024 - William Vickery
Design Portfolio - 2024 - William Vickery
 
3D Printing And Designing Final Report.pdf
3D Printing And Designing Final Report.pdf3D Printing And Designing Final Report.pdf
3D Printing And Designing Final Report.pdf
 
How to Be Famous in your Field just visit our Site
How to Be Famous in your Field just visit our SiteHow to Be Famous in your Field just visit our Site
How to Be Famous in your Field just visit our Site
 
Call Us ✡️97111⇛47426⇛Call In girls Vasant Vihar༒(Delhi)
Call Us ✡️97111⇛47426⇛Call In girls Vasant Vihar༒(Delhi)Call Us ✡️97111⇛47426⇛Call In girls Vasant Vihar༒(Delhi)
Call Us ✡️97111⇛47426⇛Call In girls Vasant Vihar༒(Delhi)
 
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
 
PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024
PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024
PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024
 

Introduction to User Experience Design

  • 1. Nguyen Tuan Anh, Deputy Director of Digital Content Center VIVAS , 06/2014. Introduction to User Experience Design
  • 2. • What is UX? • UX # UI • User – Centered Design • Introduction to building Wireframes • Tips for Wireframing. • Q & A
  • 3. What is User Experience (UX)? • User Experience is the sum experience of a user interacting with a product or system. UX ~ Feeling not Function
  • 4.
  • 5.
  • 6.
  • 7. UX # UIUX # UI
  • 8. UX # UIUX # UI
  • 9. UX # UIUX # UI
  • 10. Why ? Good UI – Bad UX
  • 11.
  • 12. What is User-Centered Design (UCD)? • The user is put in the center of the design User Requirement Analysis: Determine the user needs and target usability requirements Conceptual Design: Rapidly create visual representations (mockups) or interactive representations (prototypes) of the product. Design and Implementation : Work with the design and development team to revise user interface based on concept evaluation
  • 14. • Step 1: (PrM) – Input :Customer Segment, User Behavior, Context – Out Put: Fetures Ideas (1) • Step 2: PrM/ UX Designer – Input: (1) + Feedback – Out put: Sketching/ Wireframe ( PrM)  Approve UX Designer ( 2) • Step 3: UI Designer – Input: (2) – Out put: Visual Design ( UI Designer )  Approve PrM/UX Designer Work Flow
  • 15. Tool ? Paper + Pencil
  • 16. Tool ? Paper + Pencil
  • 17. • OmniGraffle - For Mac, Ipad http://www.omnigroup.com/omnigraffle/ • Balsamiq – For Windows – Intro http://balsamiq.com/ Tool
  • 18. Tool • Gomockingbird https://gomockingbird.com/mockingbird/ • Adobe Fireworks • Power Mockup http://www.powermockup • Invision http://www.invisionapp.com • Suggest: Axure for Mac, PC Trainning : http://www.axure.com/learn
  • 19. Tips for Wireframing • Have clear Objective • Keep It Clean • Don’t Make me think • Repetition. Repetition.Repetition
  • 20. Tips for Wireframing • Have clear Objective • Keep It Clean • Don’t Make me think • Repetition. Repetition.Repetition
  • 21. Tips for Wireframing • Have clear Objective • Keep It Clean • Don’t Make me think • Repetition. Repetition.Repetition
  • 22. Tips for Wireframing • Have clear Objective • Keep It Clean • Don’t Make me think • Repetition. Repetition.Repetition
  • 23. Website • UX Magazine : http://uxmag.com/ • UX Booth http://www.uxbooth.com/ • Stack Exchange http://ux.stackexchange.com/ • Stack Overflow • UX Exchange : uxexchange.com • Uxmatters : http://www.uxmatters.com/index.php

Editor's Notes

  1. Gary
  2. The scope of the field is directed at affecting "all aspects of the user’s interaction with the product: how it is perceived, learned, and used Finable : Người dùng có thể tìm thấy những thứ cần thiết để phục vụ lợi ích/nhu cầu người dùng Usable: Tiện lợi, thích hợp cho việc sử dụng Useeful : Hữu ích cho người dùng cho một mục đích/nhu cầu của người dùng Credible: Tạo ra sự tin tưởng cho người sử dụng Desirable: Tạo ra cảm giác thèm muốn, ao ước được sử dụng Accessible: Sử dụng đơn giản  Valuable: Gía trị cho người sử dụng/khách hàng
  3. Taxonomy Creation: Sự phân loại element trong thiết kế Terminology: Thuật ngữ của chuyên ngành Ux is the intangible design of a strategy that brings us to solution: Thiết kế phi vật thể evangelism
  4. User-Centered Design (UCD) – Là một triết lý sản phẩm mà trong đó các nhu cầu, mong muốn, hạn chế, thói quen của người sử dụng được đặt lên hàng đầu và được quan tâm trong xuyên suốt quá trình thiết kế sản phẩm. User Research: Nghiên cứu hành vi, thói quen của người dùng ( Khách hàng mục tiêu trong một business case)  Xác định nhu cầu, mục tiêu của khách hàng Conceptual Design: Nhanh chóng tạo ra các bản Mockup cho sản phẩm  Tạo ra những phiên bản khác nhau, kiểm thử  Lặp lại quá trình để đưa ra một bản thiết kế đạt được mục tiêu và khả năng sử dụng được đạp ứng Design and Implementation : Làm việc với đội design và phát triển để đưa ra một UI phù hợp Usability Evaluation: Tiến hành phát triển khả năng tương tác, khả dụng của người dùng
  5. Crit: critique
  6. UX Tạp chí là một nguồn chất lượng cao đăng tải những cuộc thảo luận về các cách thức để nâng cao trải nghiệm người dùng.là một nguồn chất lượng cao đăng tải những cuộc thảo luận về các cách thức để nâng cao trải nghiệm người dùng. UX Booth là một blog của một nhóm tác giả phục vụ cho cộng đồng thiết kế trải nghiệm người dùng. Nó cũng có những bài viết về tính khả dụng và thiết kế tương tác UI Stack Exchange (một phần của mạng Stack Overflow) là một trang web hỏi đáp dành cho những nhà nghiên cứu các chuyên gia về giao diện người dùng Stack Overflow, một trang web hỏi đáp về lập trình phổ biến, với những chủ đề tuyệt vời được về UX và tính khả dụng. UX Exchange là một trang web cộng đồng nơi các thành viên có thể hỏi về trải nghiệm người sử dụng và các lĩnh vực liên quan như tính khả dụng, khả năng truy cập và thiết kế tương tác. UXmatters là một tạp chí web đăng tải nội dung về chiến lược phát triển trải nghiệm nghiệm người sử dụng, kiến thức UX và nhiều thứ khác nữa