Design Principles:The Philosophy of UX     Whitney Hess           @whitneyhess      http://whitneyhess.com     whitney@whi...
Hi, I’m Whitney Hess User Experience Designer        Consultant        New Yorker      @whitneyhess
stakeholder interviewsweb analytics       storyboards  sketching                surveys            A/B testing           p...
User Experience is the   establishment   of a philosophy    about how to     treat people
Visual Design is the   establishment  of a philosophy    about how to  make an impact
Principles ofVisual Design
Contrast
Emphasis
Variety
Balance
Proportion
Repetition
Movement
Texture
Harmony
Unity
Why principles?    Consistency.    Constraints.   Shared vision.Objective evaluation.
good  design   goodexperience
goodL e t ’s                        design         do t ht o ge           is         the r                        =       ...
Principles ofExperience Design
Principles of Experience Design   1. Stay out of people’s way.   2. Create a hierarchy that matches people’s needs.   3. L...
1. Stay out of people’s way
1. Stay out of people’s way
1. Stay out of people’s way
2. Create a hierarchy thatmatches people’s needs
2. Create a hierarchy thatmatches people’s needs
2. Create a hierarchy thatmatches people’s needs
3. Limit distractions
3. Limit distractions
3. Limit distractions
4. Provide stronginformation scent
4. Provide stronginformation scent
4. Provide stronginformation scent
5. Provide signposts and cues
5. Provide signposts and cues
5. Provide signposts and cues
6. Provide context
6. Provide context
6. Provide context
7. Use constraints appropriately
7. Use constraints appropriately
7. Use constraints appropriately
8. Make actions reversible
8. Make actions reversible
8. Make actions reversible
9. Provide feedback
9. Provide feedback
9. Provide feedback
10. Make a good first impression
10. Make a good first impression
10. Make a good first impression
Logos                      consistency, logic                     Persuasion  Ethos                                       ...
Knowledge                     consistency, logic                      Purpose Ethics                                      ...
Areuniversal principles     enough?
Design principles forcompanies you know
“Ten principles that contributeto a Googley user experience” Focus on people – their lives, their work, their dreams. Ever...
“Ten principles that contributeto a Googley user experience” Focus on people – their lives, their work, their dreams. Ever...
Facebook Design Principles          Universal.          Human.          Clean.          Consistent.          Useful.      ...
Facebook Design Principles          Universal.          Human.          Clean.          Consistent.          Useful.      ...
Windows User Experience   Design PrinciplesReduce concepts to increase confidence.Small things matter, good and bad.Be grea...
Windows User Experience   Design PrinciplesReduce concepts to increase confidence.Small things matter, good and bad.Be grea...
Burning ManKeep good company.Notice the ordinary.Preserve the ephemeral.Design not for the elite but for the masses.Explai...
Charles and Ray Eames  Keep good company.  Notice the ordinary.  Preserve the ephemeral.  Design not for the elite but for...
Burning Man Radical Inclusion. Giing. Decommodification. Radical Self-reliance. Radical Self-expression. Communal Effort. C...
Burning Man Radical Inclusion. Giing. Decommodification. Radical Self-reliance. Radical Self-expression. Communal Effort. C...
ﬔe Starbucks Experience       Make it your own.       Everything matters.       Surprise and delight.       Embrace resist...
ﬔe Starbucks Experience       Make it your own.       Everything matters.       Surprise and delight.       Embrace resist...
What areyour company’s  principles?
Steps to Craing YourOwn Design Principles1. Research available principles for competitors   and related organizations (ev...
1. Does it come directly from research?2. Does it help you say ‘No’ most of the time?3. Does it distinguish your design fr...
When to Use YourDesign Principles1. During the project kickoff meeting2. When prioritizing features3. Brainstorming session...
User Experience is the   establishment   of a philosophy    about how to     treat people
Bathroom mirrorSeaport Boston Hotel
Help peoplemake theirlives better
ﬔank you.      Whitney Hess      @whitneyhess http://whitneyhess.comwhitney@whitneyhess.com
Design principles philopsohy of ux -Whitney Hess
Design principles philopsohy of ux -Whitney Hess
Design principles philopsohy of ux -Whitney Hess
Design principles philopsohy of ux -Whitney Hess
Design principles philopsohy of ux -Whitney Hess
Upcoming SlideShare
Loading in …5
×

Design principles philopsohy of ux -Whitney Hess

4,216 views

Published on

Whitney Hess - www.whitneyhess.com

Published in: Design, Technology

Design principles philopsohy of ux -Whitney Hess

  1. 1. Design Principles:The Philosophy of UX Whitney Hess @whitneyhess http://whitneyhess.com whitney@whitneyhess.com
  2. 2. Hi, I’m Whitney Hess User Experience Designer Consultant New Yorker @whitneyhess
  3. 3. stakeholder interviewsweb analytics storyboards sketching surveys A/B testing prototyping flow diagrams What we usually talk about when we talk about UX wireframes scenarios sitemaps personas card sorts heuristic evaluationusability testing user research
  4. 4. User Experience is the establishment of a philosophy about how to treat people
  5. 5. Visual Design is the establishment of a philosophy about how to make an impact
  6. 6. Principles ofVisual Design
  7. 7. Contrast
  8. 8. Emphasis
  9. 9. Variety
  10. 10. Balance
  11. 11. Proportion
  12. 12. Repetition
  13. 13. Movement
  14. 14. Texture
  15. 15. Harmony
  16. 16. Unity
  17. 17. Why principles? Consistency. Constraints. Shared vision.Objective evaluation.
  18. 18. good design goodexperience
  19. 19. goodL e t ’s design do t ht o ge is the r = ! good experience
  20. 20. Principles ofExperience Design
  21. 21. Principles of Experience Design 1. Stay out of people’s way. 2. Create a hierarchy that matches people’s needs. 3. Limit distractions. 4. Provide strong information scent. 5. Provide signposts and cues. 6. Provide context. 7. Use constraints appropriately. 8. Make actions reversible. 9. Provide feedback. 10. Make a good first impression.
  22. 22. 1. Stay out of people’s way
  23. 23. 1. Stay out of people’s way
  24. 24. 1. Stay out of people’s way
  25. 25. 2. Create a hierarchy thatmatches people’s needs
  26. 26. 2. Create a hierarchy thatmatches people’s needs
  27. 27. 2. Create a hierarchy thatmatches people’s needs
  28. 28. 3. Limit distractions
  29. 29. 3. Limit distractions
  30. 30. 3. Limit distractions
  31. 31. 4. Provide stronginformation scent
  32. 32. 4. Provide stronginformation scent
  33. 33. 4. Provide stronginformation scent
  34. 34. 5. Provide signposts and cues
  35. 35. 5. Provide signposts and cues
  36. 36. 5. Provide signposts and cues
  37. 37. 6. Provide context
  38. 38. 6. Provide context
  39. 39. 6. Provide context
  40. 40. 7. Use constraints appropriately
  41. 41. 7. Use constraints appropriately
  42. 42. 7. Use constraints appropriately
  43. 43. 8. Make actions reversible
  44. 44. 8. Make actions reversible
  45. 45. 8. Make actions reversible
  46. 46. 9. Provide feedback
  47. 47. 9. Provide feedback
  48. 48. 9. Provide feedback
  49. 49. 10. Make a good first impression
  50. 50. 10. Make a good first impression
  51. 51. 10. Make a good first impression
  52. 52. Logos consistency, logic Persuasion Ethos Pathoscredibility, trust emotions, imagination
  53. 53. Knowledge consistency, logic Purpose Ethics Empathycredibility, trust emotions, imagination
  54. 54. Areuniversal principles enough?
  55. 55. Design principles forcompanies you know
  56. 56. “Ten principles that contributeto a Googley user experience” Focus on people – their lives, their work, their dreams. Every millisecond counts. Simplicity is powerful. Engage beginners and attract experts. Dare to innovate. Design for the world. Plan for today’s and tomorrow’s business. Delight the eye without distracting the mind. Be worthy of people‘s trust. Add a human touch.
  57. 57. “Ten principles that contributeto a Googley user experience” Focus on people – their lives, their work, their dreams. Every millisecond counts. Simplicity is powerful. Engage beginners and attract experts. Dare to innovate. Design for the world. Plan for today’s and tomorrow’s business. Delight the eye without distracting the mind. Be worthy of people’s trust. Add a human touch. http://www.google.com/corporate/ux.html
  58. 58. Facebook Design Principles Universal. Human. Clean. Consistent. Useful. Fast. Transparent.
  59. 59. Facebook Design Principles Universal. Human. Clean. Consistent. Useful. Fast. Transparent. http://www.facebook.com/note.php?note_id=118951047792
  60. 60. Windows User Experience Design PrinciplesReduce concepts to increase confidence.Small things matter, good and bad.Be great at “look” and “do”.Solve distractions, not discoverability.UX before knobs and questions.Personalization, not customization.Value the life cycle of the experience.Time matters, so build for people on the go.
  61. 61. Windows User Experience Design PrinciplesReduce concepts to increase confidence.Small things matter, good and bad.Be great at “look” and “do”.Solve distractions, not discoverability.UX before knobs and questions.Personalization, not customization.Value the life cycle of the experience.Time matters, so build for people on the go. http://msdn.microso.com/en-us/library/dd834141.aspx
  62. 62. Burning ManKeep good company.Notice the ordinary.Preserve the ephemeral.Design not for the elite but for the masses.Explain it to a child.Get lost in the content.Get to the heart of the matter.Never tolerate “OK anything.”Remember your responsibility as a storyteller.Zoom out.Switch.Prototype it.Pun.Make design your life… and life, your design.Leave something behind.
  63. 63. Charles and Ray Eames Keep good company. Notice the ordinary. Preserve the ephemeral. Design not for the elite but for the masses. Explain it to a child. Get lost in the content. Get to the heart of the matter. Never tolerate “OK anything.” Remember your responsibility as a storyteller. Zoom out. Switch. Prototype it. Pun. Make design your life… and life, your design. Leave something behind. http://www.amazon.com/Fieen-ﬔings-Charles-Ray-Teach/dp/193031700X
  64. 64. Burning Man Radical Inclusion. Giing. Decommodification. Radical Self-reliance. Radical Self-expression. Communal Effort. Civic Responsibility. Leaving No Trace. Participation. Immediacy.
  65. 65. Burning Man Radical Inclusion. Giing. Decommodification. Radical Self-reliance. Radical Self-expression. Communal Effort. Civic Responsibility. Leaving No Trace. Participation. Immediacy. http://www.burningman.com/whatisburningman/about_burningman/principles.html
  66. 66. ﬔe Starbucks Experience Make it your own. Everything matters. Surprise and delight. Embrace resistance. Leave your mark.
  67. 67. ﬔe Starbucks Experience Make it your own. Everything matters. Surprise and delight. Embrace resistance. Leave your mark. http://www.starbucksexperience.net/excerpts.html
  68. 68. What areyour company’s principles?
  69. 69. Steps to Craing YourOwn Design Principles1. Research available principles for competitors and related organizations (even aspirational)2. Gather, list and print out the business goals, user needs and brand attributes3. Brainstorm with key collaborators across capabilities and functions4. Narrow down to no more than 10, preferably 75. Ensure they don’t conflict or overlap6. Ensure they’re pithy and memorable
  70. 70. 1. Does it come directly from research?2. Does it help you say ‘No’ most of the time?3. Does it distinguish your design from your competitors’?4. Is it something you might reverse in a future release?5. Have you evaluated it for this project?6. Is its meaning constantly tested? http://www.uie.com/articles/creating-design-principles/
  71. 71. When to Use YourDesign Principles1. During the project kickoff meeting2. When prioritizing features3. Brainstorming sessions4. Design critiques5. Stakeholder presentations6. Resolving conflict7. Postmortems8. Web metrics analysis
  72. 72. User Experience is the establishment of a philosophy about how to treat people
  73. 73. Bathroom mirrorSeaport Boston Hotel
  74. 74. Help peoplemake theirlives better
  75. 75. ﬔank you. Whitney Hess @whitneyhess http://whitneyhess.comwhitney@whitneyhess.com

×