UX Techniques Bank
A comprehensive collection of techniques available for use on UX projects.
Mix and match to create a UX process best suited to the project at hand. We'll be updating this page regularly with additional content, links and tutorials about how to apply these techniques.
Are we missing a technique? Perhaps you'd like to write a tutorial or case study about one of these techniques? Get in touch!
Looking for an online course that teaches how to use these techniques? Read this review.
What It Is
When To Use It
How To Use It
|Competitor Analysis||Performing an audit/review of competing websites and apps; conducting user testing of competing sites; writing a report that summarises the competitive landscape.||Strategy, Research||Downloading, signing up for, purchasing, and using products that compete with yours is only part of the process; conducting user testing sessions on these products will also yield valuable insights. Check out the Inc. article How To Conduct Competitive Research for more tips.|
|Analytics Review||Analysing web or mobile usage data, and making subsequent recommendations.||Strategy, Research||All analytics packages provide key reports, such as most frequently visited pages, visitor demographics, bounce rate and more.
We'll be adding instructional content about interpreting web analytics soon, but in the mean time this article is a good place to start. Brian Clifton's book on the topic also comes recommended.
|Stakeholder Interviews||Conversations with the key contacts in the client organisation funding, selling, or driving the product.||Strategy, Research||Steve Baty's article, Conducting Successful Interviews With Project Stakeholders is worth a read as it contains lots of tips gleaned from experience.|
|Contextual Enquiry||Interviewing users in the location that they use the website/app, to understand their tasks and challenges.||Research||Read Contextual Enquiry - A Primer by Gerry Gaffney for a rough guide to planning for, scheduling, conducting a contextual enquiry.|
|Surveys||Crafting an online survey, primarily to solicit feedback from current (or potential) users.||Research||Creating a survey is easy; creating a good survey that asks questions in an unbiased way is not. We're looking for someone to write more on this for uxmastery.com. Interested? Get in touch.|
|Content Audit||Reviewing and cataloguing a client’s existing repository of content.||Research||Donna Spencer's beginner's article is a good place to start. She also has a template for creating a content inventory that is available for download.|
|Diary Study||Asking users to record their experiences and thoughts about a product or task in a journal over a set period of time.||Research||Conducting a diary study is really as simple as providing users with a diary and a timeframe, as well as guidelines about what (and what not) to record.
Read Andrew Maier's article, Jumpstart Design Research With A Diary Study for more details.
|User Interviews||User interviews are a key activity for understanding the tasks and motivations of the user group for whom you are designing. Interviews may be formally scheduled, or just informal chats (for instance, in a suitable location that your target demographic are present).||Research||Interviewing someone takes practice. Read how to how to improve your interview skills for tips on getting better.|
|Heuristic Review||Evaluating a website or app and documenting usability flaws and other areas for improvement.||Research, Analysis||A good method for determining how usable a site or app is entails working through a checklist, such as the one from uxforthemasses.com, and relies upon the practitioner being sufficiently experienced to judge whether something is usable or not.|
|User Testing||Sitting users in front of your website or app and asking them to perform tasks, and to think out loud while doing so.||Research, Analysis, Design, Production||Read about how to run a user testing session even if you're a complete novice.
Also be sure to check out Steve Krug's short book, Rocket Surgery Made Easy for a comprehensive guide on how to plan for, schedule and conduct usability tests.
|Use Cases||A use case is a list of steps that define the interactions between a user and a system. Use cases, especially when used as requirements for software development, are often constructed in UML, with defined actors and roles.||Analysis||Darren Levy's article, Use Case Examples—13 Killer Tips, written for Business Analysts and Software Engineers, is a good introduction to creating use cases.|
|Storyboards||A storyboard is a tool inspired by the filmmaking industry, where a visual sequence of events is used to capture a user’s interactions with a product. Depending on the audience, it may be an extremely rough sketch, purely for crystallizing your own ideas. |
Sometimes it can be useful to create a slightly more polished version of this—a comic—to communicate this sequence of events to key stakeholders in order to achieve buy-in for a concept.
|Analysis||Check out Matt's comic strip, A Day In The Life Of A UX Designer, as an example of capturing daily tasks in a comic-strip format.
We'll definitely be publishing more information on how to create storyboards and comics on uxmastery.com soon!
|Affinity Diagramming||A business technique for identifying and grouping patterns within unrelated data.||Analysis||The items to be analysed are recorded onto cards or post-it notes. They are then arranged into logical groups.|
|Personas||A persona is a fictitious identity that reflects one of the user groups for who you are designing.||Analysis||Creating personas for your project involves morphing qualitative and quantitative data from analytics, surveys, interviews, user testing sessions, and other research activities into a handful of representative “typical” users. These personas are assigned names, photographs, motivations, goals, and a believable backstory that is rooted in the backgrounds of real people using your website or app. Read the process Matt followed for this activity at SitePoint.|
|Scenarios||A scenario is a narrative describing “a day in the life of” one of your personas, and probably includes how your website or app fits into their lives.||Analysis||Writing a scenario is as simple and complex as documenting the tasks that a user performs when using your product (not the how).
Jacqueline Wechsler's introductory article, Using Scenarios, is a good starting point. Neil Turner's Step by Step Guide to Scenario Mapping is a must-read.
|Mental Models||A mental model diagram is a fishbone or horizon diagram where the top towers represent individuals' motivations, emotions, and stories related to their experience in achieving a particular goal, regardless of the tools they use. The top part of the diagram is person-focused, not solution-focused. The bottom towers of the diagram represent the features of your organization's offerings, aligned beneath the appropriate upper towers that they support the best. You can see where your organization's design and business requirements support people's goals well and where they need improvement. The diagram as a whole is generative, not evaluative, helping your organization realize weaknesses and gaps in the way you support people and adapt existing products, services, or processes to particular behavioral audiences or situations.||Analysis||How it works: stories collected from essays, web, empathic interviews, etc. are collected, combed for relevant actions, emotions, and philosophies and grouped in mental spaces. Requirements gap analysis is then conducted by slotting requirements into the mental spaces and seeing how they align with what users have said.
Advantages include an in-depth understanding of gaps between individual's perceptions and motivations vs. business and design requirements. Since they are unstructured and open ended interviews, the likelihood of the results being skewed by stakeholders is minimal, which leads to a more accurate understanding of what will benefit and be well-received by the users. There's some flexibility in data collection--it can come from blogs, Twitter, diary entries (see Diary Studies), etc. as long as it is the voice of the individual and not being generated by highly directed questions (courtesy Mike Oren, PhD).
Indi Young describes the process in her book of the same name.
|Experience Map||An experience map is an extended version of a mental model. Rather than looking at one subset of time for a single user, an experience map is an holistic, visual representation of your users’ interactions with your organisation when zoomed right out. |
Because many organisations and the projects within them are large and complex, an experience map is usually captured on a large canvas—a necessarily big poster that you can zoom in or out of to explore the details.
|Analysis||Start by reading this article on how to create an experience map.
Watch this space for tutorials on this topic.
|Collaborative Design||Inviting input from users, stakeholders, and other project members.||Design||Provide all participants with some paper and a pen, and have them complete exercises such as drawing wireframes, or writing on printouts of screens that they like or don't like. Read Jason Furnell's Facilitating Collaborative Design Workshops article for more.|
|Workflow Diagram||A workflow diagram (or activity diagram) is a graphical representation of activities and actions conducted by users of a system.||Design||Traditional workflow diagrams created by Business Analysts would comprise strict UML notation.
Interested in writing about workflow diagrams for uxmastery.com? We'd love to hear from you. Contact us now!
|Sitemap||A sitemap is a complete list of all pages available on a website.||Design||Creating a sitemap is a useful task at the beginning of the design process, as it can be used to shape which screens to wireframe.
Interested in writing for uxmastery.com about creating sitemaps? We'd love to hear from you!
|Wireframe||A wireframe is a rough guide for the layout of a website or app. A prototype is similar in that while far from being a polished product in terms of visuals or functionality, it gives an indication of the direction that the product is heading. “Mockups” is the term I use for wireframes that have been created in high fidelity, but for some people these three terms are interchangeable.||Design||Static wireframes can be created with pen and paper, but these days the software available for creating interactive wireframes makes the task quick and easy to do. Watch this space for a tutorial on this topic.|
|Paper Prototype||Paper prototyping is the process of creating rough, often hand-sketched, drawings of a user interface, and using them in a usability test to gather feedback. Participants point to locations on the page that they would click, and screens are manually presented to the user based on the interactions they indicate.||Design||Watch this YouTube video of a user testing session using a paper prototype.|
|Card Sorting||Card sorting is a technique where users are asked to generate a folksonomy, or information hierarchy, which can then form the basis of an information architecture or website navigation menu.||Analysis||Check out Donna Spencer's book on Card Sorting for comprehensive coverage of the topic.|
|Mood Board||A mood board is a collage, either physical or digital, which is intended to communicate the visual style a direction is heading (or should be heading). Stakeholders may use a mood board to provide a visual designer with the atmosphere they would like their site to convey and the colour palette to explore.||Design||Paul Wyatt's list of tips for creating a mood board is a good place to start. Interested in writing something about mood boards for uxmastery.com? Get in touch!|
|Beta Launch||Releasing a closed beta release of your product involves allowing only a select group of users to use the software and provide feedback before it becomes available to the wider public.||Design, Production||Joel Spolsky's article, Top Twelve Tips For Running A Beta Test is a great place to start.|