Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Why You're Over-thinking your UI/UX

0e5eda3618ce330abce90adbb833c036?s=47 Rohan Puri
July 18, 2013

Why You're Over-thinking your UI/UX

Presented at Harvard iLab

0e5eda3618ce330abce90adbb833c036?s=128

Rohan Puri

July 18, 2013
Tweet

More Decks by Rohan Puri

Other Decks in Design

Transcript

  1. WHY YOU’RE OVER-THINKING IT A Doers Guide to UI/UX @RohanSPuri

    @theCristoforo
  2. There are very few known techniques that can accurately and

    consistently shape a good UI/UX
  3. Beauty Comes Second

  4. Users Resist Change

  5. None
  6. Make Users Feel Smart

  7. Familiarity = Speedy Learning

  8. Timing and Parallelizing

  9. Narrow Build Test/Collect Simplify

  10. Narrow Your Scope 1.Identifies a narrow band of target users

    (specifically your first-adopters) 2.Speeds up development time 3.Guides testing 4.Gives marketing individuals early insight into user acquisition strategies 5.Narrows down number of variables for testing 6.Saves money!
  11. None
  12. How __Product____ is a ___(general, relatable tool)___ that allows __(2

    adj + target users)__ to __(use-case)__
  13. Define Personas

  14. Check Yourself - Storyboard Use your personas Identify and cut

    long trees/branches Identify dead ends
  15. STOP

  16. Build. Speed is King

  17. TOOLS YOU NEED TO KNOW these tools help you move

    faster so you can test faster. Build Distribute Collect
  18. None
  19. None
  20. None
  21. Simplify

  22. Any intelligent fool can make things bigger, more complex and

    more violent. It takes a touch of genius and a lot of courage to move in the opposite direction. - Albert Einstein
  23. None
  24. None
  25. Make everything as simple as possible, but not simpler.— Albert

    Einstein
  26. None
  27. None
  28. None
  29. Focus Modals — depth + motion High contrast — color

    + light (theater mode) Weighting based on priority
  30. None
  31. None
  32. Hide the Inactive Understand your medium Hide / Hover controls

    (desktop but not mobile) Context-based Expand & Collapse forms
  33. None
  34. None
  35. Reduce Inputs vs. De-clutter Screen

  36. None
  37. Rule of White Space

  38. None
  39. Before adding UI elements, try achieving the same goal with

    spacing.
  40. Picture > Words

  41. Flat UI & Skeuomorphism skeuomorphic UI — using digital elements

    resembling real-world objects flat UI — elimination of ornamental elements not core to meaning
  42. None
  43. None
  44. None
  45. Simple images convey information more quickly than detailed illustrations

  46. Recognize when metaphors become unnecessary The button is the ultimate

    metaphor Other forms of metaphor: physics, animations, sounds, gestures, etc.