Recommended
More Related Content
What's hot
What's hot (20)
Viewers also liked
Viewers also liked (19)
Similar to Bite size ux
Similar to Bite size ux (20)
More from 501 Commons
More from 501 Commons (17)
Recently uploaded
Recently uploaded (20)
Bite size ux
- 1. P R E S E N T E D B Y L O R E L E I K E L L Y Bite-Size UX For Nonprofits
- 2. Thanks to our Sponsors! o HandsOn Tech o Thank you Points of Light Foundation, Google and CNCS!
- 3. Agenda Introductions About User Experience Benefits for Nonprofits Techniques Analytics Surveys IA Testing Management © 501 Commons
- 4. About me © 501 Commons Human-Computer Interaction/design Full-service digital agency lorelei@ielerol.com
- 5. User Experience Design © 501 Commons User Research Usability Evaluation Interaction Design Content Strategy Information Architecture Visual Design
- 6. User Research © 501 Commons Observational methods to understand the people who use a product or system Surveys Ethnographic observation Diary studies Experience sampling Focus groups Interviews Contextual inquiry
- 7. Information Architecture © 501 Commons Identifying & organizing information in a meaningful way
- 8. Interaction Design © 501 Commons Specifying the behaviors of a product or system in a purposeful, understandable way
- 9. Content Strategy © 501 Commons Planning for creation, delivery, and maintenance of useful, usable content Analysis Creation StructureGovernance
- 10. Usability Evaluation © 501 Commons Measuring the quality of a user’s interaction with a product or system.
- 11. Visual Design © 501 Commons Designing the visual qualities of a product or system in a pleasing and meaningful way.
- 12. The UX Design Process © 501 Commons Define Goals Research Users Design Solutions Test Designs Implement Designs
- 13. Why Nonprofits Need Good UX © 501 Commons
- 14. Establish Trust © 501 Commons Good design = credibility Trust in quality of info, services Important when $ are involved
- 15. Reach the Right Audience © 501 Commons Nonprofit sites are targeted Potential donors Potential clients Match message with audience
- 16. Improve Service © 501 Commons More people find the information Site visitors retain more Encourage action
- 17. Interaction Design What to Do About It © 501 Commons User Research Usability Evaluation Content Strategy Information Architecture Visual Design
- 18. Research & Evaluation © 501 Commons Improvement needs feedback iteration feedback Assumptions = risk Talk to real users
- 19. The Most Important Step © 501 Commons Ask the right question
- 20. A Good Research Question is © 501 Commons Well-defined Limited in scope Actionable
- 21. Weak Research Questions © 501 Commons “What do people dislike about our website?” “What are the least popular pages on our website?”
- 22. Good Research Questions © 501 Commons “What information do potential donors come looking for but don’t find?” “How are the people who sign up for our newsletter finding our site?” “What do our return visitors come back for?”
- 23. Analytics © 501 Commons Visit data Google Analytics KISSMetrics Click Tracking Crazy Egg Lucky Orange
- 24. Surveys © 501 Commons Stay under ~10 questions, 1-2 difficult/sensitive Put easy questions first Ask one thing at a time Be careful with multiple-choice answers Baseline effects Anchoring “other” option Offer free response
- 25. Survey Question Examples © 501 Commons
- 26. Survey Question Examples © 501 Commons
- 27. Survey Tools © 501 Commons SurveyMonkey Google Drive Instant.ly Usabilla
- 28. Card Sorting © 501 Commons Users categorize and label menu items
- 29. Online Card Sort Tools © 501 Commons Optimal Workshop OptimalSort UsabiliTest
- 30. Content Inventory © 501 Commons Spreadsheet tracking all content on site Unique ID URL Content Title Page Owner Date Updated
- 31. Content Inventory Tools © 501 Commons Slickplan XML Sitemaps Content Inventory Spreadsheet templates
- 32. A/B Testing © 501 Commons Incremental Improvement Hypothesis + Outcome Test one thing at a time
- 33. A/B Testing Tools © 501 Commons Google Analytics Content Experiments Optimizely Usabilla
- 34. Guerilla Usability Testing © 501 Commons Think-aloud protocol Moderator + Observer Laptop in a coffeeshop Give short, open-ended tasks
- 35. Managing The Data © 501 Commons Share findings within the org Allow anyone to contribute One place for everyone find answers to questions
- 36. Q U E S T I O N S ? Thank You
- 37. Tool URLs © 501 Commons http://www.google.com/analytics/ https://www.kissmetrics.com/ http://www.crazyegg.com/ http://luckyorange.com/ http://drive.google.com http://www.instant.ly/ https://usabilla.com/ http://www.optimalworkshop.com/optimalsort.htm http://www.usabilitest.com/ http://slickplan.com/ http://www.xml-sitemaps.com/ https://www.optimizely.com/ http://evernote.com/ https://www.dokuwiki.org/dokuwiki
Editor's Notes
- Experience planning the SERVE-IT Nonprofit tech clinic at Indiana UniversityWorked with nonprofits in the Seattle area, both through job and independentlySmall businesses not primarily web-based also have a lot of constraints on what they can do for their sites, overall the techniques are very similarQ’s for audience - How many are familiar with the term UX, how many feel like they know what UX isHow many people do web design for their org? How many are currently finding ways to get feedback from users?
- What is User Experience Design? Depends on who you askA user experience: all aspects of a person’s interactions with a product or system (mostly limited to digital, connected and/or screen-based experiences)In this talk: A set of disciplines and activities intended to produce a coherent, desirable experience. Many of the constituent disciplines overlap, most UX designers regularly work in multiple disciplinesSomeone calling themselves a UX designer very likely does some combination of these activities
- Most important principle of user research is – pay attention to what people actually do, not what they say they doIf you have rely on what users say, dig deeper to find out what underlying needs are driving them (“I want a faster horse” vs. “I want a way to go faster”)
- - Information architecture, like physical architecture, aims to create meaningful spaces, relationships and paths through your data- Ideally, this is where you begin to apply what you know about users – use the same language and terms they’re familiar with, organize your information according to patterns the users have demonstrated they understand. - Prioritize based on the user’s goals and needs
- - Ideally, this is where you begin to apply what you know about users – use the same language and terms they’re familiar with, organize your information according to patterns the users have demonstrated they understand. - Prioritize based on the user’s goals and needs
- - Content strategy is about creating a plan for what content you need, how to present it, and how to manage it so that the most useful and relevant information is always available- Often very important for nonprofit websites – lots of information, not necessarily lots of complex interactivity
- At its simplest, is observing people using your designsA few standard techniques for doing soTraditionally has been a very formalized, lab-based process conducted by large corporationsIn last 10-15 years, much bigger shift to quick, low-cost options for a lot of companies
- Visual design is not just making things pretty! The overall visual qualities of a website should work together with the interaction design, information architecture and content to create a unified impression, and to guide users to the correct actions. The best layout in the world doesn’t help very much if a font is unreadable or the colors are so ugly no one stays on the page.
- - Define target markets or audience, and goals: both business/org goals, and user needs to be met- Research to learn about chosen users- Design activities: information architecture, interaction design, content strategy, all interrelated- Interaction design feeds into visual design- Usability testing (can begin at almost any point in the process)- Product launch- Never linear – some things happen in parallel, sometimes you learn something in one stage that means you need to go back and make changes, or do new research, etc.- Different projects need different levels of effort in each phase and activity
- - Assumption that most of what you need UX for is website or collection of websites, newsletters, social media presence – mostly communication, not creating products or designing a service- A unified, successful user experience means that users are getting what they want from your site, but you’re also getting what you want from your site visitors
- People form overall impressions of the credibility of your organization, your services, the information on your site, based on a lot of factors. Does your design look trustworthy? Errors and inconsistencies make people not want to trust your site. Confusing organization, insufficiently-professional looking designs, inappropriate tone in the content, all impact site visitors’ judgments. Ensuring you have a high-quality and consistent design helps build trust in your site visitors, They’re more likely to trust the information you provide, believe in the quality of your services, the value of your mission, AND spend money.
- - When you’re hoping to reach a specific target audience, the best and most reliable way to find out if you’re successful, is to hear from them! There’s a lot that is standard about reaching a general web audience, to appeal to the largest number of people in the simplest wayIf you’re going to be more specific in reaching groups that don’t match up with more general web audiences, it’s important to learn specifically about how those groups react to your site or services
- My focus is on research and evaluation, because those are easiest to skip, but also among the most important to get right in order for the other activities to be successful
- Designs only improve when you can learn about what’s working and what’s not. True of any type of improvement – you need outside feedback to get better.- Try new things, learn what works, try againA talented designer with just their own experience and instincts can get you to a good baseline. But to get better, you have to listen to your users.In psychology, we learn that people are very bad at certain types of predictions and thinking. In general, if you ask someone to predict what they would do in a situation involving a different psychological state than their current on, they will be wrong. For example, if you describe a scenario to a happy person and ask how they’d react to that scenario if they were sad, they will probably get it wrong. This is true of nearly everyone – a few people might be better at it, but it’s a few, and better doesn’t mean GOOD.
- The most important step in any research project is to ask the right question. Always. Getting the right answer to the wrong question will not help. Defining out what your research question is should help guide you to the best way to answer it.
- “What do people love most about their homes?” Who will you ask? How will you tell how much they love something? What is a “home”? Great for a 6-month exploratory ethnographic research project, not so great for 3-day window to improve a website“what do people dislike about our website” is vague, ambiguous. Which people – all visitors? What does it mean to “dislike” something? How will you find out?
- “what do people dislike about our website” is vague, ambiguous. Who are you going to start asking? What, exactly, are you going ask them – what do you dislike? You’re going to get all kinds of different answers – some people might not like not the color, the layout, that it didn’t address their oddball niche concern, or even they don’t like your entire org and mission. “What are our least popular pages?” is a clear question, easy to find the answer to, without an obvious action. There are lots of possible reasons why no one is visiting a page, and just looking at hit counts can’t tell you which ones apply. It’s well-defined and limited, but not actionable.
- You know the population to target – people with a possible intention to donateYou know what to ask: did you find what you were looking for? If not, what can we help you with?You know what to do about it: Most obviously, you can provide that information. Potentially, if the information people want is not actually part of your service provision, you may need to make bigger overall changes, so people know in the first place what they will and will not learn from your website.There are times for more open-ended research questions: for usability studies, the question is always, “what problems are happening on this page or site?” But you should focus on a specific page or task (will get to this more in usability section)
- - If you’re not using google analytics yet, get started right now! If you are, learn to start using it as deeply as you can (I am not a GA expert, I can’t tell you how to use the tool itself, what I can tell you is what analytics data is or isn’t good for)If you outgrow GA, and need more customizable and detailed reports (and the budget for paid tool), KISSMetrics is popular, well-regardedTools like Crazy Egg and Lucky Orange are heatmap tools, tell you where people are clicking on a page – good complement to GA, which only tells you the result of a click. Good for answering questions like “what is our most popular content?” “What is catching visitors’ attention on the home page?” “Are people reading the page long enough to find our very important link?”
- Long surveys will annoy your users, people will abandon your survey or stop filling answers thoughtfullyStart easy, get people movingLimit # of difficult or sensitive questions, leave for very endMake each question very simple and focused. If a question is getting long or complex, split it into twoMultiple-choice questions are easier for the visitors to answer, but can be more difficult to write. If you ask people for a number, the numbers you choose as the response possibilities will influence how they judge their answer. (“not a lot” means whatever the lower numbers offered are, not a fixed number etc)If you ask for ratings from 1-5, ANCHOR the endpoints and midpoint: “not at all interested, extremely interested, neutral”Can force people to choose by giving even number of options, but use carefullyFor non-number responses, Always offer optional free-response at the end – people like to feel heard. Particularly unhappy people: if you don’t give them an opportunity to complain to YOU, they WILL complain to someone else. You want to hear, so you can do something about it!
- Deliberately chose not to allow a neutral response, we came into the study with some concerns that people might be uncomfortable being recorded in the situation, and wanted to push people to judge whether the recording was negative or not.
- - Difficult question to write – want qualitative feedback without forcing long open-ended answers, OR being too restrictive. - Ended up asking co-workers for their open-ended responses before generating list of multiple-choice answers (a kind of informal pilot study)
- SurveyMonkeyhas been most popular for a long time, offers a lot of powerful options particularly with paid accounts, but not my favoriteGoogle Drive Forms let you create simple surveys for free. Quick, but not a lot of powerful page logic.Instant.ly – free to set up if you don’t use their survey distribution channel, quick and easy to create short surveys, good-looking, mobile-friendly. If you do need new sample populations, can pay for access to their survey-takers, particularly great for mobile feedbackUsabilla – innovative approach to giving feedback, happens directly on your site with simple ratings, instead of a separate group of survey questions. Great for quick positive/negative reactions to designs, in-context understanding of a page, simple a/b tests. $49 per month for cheapest plan
- Good for creating or redesigning complex menu structuresEspecially important when the terminology and structure INSIDE your org doesn’t match how visitors think about your contentResults are GUIDELINES to help perspective, no one person’s results should be translated literally to a site navIn-person card sorts are ideal because you can talk to participants about their thought process, get a sense of how confident they are about groupings, etcRemote, computer-based cardsorts are faster and cheaper
- OptimalSort is free for 10 users or lessUsabiliTest offers 3-day trial, $25/month
- Content inventory = first step for all content strategy. Especially important for large, older websites that have grown a lot with timeA content inventory is a great thing to have, but can be tedious to put together – maybe good project for intern or volunteerOne giant spreadsheet listing every page on the site- Unique ID for every page, preferably corresponding to a navigation hierarchyURLTitleShort descriptionWho is responsible for the contentWhen was it updatedOnce you have a content inventory built, you can analyze it to see where you have overlaps or redundant content, what you might be missing, what is too outdated to be useful, and really work on planning out how you will manage your content in the futureCan also capture plans for future content – if you are starting to gather feedback from users and they are complaining about not being able to find something, or seeing too much irrelevant info, add that to content inventory and start planning what to add/remove and where.There aren’t many tools specifically for content inventories, spreadsheets are standard – can find spreadsheet templates that people share for free online.
- Slickplan will go through and create a list of all the pages in your site automatically, great to use as a starting point for filling out a more detailed content inventoryXML Sitemaps creates an XML doc of up to 500 pages for free, can import into excelSearch for content inventory spreadsheets, lots of individual designers have shared spreadsheet tempaltes
- A/B testing involves creating two versions of a page element, then showing half your visitors one version, and half the other version, in order to find out which one works better. Best for pages that have some kind of action by the user that you can measure: donate button, newsletter signup, even a click-rate. But less good for overall, subjective impressions. BUT, Usabilla can help you A/B test more subjective options: ask people to rate a section of a page with smiley facesFor example: Will changing the look of the donate button increase donations? How about the location? Will using a photo of people increase signup rates, compared to a photo of a landscape? Which headline gets more people to click on an article?Try to change as little as possible between A/B tests so that you know exactly what caused the increase. Also means you’re not wasting effort on ineffective designs. Not great to A/B test a major redesign/reorg, but IS great for refining and improving an already reasonable design
- Generally you do need coding expertise to set up an A/B test – you have to build each variation to test yourself, then set up code from the toolGA CE is freeOptimizely is $19/month for cheapest monthly plan, $79 for next tierUsabilla again, $49 for cheapest monthly plan
- The traditional methods of usability testing are think-aloud protocols and eye-tracking studies. Eyetracking software is expensive, requires a dedicated lab, doesn’t offer much return for the expense. Eye-tracking doesn’t tell you about OUTCOMES. Focus on OUTCOMES.Think-aloud protocol: ask people to complete a task, and think aloud about what they’re doing, as they do it. Explain each step: what they’re looking for, why they’re looking for while they do it. Simple in theory, requires some finesse to run: gently prompt people to think aloudWhat you ask people to do is also important: ask them to find something they’re interested in, rather than giving them a specific topic to look for, for exampleTraditional usability studies involve recruiting participants and bringing them into a lab. Guerilla usability means going out and finding people, asking them to participate on the spot. Prototypical example: two people with a laptop in a coffeeshop, approaching people and asking them to look at your site, for the price of a cup of coffee, maybe a $10 gift card. Important to emphasize: we’re interested in the design, NOT YOU. If you can’t complete a task, that’s OUR problem, and you have not failed. You can stop at any time and we’ll still give you the reward.
- Because these are smallish, one-off activities, easy to lose track of what others have done, fail to put things together into a larger pictureBefore you start collecting data, have a plan for what to do with itStart an internal wiki, share an evernote notebook, etcMake it easy to contribute data, and easy to learn from othersEncourage people to add everything! Analytics reports, 10-minute usability testing results, surveys, informal conversations with users, email complaints: EVERYTHINGSometimes you have a question that can be answered with someone else’s work, don’t duplicate effort!