Usere xperience designprinciples


Published on

User eXperience : Design Principles, describes user experience, and does a dive into various design principles.

Published in: Technology
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Usere xperience designprinciples

  1. 1. User Experience : UI Design PrinciplesHemant Singh@singhhemant
  2. 2. Objectives of the presentationExplain “User Experience”Explore Common Design PrinciplesWhere to go next?Q&A
  3. 3. This talk is differentNo CodeVery verbose…………“Use what you know. Do what you’ve always imagined”
  4. 4. Old Software is well oldOld ways of developing applications are passé……..Limited software toolsDesign took a backseatLimited hardware support.
  5. 5. Business Application development
  6. 6. What Changed?•Wide array of devices to consume content•Connectivity everywhere•Touch Computing•Cloud Storage (device store minimum data)
  7. 7. Change?
  8. 8. Change?
  9. 9. Payoffs of adapting new waysHigher ProductivityLower trainingFewer errorsAdoption of technology by wide spectrum.Satisfied users
  10. 10. What is User Experience?“It’s the cumulative experience of your product thatpeople remember, talk about, love or hate.”
  11. 11. Design Principle : Archetypes“Universal patterns of theme and form resulting frominnate biases or dispositions”
  12. 12. Design Principle : Archetypes
  13. 13. Design Principle : Archetypes
  14. 14. Design Principle : Fitt’s Law“The time required to move to a target is a function of thetarget size and distance to the target.”
  15. 15. Design Principle : Fitt’s Law“Consider strategies that constrain movements whenpossible to improve performance and reduce error.”
  16. 16. Design Principle : Fitt’s Law
  17. 17. Design Principle : Inattentive Blindness“The failure to cognitively process a stimuli that ispresented in clear view, leaving the observer without anyawareness or memory of the stimulus.”
  18. 18. Design Principle : Inattentive Blindness• Increased cognitive Load decreases user awareness.• Complex data entry should be broken in simple steps.(Multiple screens, Collapsible areas / Wizards)• Errors on a screen, should be displayed at or near thesource of error.• Errors should come quickly enough to be relevant.• Errors should be differentiated from screen text
  19. 19. Design Principle : Inattentive Blindness
  20. 20. Design Principle : Pareto’s Principle(80/20)“A high percentage of effects in any large system arecaused by a low percentage of variables.”
  21. 21. Design Principle : Pareto’s Principle(80/20)Non critical functions that are part of the less important80% should be minimized or removed altogether from thedesign.
  22. 22. Design Principle : Pareto’s Principle(80/20)
  23. 23. Design Principle : Hick’s LawThe time it takes to decision increases with the number ofalternatives.The law applies to the design of software menus, controldisplays, context menus and emergency response.
  24. 24. Design Principle : Hick’s Law
  25. 25. Design Principle : Five Hat Racks•There are five ways to organize informationLocationAlphabetTimeCategoryHierarchy
  26. 26. Design Principle : Five Hat Racks
  27. 27. Design Principle : Biophilia“Environments rich in nature views and imagery reducestress and enhance focus and concentration.”
  28. 28. Design Principle : Biophilia
  29. 29. Design Principle : Biophilia•Environments rich in nature views and imagery reducestress and enhance focus and concentration.•Business applications which deal with learning, healing,healthcare, education, concentration …. should considerbiophilia design.
  30. 30. Design Principle : Rule of ThirdsAn image should be imagined as divided into nine equalparts by two equally-spaced horizontal lines and twoequally-spaced vertical lines, and that importantcompositional elements should be placed along theselines or their intersection.
  31. 31. Design Principle : Rule of Thirds
  32. 32. Design Principle : Savanna PrincipleTendency to prefer savanna like environments (Openareas, scattered trees, water, lush grass,..) to otherenvironments.
  33. 33. Design Principle : Savanna Principle
  34. 34. Design Principle : Gutenberg Diagram“A diagram that describes the general pattern followed bythe eyes when looking at evenly distributed, homogenousinformation.”
  35. 35. Design Principle : Gutenberg Diagram
  36. 36. Design Principle : Gutenberg Diagram
  37. 37. Design Principle : Symmetry•Elements that are similar are perceived to be morerelated than elements that are dissimilar.
  38. 38. Design Principle : Symmetry
  39. 39. Design Principle : Attractiveness Bias"A tendency to see attractive people as more intelligentcompetent, moral and sociable than unattractive people."Used in images of people in marketing or advertising.
  40. 40. Design Principle : Attractiveness Bias
  41. 41. Design Principle : Horror VaccuiA tendency to favor filing blank spaces with objects andelements over leaving spaces blank or empty.
  42. 42. Design Principle : Horror Vaccui
  43. 43. Design Principle : Horror Vaccui
  44. 44. Design Principle : Contour Bias“A tendency to favor objects with contours over objectswith sharp angles or points.”
  45. 45. Design Principle : Contour Bias
  46. 46. Design Principle : Garbage In Garbage Out"Quality of system output is dependent on the quality ofthe system input "
  47. 47. Design Principle : Garbage In Garbage Out
  48. 48. Design Principle : Garbage In Garbage Out
  49. 49. Design Principle : ClassificationLayout Fitts Law, Paretos Principle, Gutenberg DiagramBackground ArcheTypes, Biophilia, Rule of Thirds, Savanna, Attractiveness Bias, Horror VacuuiMenus Hicks Law, Fitts LawControls ArcheTypes, Symmetry, Contour Bias, Five Hat RacksError Handling Inattentive Blindness, Garbage In Garbage OutForms Garbage In Garbage Out
  50. 50. References• The design of everyday things (David Norman)• Universal Principles of Design, Revised and Updated: 125 Ways to Enhance Usability,Influence Perception, Increase Appeal, Make Better Design Decisions, and Teachthrough Design• Smashing Magazine Ux Design (• Billy Hollis (talk on ux design, pluralsight)