Storytelling & The Human Form (UX Intensive for MySkills4Afrika)

Download Storytelling & The Human Form (UX Intensive for MySkills4Afrika)

Post on 12-Aug-2015

174 views

Category:

Design

2 download

TRANSCRIPT

  1. 1. Topics Covered DAY 1 Introduction to Modern Design Microsoft Design Principles Design Process Windows Building Blocks Build 2014 DAY 2 Storytelling and the Human Fom Natural User Interfaces Mini-improv workshop: Storytelling Storyboarding, Scenarios, and Personas Technologies & Trends DAY 3 Psychology of Design Basic principles Gamification Motivational Design DAY 4 Visual Design for Modern UI Basics Grids & Tiles Typography Color & Content
  2. 2. This is not a computer science class. This class is not just for those that want to be designers This is not an intro-level user experience class
  3. 3. Degree in Computer Science and Human- Computer Interaction from Carnegie Mellon University Over 10 years of experience spanning multiple industries: web, automotive, cloud and server technology, education, theme parks, and video games. 6.5 years at Microsoft My current project: designing the future of the connected experience for cars; helping to define the future of Microsofts Internet of Things In my free time: Im a professional improv actress/teacher, singer, and video gamer.
  4. 4. - Touch & Haptic Feedback - Voice control / Speech - Gesture (movement through space)
  5. 5. lighter cognitive burden new options traditional input methods dont work
  6. 6. touch
  7. 7. Touch target size
  8. 8. Touch target size: TWIST!
  9. 9. Visual feedback
  10. 10. Living with the hand
  11. 11. Touch Gestures: An Example
  12. 12. Trends on the horizon
  13. 13. Defining grammar-based interaction
  14. 14. Defining natural language
  15. 15. Speech listening models
  16. 16. Lessons learned from life as a speech designer
  17. 17. Gesture input models
  18. 18. State of the art
  19. 19. Hover and proximity detection
  20. 20. Gesture design pitfalls Poorly designed gestures can cause physical harm to users!
  21. 21. Planning at Microsoft We use scenario focused design as a process to help us ensure were building the right products. By learning a few of our methods, your planning will improve as well.
  22. 22. Personas dont work when theyre not well- communicated.
  23. 23. What makes a good persona?
  24. 24. Persona traps
  25. 25. Personas: Practice and Theory Personas, Participatory Design, and Product Development: An Infrastructure for Engagement
  26. 26. How can we connect these learnings to our design process? How do we ground ourselves in our customers reality instead of our own? Scenarios and storyboards. iHub already teaches great courses on interviewing, personas, research and contextual inquiry. We wont dwell on that process here.
  27. 27. story happy ending
  28. 28. S P I C I E R
  29. 29. Download attachments Edit content Share content with others Send attachments Forward meeting invites Check meeting details View content Log into a VPN Change corporate settings Comply with IT policies Stay secure Communicate with others Feel satisfied that work is complete
  30. 30. Download attachments Edit content Share content with others Send attachments Forward meeting invites Check meeting details View content Log into a VPN Change corporate settings Comply with IT policies Stay secure Communicate with others Feel satisfied that work is complete
  31. 31. piece of email unlocks clicks new mail icon note clicks on reply beeps. new email Excel attachment
  32. 32. Jane, a sales exec, has only 30 minutes before her flight to Chicago leaves. While waiting, Jane notices an important message from her colleague, Sue. Their partner has asked to see 3rd quarter projections as well as 2nd quarter. Jane anxiously responds to her colleague to let her know that she got the message but doesnt have the 3rd quarter projections can Sue send it to her immediately, before her flight leaves? A couple of minutes later, Jane gets the 3rd quarter projections and has just enough time to skim through it before boarding her flight, where she will read it thoroughly. She is relieved and confident that she will be fully prepared for her meeting.
  33. 33. Opportunity or problem how Happy ending
  34. 34. Intentional product scoping constraint B) Jane uses the dropdown to pick the right doc Implementation detail User context supported by research
  35. 35. Storyboarding
  36. 36. Dan Roam: The Back of the Napkin
  37. 37. Why storyboards? Make our users context tangible & understandable Get stakeholders emotionally connected Convey the human results were looking for Define success independent of a solution
  38. 38. Its 5PM and Allison is on the highways heading home from work. Allison pulls into her garage after a long day of work. Allison turns off the engine and is ready to head inside. FRAME 1 FRAME 2 FRAME 3
  39. 39. Allisons car chimes and a message appears as it is read to her. The system requires a major update that will improve performance and security. Allison particularly notices that the car wont be usable during the update. The car asks if shed like the update scheduled for late tonight, but Allison is worried that her sick son might get worse. Allison instead chooses a time thatll work better for her. Allison heads inside and checks in on her son. She doesnt give her car any more thought that night. FRAME 4 FRAME 5 FRAME 6
  40. 40. On Thursday night, as Allison is turning off her car, she gets a reminder that SPA will be applying the update that night at 2AM. Allisons son is feeling better, so that time doesnt raise any red flags. On Friday morning when Allison wakes up, she has a notification letting her know that the update was successful. Shes glad she doesnt have to leave early to check on the car and the update. FRAME 7 FRAME 8
  41. 41. Do not include UI. some
  42. 42. From Scott McClouds Understanding Comics
  43. 43. Wong-Baker FACES Pain Rating Scale
  44. 44. Sketching for design
  45. 45. Use a pen if you can Optional additional tools Capture the sketches: scanner or digital photo
  46. 46. Take a pen and piece of paper Experiment with lengths, directions, stroke speeds
  47. 47. Take a pen and piece of paper Experiment with box sizes Draw at least 20 boxes
  48. 48. Take a pen and piece of paper Experiment with circle sizes. Draw at least 20 circles Play with ovals too
  49. 49. Take a pen and piece of paper Experiment with widths, lengths, and tail styles Straight arrows and curved arrows
  50. 50. Take a pen and piece of paper Experiment with widths, lengths, and tail styles Straight arrows and curved arrows
  51. 51. Windows 8 natively supports 3D printing 3D apps are generally expensive market opportunity for making 3D modeling more accessible Maker culture empowers a new generation of enthusiasts, but how can these makers be supported? 3D Printing