SlideShare a Scribd company logo
1 of 36
User
eXperience.
         design

           created & presented by: divya bhatia
What?
Design is not just what it looks
like and feels like.
Design is how it works.
User experience (UX) is the sum of a
series of interactions a user has with a
product, service, or organization.
what & how of UXD
            useful               usable

understanding
people’s needs,               based in social &
wants, behavior,              cultural context
constraints
                                                        “wow”                 pleasi
                                                        factor                  ng
                                                                                                                     optimized for most
                                                                                                                     frequent tasks
                      reliabl                 evoke emotions                         simplicity     effecti
                         e                                                                            ve
                                                           exploring opportunity
                                                                                                                                      prototyping
                   based on people’s
                   past experiences
                                              stories                              human touch                                    functio
                                                                                                  information &
                                                                                                  timely feedback                   nal
                                                  innovat                          intuitiv
                                                    ive                               e                                          multiple iterations

                                                                                                  efficie
                                                                                                    nt
                                                                                                                    forgiving for errors
Generally, those who are
outside the discipline of design
assume that what designers do
is decoration.


Good Design is problem solving
What we see as

        Design

10%              Surface
                 Visual Design
10%   Surface
      Visual Design




      Skeleton
      Interface Design
      Navigation Design
      Information Design


      Structure
90%   Interaction Design
      Information Architecture



      Scope
      Functional Specs
      Content Requirement



      Strategy
      User Needs
      Site Objectives
How?
UX Design Process




              Business Objective
              User Needs
              Application Structure
              Work Flow & User Flow
             Analysis
UX Design Process




              Layout Directions
              Site Structure & Navigation
              High level design &
             concept illustration
UX Design Process




              Defines content &
             functionality
              Detailed Design without
             styling such
                   as images & colors [ex
             .Wireframes]
UX Design Process




              Detailed Design with
             corporate brand
               Colors
              Development & add
             functionality
UX Design Process
Why?
Business Success is always
defined by the quality of the
overall customer experience.
Websites that are hard to use
frustrate customers, forfeit
revenue and decrease brands
value.
Good design
is the most
important way
to differentiate
ourselves
from our
competitors.
Savings
Requirements      Development   Deployment
   Phase            Phase         Phase




                                 Time cost
      Design                    Per Change
   Alternatives




      8h                                32 h
  per change                         per change
Requirements                             Deployment
     Phase                                   Phase




                      20 Changes
                         *
                    35$ per changes


     *                                        *
 8 h per change                         32 h per change


   5,600$                                  22,400$

**All the number used in this calculation is the assumption
Savings $16,800



 **All the number used in this calculation is the assumption
Design is so critical. It should be
on the agenda of every meeting
in every single department.
Examples
QRx Application

  Current Menu design   Proposed Menu design


                                               Menu Items
                                               labels should be
                                               left aligned to
                                               have better
                                               visibility, as
                                               displayed here.
QRx Search
Current                        Text alignment can
                           structure the date and will
                               be more readable.




                Proposed
Text alignment can structure the
Intake Pop-up          date and will be more readable.




 Current        Proposed
Crowd Sourcing Tool – Project Details
Current




    Proposed
QSS Intranet
QSS
Intranet
iPortal
iPortal
Crowd Sourcing Tool
Crowd
Sourcing Tool
Questi   ns
Thank You!

More Related Content

Similar to User Experience Design [UXD]

In order for UX to achieve it’s potential, we need to reframe it as a profess...
In order for UX to achieve it’s potential, we need to reframe it as a profess...In order for UX to achieve it’s potential, we need to reframe it as a profess...
In order for UX to achieve it’s potential, we need to reframe it as a profess...Peter Merholz
 
Into the landscape of UX
Into the landscape of UXInto the landscape of UX
Into the landscape of UXVinny Wu
 
Zukunftsmarkt Zocken
Zukunftsmarkt ZockenZukunftsmarkt Zocken
Zukunftsmarkt ZockenStephan Engl
 
Elements
ElementsElements
Elementskaa kaa
 
User Research 1 : UX introduction
User Research 1 : UX introductionUser Research 1 : UX introduction
User Research 1 : UX introductionTaewon Eom
 
PxS’12 - week 4 - UX design techniques
PxS’12 - week 4 - UX design techniquesPxS’12 - week 4 - UX design techniques
PxS’12 - week 4 - UX design techniqueshendrikknoche
 
Gastronomy: A source of inspiration for user experience design
Gastronomy: A source of inspiration for user experience designGastronomy: A source of inspiration for user experience design
Gastronomy: A source of inspiration for user experience designPeter Bogaards
 
The Elements of User Experience
The Elements of User ExperienceThe Elements of User Experience
The Elements of User ExperienceMichael Grillhösl
 
STI, MetaRational #2
STI, MetaRational #2STI, MetaRational #2
STI, MetaRational #2João Ramos
 
The Elements of User Experience
The Elements of User ExperienceThe Elements of User Experience
The Elements of User ExperienceBen van de Sande
 
Intro to UX part two
Intro to UX part twoIntro to UX part two
Intro to UX part twoKagonya Awori
 
PxS'12 - week 10 - screen design
PxS'12 - week 10 - screen designPxS'12 - week 10 - screen design
PxS'12 - week 10 - screen designhendrikknoche
 
Building for People: 5 Practical Tip for Greating Great UX
Building for People: 5 Practical Tip for Greating Great UXBuilding for People: 5 Practical Tip for Greating Great UX
Building for People: 5 Practical Tip for Greating Great UXqixingz
 
Importance of User eXperience
Importance of User eXperienceImportance of User eXperience
Importance of User eXperienceguest1bcbc9
 
More Elements of UX: real-world design deliverables
More Elements of UX: real-world design deliverablesMore Elements of UX: real-world design deliverables
More Elements of UX: real-world design deliverablesPeter Boersma
 

Similar to User Experience Design [UXD] (20)

In order for UX to achieve it’s potential, we need to reframe it as a profess...
In order for UX to achieve it’s potential, we need to reframe it as a profess...In order for UX to achieve it’s potential, we need to reframe it as a profess...
In order for UX to achieve it’s potential, we need to reframe it as a profess...
 
Into the landscape of UX
Into the landscape of UXInto the landscape of UX
Into the landscape of UX
 
Zukunftsmarkt Zocken
Zukunftsmarkt ZockenZukunftsmarkt Zocken
Zukunftsmarkt Zocken
 
Elements
ElementsElements
Elements
 
User Research 1 : UX introduction
User Research 1 : UX introductionUser Research 1 : UX introduction
User Research 1 : UX introduction
 
PxS’12 - week 4 - UX design techniques
PxS’12 - week 4 - UX design techniquesPxS’12 - week 4 - UX design techniques
PxS’12 - week 4 - UX design techniques
 
Gastronomy: A source of inspiration for user experience design
Gastronomy: A source of inspiration for user experience designGastronomy: A source of inspiration for user experience design
Gastronomy: A source of inspiration for user experience design
 
The Elements of User Experience
The Elements of User ExperienceThe Elements of User Experience
The Elements of User Experience
 
STI, MetaRational #2
STI, MetaRational #2STI, MetaRational #2
STI, MetaRational #2
 
The Elements of User Experience
The Elements of User ExperienceThe Elements of User Experience
The Elements of User Experience
 
Elements
ElementsElements
Elements
 
Lean UX
Lean UXLean UX
Lean UX
 
Intro to UX part two
Intro to UX part twoIntro to UX part two
Intro to UX part two
 
PxS'12 - week 10 - screen design
PxS'12 - week 10 - screen designPxS'12 - week 10 - screen design
PxS'12 - week 10 - screen design
 
Dk glsec
Dk glsecDk glsec
Dk glsec
 
Building for People: 5 Practical Tip for Greating Great UX
Building for People: 5 Practical Tip for Greating Great UXBuilding for People: 5 Practical Tip for Greating Great UX
Building for People: 5 Practical Tip for Greating Great UX
 
User Experience 2: Talk@Stabilo
User Experience 2: Talk@StabiloUser Experience 2: Talk@Stabilo
User Experience 2: Talk@Stabilo
 
Importance of User eXperience
Importance of User eXperienceImportance of User eXperience
Importance of User eXperience
 
More Elements of UX: real-world design deliverables
More Elements of UX: real-world design deliverablesMore Elements of UX: real-world design deliverables
More Elements of UX: real-world design deliverables
 
Elements
ElementsElements
Elements
 

Recently uploaded

Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...
Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...
Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...mrchrns005
 
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degreeyuu sss
 
Design Portfolio - 2024 - William Vickery
Design Portfolio - 2024 - William VickeryDesign Portfolio - 2024 - William Vickery
Design Portfolio - 2024 - William VickeryWilliamVickery6
 
FiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfFiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfShivakumar Viswanathan
 
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...Rishabh Aryan
 
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 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
 
西北大学毕业证学位证成绩单-怎么样办伪造
西北大学毕业证学位证成绩单-怎么样办伪造西北大学毕业证学位证成绩单-怎么样办伪造
西北大学毕业证学位证成绩单-怎么样办伪造kbdhl05e
 
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degreeyuu sss
 
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degreeyuu sss
 
Untitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptxUntitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptxmapanig881
 
'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
 
Passbook project document_april_21__.pdf
Passbook project document_april_21__.pdfPassbook project document_april_21__.pdf
Passbook project document_april_21__.pdfvaibhavkanaujia
 
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一Fi L
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Rndexperts
 
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
 
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts ServiceCall Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Servicejennyeacort
 
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一diploma 1
 
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
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Rndexperts
 

Recently uploaded (20)

Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...
Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...
Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...
 
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
 
Design Portfolio - 2024 - William Vickery
Design Portfolio - 2024 - William VickeryDesign Portfolio - 2024 - William Vickery
Design Portfolio - 2024 - William Vickery
 
FiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfFiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdf
 
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
 
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 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)
 
西北大学毕业证学位证成绩单-怎么样办伪造
西北大学毕业证学位证成绩单-怎么样办伪造西北大学毕业证学位证成绩单-怎么样办伪造
西北大学毕业证学位证成绩单-怎么样办伪造
 
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
 
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
 
Untitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptxUntitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptx
 
'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 ,
 
Passbook project document_april_21__.pdf
Passbook project document_april_21__.pdfPassbook project document_april_21__.pdf
Passbook project document_april_21__.pdf
 
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
 
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
 
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts ServiceCall Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
 
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一
 
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
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
 

User Experience Design [UXD]

  • 1. User eXperience. design created & presented by: divya bhatia
  • 3. Design is not just what it looks like and feels like. Design is how it works.
  • 4. User experience (UX) is the sum of a series of interactions a user has with a product, service, or organization.
  • 5. what & how of UXD useful usable understanding people’s needs, based in social & wants, behavior, cultural context constraints “wow” pleasi factor ng optimized for most frequent tasks reliabl evoke emotions simplicity effecti e ve exploring opportunity prototyping based on people’s past experiences stories human touch functio information & timely feedback nal innovat intuitiv ive e multiple iterations efficie nt forgiving for errors
  • 6. Generally, those who are outside the discipline of design assume that what designers do is decoration. Good Design is problem solving
  • 7. What we see as Design 10% Surface Visual Design
  • 8. 10% Surface Visual Design Skeleton Interface Design Navigation Design Information Design Structure 90% Interaction Design Information Architecture Scope Functional Specs Content Requirement Strategy User Needs Site Objectives
  • 10. UX Design Process  Business Objective  User Needs  Application Structure  Work Flow & User Flow Analysis
  • 11. UX Design Process  Layout Directions  Site Structure & Navigation  High level design & concept illustration
  • 12. UX Design Process  Defines content & functionality  Detailed Design without styling such as images & colors [ex .Wireframes]
  • 13. UX Design Process  Detailed Design with corporate brand Colors  Development & add functionality
  • 15. Why?
  • 16. Business Success is always defined by the quality of the overall customer experience.
  • 17. Websites that are hard to use frustrate customers, forfeit revenue and decrease brands value.
  • 18. Good design is the most important way to differentiate ourselves from our competitors.
  • 20. Requirements Development Deployment Phase Phase Phase Time cost Design Per Change Alternatives 8h 32 h per change per change
  • 21. Requirements Deployment Phase Phase 20 Changes * 35$ per changes * * 8 h per change 32 h per change 5,600$ 22,400$ **All the number used in this calculation is the assumption
  • 22. Savings $16,800 **All the number used in this calculation is the assumption
  • 23. Design is so critical. It should be on the agenda of every meeting in every single department.
  • 25. QRx Application Current Menu design Proposed Menu design Menu Items labels should be left aligned to have better visibility, as displayed here.
  • 26. QRx Search Current Text alignment can structure the date and will be more readable. Proposed
  • 27. Text alignment can structure the Intake Pop-up date and will be more readable. Current Proposed
  • 28. Crowd Sourcing Tool – Project Details Current Proposed
  • 35. Questi ns

Editor's Notes

  1. Add an example – Water or tea pot up side down
  2. I is to be removed
  3. Examples…
  4. Assume notes…