Presentation is loading. Please wait.

Presentation is loading. Please wait.

Collaborative Strategies for Designing Successful Web Sites Adaptive Path www.adaptivepath.com/workshops/tour2002/ Lane Becker Peter Merholz Jeffrey Veen.

Similar presentations


Presentation on theme: "Collaborative Strategies for Designing Successful Web Sites Adaptive Path www.adaptivepath.com/workshops/tour2002/ Lane Becker Peter Merholz Jeffrey Veen."— Presentation transcript:

1 Collaborative Strategies for Designing Successful Web Sites Adaptive Path www.adaptivepath.com/workshops/tour2002/ Lane Becker Peter Merholz Jeffrey Veen This work is licensed under a Creative Commons License.

2 Tour 2002Adaptive Path www.adaptivepath.com 2 viability feasibility desirability

3 Tour 2002Adaptive Path www.adaptivepath.com 3

4 Tour 2002Adaptive Path www.adaptivepath.com 4

5 Tour 2002Adaptive Path www.adaptivepath.com 5 Hi, I'm remodeling my kitchen and buying new appliances. While researching my decisions, I visited your site to see how your refrigerators compared to other manufactures. One of the most important factors in my decision is the amount of energy the product uses -- but I couldn't find this information listed on your site anywhere. Am I not looking in the right place? -jeff

6 Tour 2002Adaptive Path www.adaptivepath.com 6 Dear Jeff, Thank you for visiting the Maytag Home Page. We welcome the opportunity to assist you. Please forward your model number and we can send the energy rating for the model. Eric Maytag Customer Service

7 Tour 2002Adaptive Path www.adaptivepath.com 7 Eric, I think you may be misunderstanding my query. I'm interested in buying a new refrigerator. One of my key decision-making points is the energy rating of the product. I'd like to be able to see the rating of all of your models on their respective product description pages. -jeff

8 Tour 2002Adaptive Path www.adaptivepath.com 8 Dear Jeff, Unfortunately, the energy ratings are not listed on the web page. Sorry for the inconvenience. Jennifer Maytag Customer Service

9 Tour 2002Adaptive Path www.adaptivepath.com 9 Jennifer, Right. I realize that. That's why I mentioned it. It's a pretty crucial decision-making point for a lot of people (including me). You should consider having your Web team add it to the standard product page. -jeff

10 Tour 2002Adaptive Path www.adaptivepath.com 10 Dear Jeff, Thank you for your comments regarding the Maytag.com Home Page. In the future, please include the model number of your Maytag appliance so that we may assist you more efficiently. Scott Maytag Customer Service

11 Tour 2002Adaptive Path www.adaptivepath.com 11 Defining Experience Design Functional Design The design of systems that support end-users' tasks and goals –User research –Information Architecture –Interaction Design Communication Design The design of how these systems are expressed to the user –Interface design –Visual design –Content strategy

12 Tour 2002Adaptive Path www.adaptivepath.com 12 Good design means following rules! My rules!

13 Tour 2002Adaptive Path www.adaptivepath.com 13 Top Ten “Guidelines” for Homepage Usability 1.Include a One-Sentence Tagline 2.Write a Window Title with Good Visibility in Search Engines and Bookmark Lists 3.Group all Corporate Information in One Distinct Area 4.Emphasize the Site's Top High- Priority Tasks 5.Include a Search Input Box 6.Show Examples of Real Site Content 7.Begin Link Names with the Most Important Keyword 8.Offer Easy Access to Recent Homepage Features 9.Don't Over-Format Critical Content, Such as Navigation Areas 10.Use Meaningful Graphics Following are ten things you can do to “increase the usability” of your homepage and thus “enhance” your website's “business value.” Jakob Nielson Alertbox, May 12, 2002 http://www.useit.com/alertbox/20020512.html

14 Tour 2002Adaptive Path www.adaptivepath.com 14

15 Tour 2002Adaptive Path www.adaptivepath.com 15 A Different Perspective There is no “One True Way” or “Four-Step Process” The Web may have best practices for user experience design, but it is too early to depend on them exclusively The separation between functional design and communication design is messy at best

16 Tour 2002Adaptive Path www.adaptivepath.com 16 But won’t the rules limit my creativity...?

17 Tour 2002Adaptive Path www.adaptivepath.com 17 ‘Obeying rules without an understanding of the reasons behind them creates an approximation of competence which leaves one vulnerable to the exceptions.’ Sea Kayaker's Deep Trouble

18 Tour 2002Adaptive Path www.adaptivepath.com 18 About the Project iRemodel.com – leading home improvement portal Features: –Tutorial Content for users new to home improvement –Idea File –Product database with comparison engiine –Contractor/architect locator –Budget estimator New features: –Kitchen design “center” –Contractor’s management application

19 Tour 2002Adaptive Path www.adaptivepath.com 19 To develop an experience based on the patterns inherent in your stuff that empowers users to accomplish their goals. Our goal...

20 Tour 2002Adaptive Path www.adaptivepath.com 20 It’s how we get a pile of stuff...

21 Tour 2002Adaptive Path www.adaptivepath.com 21...into a structured experience.

22 Tour 2002Adaptive Path www.adaptivepath.com 22 This includes labeling... SquaresTriangles Circles SquaresCircles Triangles

23 Tour 2002Adaptive Path www.adaptivepath.com 23...and navigation systems...

24 Tour 2002Adaptive Path www.adaptivepath.com 24...that are intuitive to users. SquaresTriangles Circles Ah Ha!

25 Tour 2002Adaptive Path www.adaptivepath.com 25 But! Not all users have the same goals. Shapes!Colors!

26 Tour 2002Adaptive Path www.adaptivepath.com 26 So, good design lets many users...

27 Tour 2002Adaptive Path www.adaptivepath.com 27...access lots of content...

28 Tour 2002Adaptive Path www.adaptivepath.com 28...in many ways.

29 Tour 2002Adaptive Path www.adaptivepath.com 29 But this isn’t always as easy as it sounds...

30 Tour 2002Adaptive Path www.adaptivepath.com 30 What do you call this?

31 Tour 2002Adaptive Path www.adaptivepath.com 31 “Coke” “Pop” “Soda” Is it Coke? Pop? Soda? http://www.ugcs.caltech.edu/~almccon/pop_soda/

32 Tour 2002Adaptive Path www.adaptivepath.com 32 But wait! There’s more... fizz fris phosphate bubble-water lolly-water Tingle Fizz Fuzz mixer sweet drink tonic sodie cocola soder dopes

33 Tour 2002Adaptive Path www.adaptivepath.com 33 Design faces global issues... Colors? Colours? ¿De Colores? ? ? ? ? ? ? ? ? ?

34 Tour 2002Adaptive Path www.adaptivepath.com 34

35 Tour 2002Adaptive Path www.adaptivepath.com 35

36 Tour 2002Adaptive Path www.adaptivepath.com 36

37 Tour 2002Adaptive Path www.adaptivepath.com 37 Design faces accessibility issues... Colors ???

38 Tour 2002Adaptive Path www.adaptivepath.com 38

39 Tour 2002Adaptive Path www.adaptivepath.com 39

40 Tour 2002Adaptive Path www.adaptivepath.com 40 Design suffers from jargon... ? ? ? ? ? ? ? ? ? Shapes WebBeans tm

41 Tour 2002Adaptive Path www.adaptivepath.com 41

42 Tour 2002Adaptive Path www.adaptivepath.com 42

43 Tour 2002Adaptive Path www.adaptivepath.com 43 Design suffers from politics... CEO User Excellent!???

44 Tour 2002Adaptive Path www.adaptivepath.com 44 Customers used to interact directly with departments... Big Corp ABCDE

45 Tour 2002Adaptive Path www.adaptivepath.com 45 But that doesn’t translate to the Web at all... ???? ? Big Corp ABCDE

46 Tour 2002Adaptive Path www.adaptivepath.com 46

47 Tour 2002Adaptive Path www.adaptivepath.com 47 Design must also be extensible... !?!

48 Tour 2002Adaptive Path www.adaptivepath.com 48

49 Tour 2002Adaptive Path www.adaptivepath.com 49

50 Tour 2002Adaptive Path www.adaptivepath.com 50

51 Tour 2002Adaptive Path www.adaptivepath.com 51 We don’t even know what else they are doing… !!!

52 Tour 2002Adaptive Path www.adaptivepath.com 52 The Two Parts of IA, Diagrammed Surface architecture comes from Mental Model Deep architecture comes from the Content Model

53 Tour 2002Adaptive Path www.adaptivepath.com 53 Gather Assumptions & Requirements Develop Personas Understand Goals & Tasks Design Information Architecture Prioritize Features Validate Usability Prototypes & Patterns Build Content Model Analyze Competition Design Interaction

54 Tour 2002Adaptive Path www.adaptivepath.com 54 So who are these people, your “users”?

55 Tour 2002Adaptive Path www.adaptivepath.com 55 Remember: You Are Not Your Audience You do not –see things like they do –know what they know –want what they want –work how they work This is critical information when designing a product So how do you figure out all of these things?…

56 Tour 2002Adaptive Path www.adaptivepath.com 56 …User Research! The study of what makes peoples’ lives difficult and how to make them easier –Needs What people need to make their life easier –Desires What they want (does not equate to what they need) –Abilities What they can understand and do –Methods How they do things now

57 Tour 2002Adaptive Path www.adaptivepath.com 57 Conceptual Research (“need”) Timing: Early in the design process Purpose: Investigates needs and methods Techniques: –Task Analysis/Contextual Inquiry –Surveys –Ethnography Outcome: Encourages innovative thought at the very outset of design

58 Tour 2002Adaptive Path www.adaptivepath.com 58 Preference Research (“like”) Timing: Mid-process Purpose: Investigates desires, expectations, priorities Techniques: –Surveys –Focus Groups –Interviews –Card sorting Outcome: Ensures that design solutions appeals to the desired audience

59 Tour 2002Adaptive Path www.adaptivepath.com 59 Ability Research (“do”) Timing: End of the process (and the beginning of the next iteration). Purpose: Investigates abilities and reactions Pre-Launch Techniques: –Prototypes (paper and mockup) –Usability Testing Post-Launch Techniques: –Log analysis –Customer feedback analysis Outcome: Ensures that design solutions are usable for the desired audience

60 Tour 2002Adaptive Path www.adaptivepath.com 60 User Research in the Design Process – Practical Linear process One big step for each type of user research (conceptual, preference, ability) Handed off at the end, as opposed to beginning the cycle again Ideally, the process is collaborative and iterative...

61 Tour 2002Adaptive Path www.adaptivepath.com 61 About These Methodologies Scalability: Many of these techniques can be used tomorrow, or as a 6-month project. Live it: User research, information architecture and good design are not something to consider doing every so often. Balance: Too much reliance on methodologies and technique can be as bad as not using them at all. Remember: Be open minded!

62 Tour 2002Adaptive Path www.adaptivepath.com 62 Gather Assumptions & Requirements Develop Personas Understand Goals & Tasks Design Information Architecture Prioritize Features Validate Usability Prototypes & Patterns Build Content Model Analyze Competition Design Interaction

63 Tour 2002Adaptive Path www.adaptivepath.com 63 What is Discovery? Useful and often overlooked Tool for understanding business needs and context (rather than user needs and context) An early opportunity to head off problems before they happen Answer important questions about the project: –Why do it? (Business/Marketing purpose) –What does it do? (Scope/Definition) –Who cares about it? (Stakeholders/Decision Makers)

64 Tour 2002Adaptive Path www.adaptivepath.com 64 Why Do Discovery? No matter how good your solution is, if it doesn’t fit within the existing expectations and processes of your organization, it will fail Remember: A sick body will reject a healthy organ if the body isn’t prepared properly first

65 Tour 2002Adaptive Path www.adaptivepath.com 65 10 Roadblocks Discovery Can Help You Avoid 1.Project gets bogged down in approvals 2.Your assumptions about the goals of the project are way off base 3.You discover half-way through that the scope is much greater than you imagined 4.Feature creep 5.Disenfranchised people become obstacles 6.Nobody listens to you…even though you’re supposedly “in charge” 7.Nobody understands what you’re saying (maybe because you don’t have the same understanding of the project) 8.Someone important and powerful (e.g., the CEO) hates the final solution a week before launch 9.Your final solution, though cool, doesn’t solve the original problem 10.Your proposed solution can’t be implemented

66 Tour 2002Adaptive Path www.adaptivepath.com 66 Purpose of Discovery (Soft) Understand the context in which you are working –Political landscape –Stakeholders –Decision structures (who/how/when) –Business mandates –Technologies Build relationships –Introduce yourself –Explain what you do –Get to know everyone involved (listen) –Communicate your goals internally as well as externally

67 Tour 2002Adaptive Path www.adaptivepath.com 67 Purpose of Discovery (Concrete) Define project criteria –Stakeholders –Definitions –Scope –Business mandate Formulate strategies –Resources –Methods –Process –Schedule –Budget

68 Tour 2002Adaptive Path www.adaptivepath.com 68 How this Affects You Answers these questions: –What is your relationship with your organization? –How effectively do you communicate your value to the key stakeholders on your project? Develops these skills: –Learn the company language (jargon not buzzwords) –Understand the decision-making environment you're working in

69 Tour 2002Adaptive Path www.adaptivepath.com 69 Potential Roadblocks to Doing Discovery Schedule pressure Stakeholders don’t see the value Lack of access to key players (distance, vacation, schedule conflicts, etc.)

70 Tour 2002Adaptive Path www.adaptivepath.com 70 Methods for facilitating meetings Always prepare, even (especially) when brainstorming Use only open questions: Make meetings into active working sessions Open: - Who? - What? - Where? - When? - Why? - How? Closed: - Is? - Can? - Will? - Do? - Should? - Have?

71 Tour 2002Adaptive Path www.adaptivepath.com 71 Method: Kickoff Meeting Who: Everybody you can get together in the conference room Purpose: –Introduce yourself, team, and the stakeholders –Explain the project –Let stakeholders know how they will be involved –Establish working relationships; get the team “on board” Form: Presentation and discussion Timing: Beginning of discovery Content: Goals, team, process, schedule, and deliverables Leave-behinds: Project plan (draft only), presentation slides

72 Tour 2002Adaptive Path www.adaptivepath.com 72 Method: Project Sponsor Interviews Who: Who’s signing the check? –The most senior person or people who approved the project, and their peers Purpose: –Understand political context –Define decision process –Understand business imperative and goals –Learn what other departments should be included and how Form: One-on-one conversations Timing: After kickoff Leave-behinds: Project plan (draft only)

73 Tour 2002Adaptive Path www.adaptivepath.com 73 Method: Stakeholder Group Sessions Who: Key stakeholders Purpose: –Discover expectations for the project –Discuss pain points, features –Make people feel involved –Establish cross-departmental communication among stakeholders Form: Similar to focus groups –Open, brainstorming –Smaller, intimate Timing: Soon after kickoff Leave-behinds: Notes, email

74 Tour 2002Adaptive Path www.adaptivepath.com 74 Method: Stakeholder One-on-Ones Who: Anyone you can corner for at least 15 minutes Purpose: –Learn details about the project –Learn the “truth” about the organization –Let people know that they can talk to you (i.e., listen!) –Venting –Talk through definitions, goals, methods, processes –Solidify requirements and discover potential roadblocks –Identify existing documentation Form: Informal conversations Timing: After kickoff Leave-behinds: Notes, email

75 Tour 2002Adaptive Path www.adaptivepath.com 75 Method: Review of Existing Documentation Gather and review previous materials – any documentation that seems relevant. It might be: –Server logs –Previous product specs –Usability or other research –Explanation of key technologies Even if there’s nothing to review, showing interest will go a long way toward establishing relationships

76 Tour 2002Adaptive Path www.adaptivepath.com 76 Exercise: Sketch Assumptions Without sharing, sketch the product as quickly as you can: –Front page showing features –Scribble out the top page of the kitchen design application –You only have 10 minutes. Don’t design! Just draw!

77 Tour 2002Adaptive Path www.adaptivepath.com 77 Discovery Deliverables Vary Summarize your findings for distribution to the stakeholders and/or project sponsor –Lets people review what they’ve said and correct as necessary –Review of docs will show that you’re leveraging prior investments –Contents include business goals, any mandatory features, assumptions, definitions Formal documentation: MRD, PRD, Project Brief, etc.

78 Tour 2002Adaptive Path www.adaptivepath.com 78 Gather Assumptions & Requirements Develop Personas Understand Goals & Tasks Design Information Architecture Prioritize Features Validate Usability Prototypes & Patterns Build Content Model Analyze Competition Design Interaction

79 Tour 2002Adaptive Path www.adaptivepath.com 79 Competitive Analysis A thorough deconstruction of your competitors’ Web sites Similar to market and customer research, but with an emphasis on functional implementations Not simply limited to direct competitors

80 Tour 2002Adaptive Path www.adaptivepath.com 80 Identifying Competitors Start with known rivals –See: marketing plan, business plan, etc. Use online tools to broaden scope –“What’s related,” Alexa, browse online directories Look for other sites with similar features, even if they’re in a completely different industry –Try to identify conventions –Search, navigation, interface widgets, etc. Use analyst reports to identify industry trends –Forrester, Jupiter, et al.

81 Tour 2002Adaptive Path www.adaptivepath.com 81 The Competitive Matrix List features against competitors in a spreadsheet (build off of your findings from the current state analysis) Use online tools to help fill in the technical details –www.websitegarage.com –www.siteowner.com

82 Tour 2002Adaptive Path www.adaptivepath.com 82 The Competitive Matrix Build spreadsheet with feature-set against competitors’ sites Fill in short descriptions of similarities and differences Point out radically different solutions Use principles of Heuristic Evaluation

83 Tour 2002Adaptive Path www.adaptivepath.com 83 The Competitive Matrix Feature set and content types Interface characteristics –Navigation vocabulary –Renderings (Tabs, Pull-down menus, etc.) Technology choices –Browser targeting –Advanced CSS or Javascript usage Performance Statistics –Bandwidth usage and rendering speed for page types Meta Tag Contents

84 Tour 2002Adaptive Path www.adaptivepath.com 84 Gather Assumptions & Requirements Develop Personas Understand Goals & Tasks Design Information Architecture Prioritize Features Validate Usability Prototypes & Patterns Build Content Model Analyze Competition Design Interaction

85 Tour 2002Adaptive Path www.adaptivepath.com 85 What Is a Persona? A fictitious person for whom you are designing Represents the archetypal qualities of your audience Plural: “personas” not “personae” – It’s... well... less pretentious

86 Tour 2002Adaptive Path www.adaptivepath.com 86 Why Personas? Provides focus for the design –Talk about “Lori” not “the user” Humanizes the design –Name them –Have photos of them (corbis.com, images.google.com) Remarkably effective for bringing user-centered design into an organization –Turn personas into big posters, place throughout organization

87 Tour 2002Adaptive Path www.adaptivepath.com 87 Developing Personas Start with market research and segmentation Demographic –Age, Gender, Occupation Psychographic –Goals, tasks, motivation “Webographic” –Net usage and experience, gear, usage habits, favorite sites

88 Tour 2002Adaptive Path www.adaptivepath.com 88 Personas Are Not: Demographic ranges –“18-34 year old college educated females making $50K” Job Descriptions –“IT managers in Fortune 1000 with purchasing power for routers” Your CEO –“Mr. Burns wants to be able to use his WebTV on the site”

89 Tour 2002Adaptive Path www.adaptivepath.com 89 Personas Are: Stereotypes –This isn’t an exercise in politically correct thinking –Edge cases can lead you off track, e.g. male nurses, private pilots Design targets, not sales targets Tools for thinking about features and functions, not character studies

90 Tour 2002Adaptive Path www.adaptivepath.com 90 Persona Chart StevenJoy and Eric Age 36 Occupation Design/Build Remodeler, CGR. Net usage 30-60 min day, cable modem, my.yahoo.com, cnn.com, theonion.com Gear Dell Pentium III, 750Mhz, 17” Palm Vx Trigger for action Responding to client call… Not so much “triggered” as it is Steven’s job. Ultimate Goal To make the client very happy with a kitchen remodel while pocketing a sizable profit. Familiarity/Anxiety Steven is comfortable using the computer and the Web for job-related needs.

91 Tour 2002Adaptive Path www.adaptivepath.com 91 Scenarios Stories of personas engaged in tasks or achieving goals Narrative structure enforces “making sense” The flow of writing feels more “real” than the discrete collections of tasks and attributes

92 Tour 2002Adaptive Path www.adaptivepath.com 92 Writing Scenarios Keep the task focused – 4 to 5 paragraphs Incorporate the persona’s environment Make them messy Try not to design while writing Write three or four scenarios per persona

93 Tour 2002Adaptive Path www.adaptivepath.com 93 Benefits of Scenarios Allows for a holistic description of the user’s experience –Context, context, context –From inside the user’s head to the environment surrounding them Excellent communication tool – all humans understand stories –Works well across multi-disciplinary teams Fleshes out persona’s “existence”

94 Tour 2002Adaptive Path www.adaptivepath.com 94 Potential Pitfalls The Scenario Where Everything Works Like Magic Digressing too much Too much response from a designed system

95 Tour 2002Adaptive Path www.adaptivepath.com 95 Gather Assumptions & Requirements Develop Personas Understand Goals & Tasks Design Information Architecture Prioritize Features Validate Usability Prototypes & Patterns Build Content Model Analyze Competition Design Interaction

96 Tour 2002Adaptive Path www.adaptivepath.com 96 How Do You Create a Design that Users Can Understand? 1.Figure out what users need: develop a mental model 2.Figure out what you have: develop a content model 3.Match them up 4.Use it to create your site design Make a high-level structure based on mental model Make the detailed structure based on the content model

97 Tour 2002Adaptive Path www.adaptivepath.com 97 What is a Mental Model? How an audience thinks about and approaches its tasks and goals (…separate from a Web experience)

98 Tour 2002Adaptive Path www.adaptivepath.com 98

99 Tour 2002Adaptive Path www.adaptivepath.com 99 What is a Mental Model? Grocery Shopping Prepare shopping list Look in fridge Talk to spouse Walk the store aisles Does the car need gas? How much time do I have? Plan meals Look for discounts Clip coupons

100 Tour 2002Adaptive Path www.adaptivepath.com 100 What Does a Mental Model Look Like? Our Mental Model Diagram looks like this, with tasks arranged into ever-broader groupings:

101 Tour 2002Adaptive Path www.adaptivepath.com 101 Ultimate Goal A design that corresponds to your users’ mental models… Prepare shopping list Look in fridge Talk to spouse Does the car need gas? How much time do I have? Plan meals Look for discounts Clip coupons

102 Tour 2002Adaptive Path www.adaptivepath.com 102 Ultimate Goal, Pt 2 A design that corresponds to your users’ mental models… …that also meets your business’ needs Prepare shopping list Look in fridge Talk to spouse Does the car need gas? How much time do I have? Plan meals Look for discounts Clip coupons $

103 Tour 2002Adaptive Path www.adaptivepath.com 103 Yak yak yak yak yak yak yak yak yak yak yak yak yak yak yak yak yak yak yak yak yak yak yak... Yak yak yak yak yak yak yak yak yak yak yak yak kak yak yak yak yak yak yak yak yak yak yak...

104 Tour 2002Adaptive Path www.adaptivepath.com 104

105 Tour 2002Adaptive Path www.adaptivepath.com 105 Ah Ha!

106 Tour 2002Adaptive Path www.adaptivepath.com 106 Why Perform Task Analysis? Helps you figure out what features are important to your users, and what they would call those features Ensures that the design meets those user requirements as well as the business requirements Provides a way to trace back all aspects of the interface to the user’s task flow Goal: To remove the phrase “I think” from discussions about what your users need So that you can create a Mental Model Diagram, which is really cool

107 Tour 2002Adaptive Path www.adaptivepath.com 107 1. Find Some Users Start immediately: the better the subjects, the better the outcome Getting started tomorrow: friends, family, coworkers –Pros: cheap, easy –Cons: bias (they may know too much), not close enough to the real target audience Some do-it-yourself options: –Existing user base, customer support inquiries, advertise on existing site –User groups, email discussion lists –Traditional market research means: classified ads, etc.

108 Tour 2002Adaptive Path www.adaptivepath.com 108 Finding Users: Let the Pros Do It Better yet, get the budget to use a recruiting agency –Pros: can get people who know nothing about the product, can get people who are exactly your audience, can recruit people in a variety of geographic locales –Cons: money In San Francisco: Jonathan Gauntlett at G Focus Groups jonathan@gfocusgroups.com (415) 928-2795

109 Tour 2002Adaptive Path www.adaptivepath.com 109 Writing a Screener A simple script to weed out subjects Write 20 questions that narrow in on who you’re after Order questions from generic to specific Be very clear and specific Avoid jargon

110 Tour 2002Adaptive Path www.adaptivepath.com 110 2. Conduct Interviews Use “ethnographic inquiry” techniques –Encourage open answers, rather than to lead the interviewee in any preconceived direction –Use predefined questions as prompts in a conversation, not a verbatim script –Allow the interviewee to direct the flow of conversation Interview about 5 people per audience type Prepare verbatim transcripts, if possible. Yak yak yak yak yak yak yak yak yak yak yak yak kak yak yak yak yak yak yak yak yak yak yak...

111 Tour 2002Adaptive Path www.adaptivepath.com 111 Ask good questions Focus on experience, not extrapolation Concentrate on immediate experience Be nonjudgmental Make questions open-ended Avoid binary questions Open: - Who? - What? - Where? - When? - Why? - How? Closed: - Is? - Can? - Will? - Do? - Should? - Have?

112 Tour 2002Adaptive Path www.adaptivepath.com 112 3. Analyze the Transcripts Scan interview transcripts for ‘tasks’ Copy each task to the atomic task table Notice patterns across users. Group similar atomic tasks together under one task name Adjust these groups as the patterns grow and shift Estimate 4 hours per interview

113 Tour 2002Adaptive Path www.adaptivepath.com 113 4. Organize Tasks into Groups Arrange the tasks into conceptual groups based on: –Steps the users described –Similarity of tasks Do this for each audience, if there are multiple audiences Compare results between audiences and combine if appropriate Alphabetize groups for easy reference

114 Tour 2002Adaptive Path www.adaptivepath.com 114 A Collaborative Approach to Organizing Tasks Your team, an afternoon, a large blank wall, millions of Post-Its Read notes and make stickies –One person plucks tasks from the transcript, the other writes them down on stickies –One task per sticky, different colored stickies depending on the number of times different people mentioned the same task Make stickies and move them around until they make sense –Cluster similar stickies on the wall and give them a name –Cluster similar clusters together, and give them a name, too Voila! Tasks, Task Groups, and Mental Spaces

115 Tour 2002Adaptive Path www.adaptivepath.com 115 Walls of Stickies Thanks: Marc Rettig

116 Tour 2002Adaptive Path www.adaptivepath.com 116 5. Build the Mental Model Arrange the mental spaces into a meaningful order, if possible Name your mental spaces with verbs, not nouns Make it a team effort – one person makes a first draft, but team members and clients should participate in refining it

117 Tour 2002Adaptive Path www.adaptivepath.com 117 Consists of: Tasks The individual tasks that people perform when attempting to achieve a larger goal What a Mental Model Looks Like

118 Tour 2002Adaptive Path www.adaptivepath.com 118 Consists of: Task Groups Tasks for the same goal grouped together What a Mental Model Looks Like

119 Tour 2002Adaptive Path www.adaptivepath.com 119 Consists of: Mental Spaces The set of goals which together form a complete activity What a Mental Model Looks Like

120 Tour 2002Adaptive Path www.adaptivepath.com 120 How a Mental Model is Used Existing site content from audit is “slotted” underneath to show where current site meets (or doesn’t) users’ needs. Proposal Template Proposal Submission Form Online Discussion Boards Content Slotting

121 Tour 2002Adaptive Path www.adaptivepath.com 121 End result: Horizon Chart Detailed map of your user’s everyday goals, and the individual tasks they undertake to achieve them Shows where the existing site succeeds in meeting these goals; where it overshoots; where opportunities for future development lie Excels as a reference document, a starting point for discussions about user requirements

122 Tour 2002Adaptive Path www.adaptivepath.com 122 Exercise: Building a Mental Model With your group, look for trends in remodeling tasks Organize tasks into conceptual groups Use stickies to label each group

123 Tour 2002Adaptive Path www.adaptivepath.com 123 Diagram Mental Model: Building Tips Arrange the mental spaces into a meaningful order, if possible Name your mental spaces with verbs, not nouns Make it a team effort – one person makes a first draft, but team members and clients should participate in refining it

124 Tour 2002Adaptive Path www.adaptivepath.com 124 Gather Assumptions & Requirements Develop Personas Understand Goals & Tasks Design Information Architecture Prioritize Features Validate Usability Prototypes & Patterns Build Content Model Analyze Competition Design Interaction

125 Tour 2002Adaptive Path www.adaptivepath.com 125 Thank You! www.adaptivepath.com/workshops/tour2002/ lane@adaptivepath.com peter@adaptivepath.com jeff@adaptivepath.com


Download ppt "Collaborative Strategies for Designing Successful Web Sites Adaptive Path www.adaptivepath.com/workshops/tour2002/ Lane Becker Peter Merholz Jeffrey Veen."

Similar presentations


Ads by Google