Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

User Experience 101 - A Practical Guide

23 vues

Publié le

- What is user experience?
- Where to start with UX?
- The difference between UX and UI

Publié dans : Design
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

User Experience 101 - A Practical Guide

  1. 1. UX - A Practical Guide
  2. 2. How is this going to work? This is NOT a lecture… ‣ Interactive discussion ‣ There is no “questions” slide
  3. 3. Who Are You? ‣ Designers? ‣ Developers? ‣ Marketers? ‣ Business Dev? ‣ Entrepreneur? ‣ Student?
  4. 4. Who Am I? ‣ Adrian Bunge ‣ Alumni of VIP Cohort 1 - TutorX ‣ UX Designer & Developer @ Nona ‣ Google Dev Group - Co-organiser
  5. 5. What do you hope to achieve by starting a company?
  6. 6. What do you hope to achieve? ‣ Build a great product ‣ How do we build a great product that users love? ‣ "You know, with Tesla, we're trying to make things that people love. [...] How many things can you buy that you really love, that really give you joy? So rare, so rare. I wish there were more things. That's what we're trying to do - make things that people love" - Elon Musk
  7. 7. What makes a great product?
  8. 8. A great overall experience…
  9. 9. The Realm of Experience ‣ Some UX Professionals split up experience into: ‣ User Exp., Customer Exp., Brand Exp. ‣ I don’t really like boxing in “experience”
  10. 10. Example - Mr D ‣ Driver need - more income ‣ Business need - decrease overheads ‣ Business need - increase driver satisfaction/earnings ‣ Design/Solution ‣ Defaults ‣ Order of items ‣ Tip once & you’ll know that the driver knows you’ve tipped upon delivery
  11. 11. Example - Mr D ‣ Ever wondered why your location can’t be changed after you’ve added items to your basket? ‣ Changes the delivery cost ‣ Complex backend functionality ‣ Undesirable for drivers ‣ Takes drivers outside of their assigned operating zones
  12. 12. Technically ‣ It is the process of enhancing user satisfaction with a product by improving the usability, accessibility, and pleasure provided in the interaction with the product. ‣ User experience design encompasses traditional human–computer interaction (HCI) design, and extends it by addressing all aspects of a product or service as perceived by users. Source: Wikipedia
  13. 13. Approaches To UX Design 1.You rely on your own empathy, proximity to the problem or experience to ensure product-problem fit ‣ Sometimes okay but DANGEROUS
  14. 14. Approaches
  15. 15. Approaches 2. Look at your competitors ‣ Try fall in love with how they do something - think about why they did something before criticising it ‣ Potential Negatives ‣ Inheriting bad/untested ideas ‣ Might not work in your use case ‣ Less differentiated product
  16. 16. Approaches 3. Design Patterns ‣ This helps with general usability ‣ Google Material Design material.io - devs will love you ‣ Apple - Human Interface Guidelines ‣ Highly rated Wordpress templates
  17. 17. Approacheshttps://youtu.be/w2JUhDd0CAA
  18. 18. Material Design Pattern
  19. 19. Approaches 4. Reading/Theory/First Principles ‣ Proven (peer reviewed) ‣ Sometimes the theory isn’t practical ‣ Behavioural economics ‣ Predictably Irrational - Dan Ariely
  20. 20. Approaches 5. Get/collect user data (upfront & after) ‣ This is always the pudding (proof is in the…) ‣ More is always better ‣ It always surprises me by how many people opt of this ‣ NB: Be careful of biases - e.g. recollection/response bias
  21. 21. Excuses for not testing/getting data 1. The users don’t know what they want 2. The feature doesn’t have all of it’s functionality yet…. so their opinion would be meaningless 3. You watching users, use the app changes what their feedback 4. Users will tell you, what you want to hear 5. Fear of rejection (not said but very common)
  22. 22. Side Note ‣ UX is very broad and touches just about everything ‣ So unless you know everything - impossible… it has to be a very collaborative exercise ‣ What you actually want to do is build a product improvement engine
  23. 23. My Process 1. Business case/requirements (e.g. increase revenue) 2. User needs/wants ==> Personas
  24. 24. Personas ‣ Know and constantly keep in mind who you’re design/ building this for ‣ What knowledge are they entering your experience with? ‣ What motivates them?
  25. 25. My Process 1. Business case/requirements (e.g. increase revenue) 2. User needs/wants ==> Personas 3. Constraints (combination of business & users) 4. Design constraints (platform, device capabilities) 5. Think about it - really try to absorb all the information 6. Whiteboard/Paper 7. Low-fi ==> High-fi
  26. 26. Important things to bear in mind ‣ Hierarchy of information ‣ Decrease friction where ever possible (some exceptions) ‣ How can what you design be tested? (Get to this later) ‣ Every choice must be justified/informed by the data/constraints
  27. 27. Example Time Food delivery company needs to communicate orders to restaurants Functionality ‣ New orders ‣ In progress ‣ Ready for collection ‣ Emphasis on time constraints ‣ History Information ‣ Items & Quantity ‣ Order Number ‣ Type (Deliv/Collec) ‣ Price of items Constraints ‣ Used from a distance ‣ Competes for attention ‣ Tablets ‣ Literacy ‣ Easy to use
  28. 28. ‣ Button Clicks (Analytics) - In particular new orders ‣ Intercom heat maps ‣ Fabric screen recording ‣ Watching users ‣ Interviewing users Testing
  29. 29. Other Useful Testing Tools ‣ A-B Testing ‣ Net Promoter Score - how likely are you to recommend this to a friend/colleague ‣ Watch people use the app
  30. 30. Designing CRAP ‣ Contrast ‣ Repetition (Consistency) ‣ Alignment ‣ Proximity
  31. 31. Designing CRAP ‣ Contrast ‣ Direct the viewer’s eyes to what’s important and helps them focus on what to do next.
  32. 32. Designing CRAP ‣ Contrast (Officially, 99.73% of people voted ‘Yes’ in this ballot.) Source
  33. 33. Designing CRAP ‣ Repetition (Consistency) ‣ Internal consistency and external consistency
  34. 34. Designing CRAP ‣ Alignment ‣ All elements of the design line up horizontally and vertically
  35. 35. BEFORE After Source: VWO
  36. 36. Designing CRAP ‣ Proximity ‣ Elements placed near each other, will make users think that they are somehow related
  37. 37. Designing CRAP ‣ Proximity
  38. 38. Last Points ‣ Always give users a sense of direction, and visibility of system status. They should get a feeling that they’re in control of the situation. ‣ They say “Good design is telepathic”. The user must understand what they are using your product for what are their main tasks. ‣ Less friction, more action ‣ Don’t let perfect be the enemy of good enough
  39. 39. DONE linkedin.com/in/adrianbunge/adrian.bunge@gmail.com
  40. 40. Awesome Resources ‣ Products/Startups ‣ http://playbook.samaltman.com/ ‣ CRAP ‣ https://www.userfocus.co.uk/articles/A_CRAP_way_to_improve_usability.html ‣ Resources for gaining inspiration ‣ Pinrest ‣ https://mobbin.design/ ‣ Other UX Articles for StartUps ‣ https://www.tronebrandenergy.com/blog/10-examples-good-user-experience-ux ‣ https://factoryberlin.com/magazine/ux-design-for-startups/ ‣ https://www.interaction-design.org/literature/article/do-entrepreneurs-and-startup- founders-need-to-know-about-ux-design
  41. 41. Approaches https://youtu.be/rrT6v5sOwJg

×