0
People-Centered Design
Creating Cost-E ective Websites

June 25, 2008
Commonwealth Club, San Francisco

Katrina Alcorn, Ho...
Introductions
                Katrina Alcorn
                Principal, User Experience & Content




                Rene...
Meet Hot Studio
Hot Studio is a
research-based,
people-centered
design studio.

Whether it’s a logo,
a book or a website:
...
Websites
From branded experiences to highly complex intranets
Websites
From ecommerce sites to ecommerce platforms
Websites
From science curiosity to sales productivity
What we plan to cover
How do you design things people love to use?

•   Bene ts of research

•   Overview of research meth...
Why do it?
Bene ts of research
Bene ts of research
Bene ts of research
Bene ts of research
Bene ts of research
The world of research
Overview of research methods
Overview of research methods
Fundamental questions of user research

•   Who are your target audience(s)?

•   What are th...
Quantitative vs. qualitative methods
•   Quantitative Research = Information presented in numeric form.
    Respondents an...
Contextual inquiry
What is it?
• Also called “ethnography,” “contextual
  observation,” “ eld studies”
• 1-2 moderators ob...
Surveys & questionnaires
What are they?
• Online or printed questions
• Can include both multiple choice/numbers-
  based ...
Focus groups
What are they?
• Form of qualitative research
• One researcher to several respondents
• Structured, group dis...
Interviews
What are they?
• Usually one-on-one
• May follow a structured discussion guide
• Allows the researcher to obser...
Usability testing
What are they?
• One-on-one sessions, in person or remote, to
  test prototype
• Can be on paper or comp...
Customer relationship data
What is it?
• Data about how audience is
  interacting with you or your site
• Can come from we...
The quest for insight
Our approach to research
When to use research
When to use research


          ethnography

          focus groups

                  surveys

                    inter...
How we use this information




Our research reveals   Some of these         These insights often
many detailed           ...
From insight to inspiration
How research inspired great design
California Academy of Sciences (before)
California Academy of Sciences
What we learned
• Site had to serve needs of everyone from kids to families to
  single adu...
CAS: New interactive home page
CAS: Science “heros” bring science to life
CAS: Animations create sense of whimsy
SFMOMA (before)
SFMOMA—What we learned
Many of the site users
• Come from surprising variety of professions and
  backgrounds
• Are intere...
SFMOMA: Help people plan their visit
 Insight: Users don’t understand the di erence between exhibitions
 and the permanent...
SFMOMA: Be strategic about Web 2.0 features
Insight: Users expressed surprisingly little interest in Web 2.0 features.
Any...
SFMOMA: Layer information for diverse users
 Insight: General site visitors
 are looking for very di erent
 information th...
Open Architecture Network
Open Architecture Network
What we learned
 • System had to meet diverse needs of architects, funders,
   displaced familie...
OAN: Robust search tool
OAN: A forum to promote and discuss designs
OAN: Workspace for team collaboration
United Methodist Church Youth (before)
United Methodist Church Youth
What we learned
 • Negative perceptions of church include “It’s boring” and
   “I don’t want...
UMC Youth: A place where teens can connect
UMC Youth: Providing a way to share their voice
UMC Youth: Share in a “non-churchy” way
Once Upon a School
Once Upon a School
What we learned
 • Achievement leaps when students gets 2-3 hours of
   undivided attention
 • Teachers...
OUAS: A place to tell stories and get inspired
OUAS: Connecting teachers with the community
OUAS: Inspiration through storytelling
Relative costs of user participation
•    Costs include:
             •     Initial price of technology
             •    ...
Conclusions
•   Interactivity is not a one-size- ts-all

•   Research can help you be strategic about where
    you put de...
Upcoming SlideShare
Loading in...5
×

People-Centered Design

2,299

Published on

Hot Studio presentation for the Commonwealth Club June 2008 about using research to design web sites.

Published in: Business, Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
2,299
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
51
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "People-Centered Design"

  1. 1. People-Centered Design Creating Cost-E ective Websites June 25, 2008 Commonwealth Club, San Francisco Katrina Alcorn, Hot Studio Renee Anderson, Hot Studio
  2. 2. Introductions Katrina Alcorn Principal, User Experience & Content Renee Anderson Director of User Experience
  3. 3. Meet Hot Studio Hot Studio is a research-based, people-centered design studio. Whether it’s a logo, a book or a website: We design things people love to use.
  4. 4. Websites From branded experiences to highly complex intranets
  5. 5. Websites From ecommerce sites to ecommerce platforms
  6. 6. Websites From science curiosity to sales productivity
  7. 7. What we plan to cover How do you design things people love to use? • Bene ts of research • Overview of research methods • Our approach to research • How research inspired great design
  8. 8. Why do it? Bene ts of research
  9. 9. Bene ts of research
  10. 10. Bene ts of research
  11. 11. Bene ts of research
  12. 12. Bene ts of research
  13. 13. The world of research Overview of research methods
  14. 14. Overview of research methods Fundamental questions of user research • Who are your target audience(s)? • What are their needs, wants, or aspirations? • Which of these can you satisfy online?
  15. 15. Quantitative vs. qualitative methods • Quantitative Research = Information presented in numeric form. Respondents answers are counted, summed, and typically presented in terms of percentages or averages.   • When should you use it? When you need to generalize about people’s speci c responses. • Qualitative Research = Exploration of people’s behaviors, attitudes, opinions, and beliefs. It allows us to reap rich insights about people’s underlying motivations, feelings, values, attitudes and perceptions. • When should you use it? To gain deep understanding of the mindset of your target audience.
  16. 16. Contextual inquiry What is it? • Also called “ethnography,” “contextual observation,” “ eld studies” • 1-2 moderators observe users in their home, at work, or in another typical environment What’s it good for? • When it’s critical to see precisely how a user behaves in a natural setting Associated costs • Do it yourself or hire an “observer” • Time for analyzing ndings and writing report Contextual inquiry in the jungle (above) or at the Gap (below).
  17. 17. Surveys & questionnaires What are they? • Online or printed questions • Can include both multiple choice/numbers- based answers as well as open-ended comments What are they good for? • Getting feedback on what people think or do (but not why) Associated costs • Fees for survey and reporting tools • Time for analyzing the data • Thank you gift to participants Caution: Can be really annoying if over-used! Also, hard to follow up. Except from Zoomerang questionnaire on SFMOMA project.
  18. 18. Focus groups What are they? • Form of qualitative research • One researcher to several respondents • Structured, group discussion What are they good for? • Measuring general attitudes about a product or concept • Generating ideas Associated costs Focus groups usually look like a lot of people sitting • Moderator fees around a table talking. This is a focus group we • Time for analyzing data and writing report conducted with eight art museum representatives from around the world. • Participant fees Caution: Focus groups can easily be dominated by one member. What people say isn’t always what they do.
  19. 19. Interviews What are they? • Usually one-on-one • May follow a structured discussion guide • Allows the researcher to observe non-verbal communication closely What are they good for? • Excellent way to get an in-depth understanding of user needs • Ideal for sensitive topics Hot Studio interviewing stakeholder for umc.org Associated costs redesign project. • Do it yourself or hire a moderator • Thank you gift to participants • Possible audio/video recordings • Time for analyzing data and writing report Caution: If you don’t ask questions in the right way, you may get misleading information.
  20. 20. Usability testing What are they? • One-on-one sessions, in person or remote, to test prototype • Can be on paper or computer What are they good for? • Re ning an interface Associated costs • Possible video/audio recordings • Facility rental • Moderator fees • Participant fees • Time for analyzing data and a written report Scenes from the testing facility at Otivo, one of Hot’s testing partners
  21. 21. Customer relationship data What is it? • Data about how audience is interacting with you or your site • Can come from web log les, customer support agents, and anyone who interacts with the end- user What’s it good for? • Going beyond what people say they’ll do, and learning what people really do Associated costs • Fees for reporting tool • Data analysis
  22. 22. The quest for insight Our approach to research
  23. 23. When to use research
  24. 24. When to use research ethnography focus groups surveys interviews usability testing customer data
  25. 25. How we use this information Our research reveals Some of these These insights often many detailed ndings lead to inspire new and ndings. insights about what creative design ideas. the target audience really needs.
  26. 26. From insight to inspiration How research inspired great design
  27. 27. California Academy of Sciences (before)
  28. 28. California Academy of Sciences What we learned • Site had to serve needs of everyone from kids to families to single adults, teachers, donors and sta • Environmental problems can be depressing – people want actionable, inspirational steps • Sta scientists have compelling stories to tell
  29. 29. CAS: New interactive home page
  30. 30. CAS: Science “heros” bring science to life
  31. 31. CAS: Animations create sense of whimsy
  32. 32. SFMOMA (before)
  33. 33. SFMOMA—What we learned Many of the site users • Come from surprising variety of professions and backgrounds • Are interested, but not necessarily educated, about modern art • Are fairly passive about Web 2.0-type features • Don’t understand the di erence between exhibitions and collections
  34. 34. SFMOMA: Help people plan their visit Insight: Users don’t understand the di erence between exhibitions and the permanent collection. They just want to nd out “what’s going on.” Design Idea: Create a one-stop section called “Exhibitions + Events.” Old navigation separates exhibitions from the calendar. This sketch of new navigation shows an “Exhibitions + Events” section.
  35. 35. SFMOMA: Be strategic about Web 2.0 features Insight: Users expressed surprisingly little interest in Web 2.0 features. Any features we incorporate can’t rely too heavily on user participation and should help to make the artwork more accessible. Design Idea: Bring in informal, outside voices and perspectives that can succeed with minimal user participation.
  36. 36. SFMOMA: Layer information for diverse users Insight: General site visitors are looking for very di erent information than scholars and academics. Design Idea: Add detailed information in tabs and layers.
  37. 37. Open Architecture Network
  38. 38. Open Architecture Network What we learned • System had to meet diverse needs of architects, funders, displaced families, project managers, and more • Designers have a hunger to see design, get inspired • Project teams also need to promote work to general public, show progress to funders • Project teams need place to share les, comment on work, and other tools for managing projects
  39. 39. OAN: Robust search tool
  40. 40. OAN: A forum to promote and discuss designs
  41. 41. OAN: Workspace for team collaboration
  42. 42. United Methodist Church Youth (before)
  43. 43. United Methodist Church Youth What we learned • Negative perceptions of church include “It’s boring” and “I don’t want to adopt pre-de ned beliefs” • Teens don’t want to be “preached” at – they can handle tough theological ideas • Reaching out to peers about religion can be risky • Teens are media savvy, distrustful of marketing, looking for authenticity
  44. 44. UMC Youth: A place where teens can connect
  45. 45. UMC Youth: Providing a way to share their voice
  46. 46. UMC Youth: Share in a “non-churchy” way
  47. 47. Once Upon a School
  48. 48. Once Upon a School What we learned • Achievement leaps when students gets 2-3 hours of undivided attention • Teachers and parents need help • There are so many people – journalists, graduate students, copywriters, software developers, retired professionals, and more – willing to give their time • At 826 Valencia blogs successfully facilitate storytelling
  49. 49. OUAS: A place to tell stories and get inspired
  50. 50. OUAS: Connecting teachers with the community
  51. 51. OUAS: Inspiration through storytelling
  52. 52. Relative costs of user participation • Costs include: • Initial price of technology • Design, installation and maintenance • Oversight, content creation and moderating • Upgrades • Allowing users to add their own • Letting users add institutional • Rating content to institution site (video, content to personal site; or to • Tagging • Creating a fully-functional images ...) social networking site Digg, del.ici.ous, Flickr • Commenting • Creating and maintaining a Wiki • RSS + other syndicated content • Moderating discussions • Designing for mobile • Creating and • Auto-generating alerts/emails to users • Creating podcasts and • Flash interactivity maintaining a virtual • Institutional blogging / Twittering webcasts • Dynamic page designs world (Second Life) • Creating an institutional Flickr, • Implementing Google (using DHTML, AJAX, Facebook or YouTube channel maps functionality Flash, Flex) Note: Many platforms have Web 2.0 features out of the box
  53. 53. Conclusions • Interactivity is not a one-size- ts-all • Research can help you be strategic about where you put design e ort • There are low-budget ways to do this Thank you! Katrina Alcorn, katrina.alcorn@hotstudio.com Renee Anderson, renee.anderson@hotstudio.com
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×