O slideshow foi denunciado.
Utilizamos seu perfil e dados de atividades no LinkedIn para personalizar e exibir anúncios mais relevantes. Altere suas preferências de anúncios quando desejar.

Draw the Line: Better UX With Sketching

UX designer and comics nerd Deb Aoki shows examples of how simple whiteboard sketching and storyboards can foster collaboration and facilitate better user experiences. Bonus content: a quick drawing tutorial so you can do it too!

  • Entre para ver os comentários

Draw the Line: Better UX With Sketching

  1. 1. DRAW THE LINE: BETTER UX WITH SKETCHING DEB AOKI SR. INFORMATION EXPERIENCE DESIGNER, CITRIX
  2. 2. HELLO! UX Design + Content Strategy + Comics + Manga Nerd = Deb Aoki
  3. 3. I LOVE COMICS. I READ COMICS. I DRAW COMICS. Bento Box in the Honolulu Star-Advertiser
  4. 4. I WRITE ABOUT COMICS TOO.
  5. 5. MEANWHILE, MOST OF MY JOBS WERE ABOUT WRITING FOR THE WEB
  6. 6. THEN I GOT A JOB AT…
  7. 7. AND I STARTED USING MY DRAWING SKILLS MORE AND MORE…
  8. 8. THEN I GOT A JOB AT… I still write, but now I mostly draw. …which is pretty awesome
  9. 9. WHY DRAW PICTURES? • Focuses on users’ needs and problems, rather than on design, business, or technology concerns or limitations • Pictures can communicate abstract ideas and user experiences quickly and powerfully • Faster and cheaper than coding clickable prototypes or designing wireframes, or polished page mock-ups • Can provide a ‘big picture’ perspective of the entire user experience, goals & messaging • It’s fun! And it encourages participation and informal discussions
  10. 10. CAPTURE WORKFLOWS SEE THE BIG PICTURE / SEE HOW THE PIECES FIT TOGETHER
  11. 11. CAPTURE WORKFLOWS SEE THE BIG PICTURE / SEE HOW THE PIECES FIT TOGETHER
  12. 12. CAPTURE WORKFLOWS SEE THE BIG PICTURE / SEE HOW THE PIECES FIT TOGETHER
  13. 13. CAPTURE WORKFLOWS SEE THE BIG PICTURE / SEE HOW THE PIECES FIT TOGETHER
  14. 14. CUSTOMER JOURNEY MAPPING CAPTURE QUOTES / “DAY IN THE LIFE” EXPERIENCES
  15. 15. CUSTOMER JOURNEY MAPPING CAPTURE QUOTES / “DAY IN THE LIFE” EXPERIENCES
  16. 16. USER PERSONAS MAKE THE CUSTOMER “REAL” / BRING THEM TO LIFE
  17. 17. USER PERSONAS MAKE THE CUSTOMER “REAL” / BRING THEM TO LIFE The Preparer The Networker The Facilitator The Sprinter The AssistantThe Investigator
  18. 18. USER PERSONAS MAKE THE CUSTOMER “REAL” / BRING THEM TO LIFE
  19. 19. HUMANIZE PAIN-POINTS MAKES USERS’ PROBLEMS FEEL MORE ‘REAL’ AND URGENT
  20. 20. HUMANIZE PAIN-POINTS MAKES USERS’ PROBLEMS FEEL MORE ‘REAL’ AND URGENT
  21. 21. STORYBOARDING DEMONSTRATE USER SCENARIOS
  22. 22. STORYBOARDING DEMONSTRATE USER SCENARIOS
  23. 23. STORYBOARDING DEMONSTRATE USER SCENARIOS
  24. 24. STORYBOARDING DEMONSTRATE USER SCENARIOS
  25. 25. STORYBOARDING DEMONSTRATE USER SCENARIOS
  26. 26. VISUAL NOTETAKING CAPTURE BIG IDEAS AND MAKE THEM MEMORABLE
  27. 27. ‘BUT I CAN’T DRAW’ If you can draw dots, circles, squares, and lines, you can draw. Yes, you can!
  28. 28. CIRCLE + SQUARE + DOTS + LINES =
  29. 29. DO IT YOUR WAY!
  30. 30. DO IT YOUR WAY!
  31. 31. CIRCLE + DOTS + LINES = FACES AND EMOTIONS
  32. 32. idea lock / security time listen cloud laptop NO! money fast slowsmartphone email DRAW COMMON CONCEPTS IN A FEW STROKES
  33. 33. SHOW DIFFERENT PERSPECTIVES CLOSE-UP Emphasis on screen/finger interaction MID-TORSO Emphasis on screen SEMI-CLOSE Emphasis on device / human context/use FULL BODY Emphasis on ‘real world’ context/place of use
  34. 34. SUGGESTED READING
  35. 35. THANK YOU! EMAIL: DEBORA.AOKI@CITRIX.COM TWITTER: @DEBAOKI ALSO: HTTP://WWW.MANGACOMICSMANGA.COM

×