Designing the user experience

       Deborah A. Levinson
Discovery process – defining the problem


• What are your goals?


• Who will benefit from what you build?


• What does ...
What are your goals?




$$$                    Corporate/
                                          ?
    Sell products  ...
MIT Housing website
MIT Division of Student Life website


                                       new!




old
Who will benefit from what you build?



primary audience




                                        secondary audience
Who will benefit from what you build?

 • Adults
 • Children
 • Teenagers
 • Students
 • Faculty                          ...
What does your site/application need to do?

Talk to your audience! Find out what they need.



        “Tell us about a t...
Audience needs/patterns of use drive the site design and features
What shouldn’t drive your design and feature set?

                                                    cville.ownyourc.com...
Uncovering what users want and need




   surveys                                one-on-one
                        focus...
Communicating with your audience – content and its organization



• Define key messages – elevator speech




           ...
Information architecture examples




       csail.mit.edu                               www.apple.com




               ...
Communicating with your audience – visual design

Good visual design isn't just decoration – it's a core element of your
o...
Communicating with your audience – visual design

Translate your most important qualities into design and features.
Tools & techniques – site maps
Tools & techniques – interviews with card-sorts and storytelling




       5-12 participants            < 30 cards       ...
Interview results

quotes




stories




Specific issues
students perceive          the current site is failing to       as soon as the “barrier” is
MIT Medical as slow        pro...
Tools & techniques – usability testing, with or without user interviews
Tools & techniques – scenarios of use
Tools & techniques – schematics/wireframes and clickable prototypes
Tools & techniques – flowcharts
Downloadable resources at http://web.mit.edu/debby/www/21w785/


Thank you!

                www.nimblepartners.com

     ...
Upcoming SlideShare
Loading in …5
×

Introducing User Experience Design to MIT Students

2,237 views

Published on

Guest-lecture for MIT class 21W785, "Communicating With Web-Based Media."

Published in: Design
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,237
On SlideShare
0
From Embeds
0
Number of Embeds
168
Actions
Shares
0
Downloads
36
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Introducing User Experience Design to MIT Students

  1. 1. Designing the user experience Deborah A. Levinson
  2. 2. Discovery process – defining the problem • What are your goals? • Who will benefit from what you build? • What does your site/application need to do?
  3. 3. What are your goals? $$$ Corporate/ ? Sell products educational info Aggregate info Build community (portal, calendar)
  4. 4. MIT Housing website
  5. 5. MIT Division of Student Life website new! old
  6. 6. Who will benefit from what you build? primary audience secondary audience
  7. 7. Who will benefit from what you build? • Adults • Children • Teenagers • Students • Faculty Also consider … • Employees • Age • Customers • Gender • Investors • Education level • All of the above? • Profession or business sector • Computer/web literacy • Locale
  8. 8. What does your site/application need to do? Talk to your audience! Find out what they need. “Tell us about a time you used the site.” “If you don’t use the site, where do you find this information instead?” “What brings you here the most?” “Can you tell us about a time when …”
  9. 9. Audience needs/patterns of use drive the site design and features
  10. 10. What shouldn’t drive your design and feature set? cville.ownyourc.com Technology (yours or www.dpgraph.com someone else’s) www.defense.gov Fear and/or unwillingness to say “no”
  11. 11. Uncovering what users want and need surveys one-on-one focus groups interviews A B C competitive analysis anecdotal data observation
  12. 12. Communicating with your audience – content and its organization • Define key messages – elevator speech • Identify categories/subcategories of information • Inventory available content • Map content and categories into site structure
  13. 13. Information architecture examples csail.mit.edu www.apple.com old undergraduate housing page
  14. 14. Communicating with your audience – visual design Good visual design isn't just decoration – it's a core element of your organization's brand. • Describe your organization's key qualities and what makes you unique. • Understand your audience's perception of you and whether it matches your vision of yourself. If it doesn't, why not? Faculty/staff perception Student perception of MIT Medical of MIT Medical Excellent Adequate Convenient Inconvenient Accessible Far away Caring Slow friendly
  15. 15. Communicating with your audience – visual design Translate your most important qualities into design and features.
  16. 16. Tools & techniques – site maps
  17. 17. Tools & techniques – interviews with card-sorts and storytelling 5-12 participants < 30 cards ~ 4 questions
  18. 18. Interview results quotes stories Specific issues
  19. 19. students perceive the current site is failing to as soon as the “barrier” is MIT Medical as slow provide contact information for broken, students are to respond making an appointment, which is happy with the services the number one reason people visit the site Perception gap: students Content and UI: contact Different audiences have perceive MIT Medical as information must be readily different perceptions: slow, but it is fast and apparent – especially how to Medical needs to work to effective make an appointment overcome student perceptions, but faculty and staff are content
  20. 20. Tools & techniques – usability testing, with or without user interviews
  21. 21. Tools & techniques – scenarios of use
  22. 22. Tools & techniques – schematics/wireframes and clickable prototypes
  23. 23. Tools & techniques – flowcharts
  24. 24. Downloadable resources at http://web.mit.edu/debby/www/21w785/ Thank you! www.nimblepartners.com debby@nimblepartners.com Special thank-yous to Tania Schlatter for the hand-drawn illustrations, and to Leah Buley at Adaptive Path, who inspired parts of the presentation format.

×