What: A process that allows one to test two (or more) different versions of a page. The display of the various versions vary on your website to see what users respond to best.
Why: Provides guidance in knowing what to adjust on your web page. Altering the size, placement, color of a single element, or the wording of a single phrase can have dramatic effects. A/B testing measures the results of these changes.
What: This is a process that causes one to start backwards with their ideal scenario. Taking these steps causes one to visualize required actions, various outcomes, validating or not validating assumptions.
Why: Teams are better at picturing the future by working backwards from an ideal instead of forwards from the current state of things. Backcasting provides a boost for innovation and planning efforts compared to starting from the status quo.
What: Card sorting is a technique used as an input to the structure of a site or product. The participant sorts labeled cards into similar groups. This could be an open sort, where piles are created based only on perceived similarity of cards, or a closed sort where piles are grouped according to provided categories.
Why: Best used to guide navigation design. Card sorting analysis shows how often participants grouped specific cards together. Discussing why the cards are placed in a particular pile yields deeper insight into user expectations for content.
Source: Card Sorting, Designing Usable Categories, by Donna Spencer
What: A group usability review that includes stakeholders, designers, developers, and end users. These sessions typically involve walking through a number of key tasks or screens, and are moderated by a lead reviewer, recorder, and time keeper.
Why: Due to the fact that many points of views are represented, collaborative inspections can be more thorough and efficient than expert reviews. Collaborative sessions also allow for discussions between stakeholders that might reveal deeper insights.
What: A technique to analyze design possibilities by making short films about how customers might use a technology in the future. Concept videos often focus on the context and benefits of use, rather than on specific interaction details.
Why: Various prototyping methods concentrate on the fine details of a design: what functions and controls to include, and how to lay them out. Because concept videos tell stories and avoid finite details, they are better suited to explaining a new vision.
What: This is a collaborative method for participants in a workshop, to iteratively sketch their thoughts about possible solutions, discuss reasons for drawing a particular solution, and then sketch revised versions. A number of sketches is helpful to explore different approaches and work towards a common vision.
Why: Prepares a framework for participants to articulate their ideas. Explores underlying motivations that drive feature suggestions. Looking at root causes offers more opportunities for real solutions than simply adopting requested features.
What: Visualization of experience across locations, time, and channels. Captures interactions between touch points. Helps illustrate what an “ideal” scenario might look like when planning, architecting and designing an interactive experience.
Why: A holistic view of experience through time with specific touch points. This process helps contribute to better coordination of cross-channel design and reveals opportunities for new or improved interactions.
What: A form of usability inspection where specialists assess how well an interface complies with recognized usability principles (heuristics). Usually two or three experts review a system, noting and ranking problems.
Why: Provides quick, inexpensive usability feedback. Can be a good method early in a development process, as it concentrates on the basics, ensuring that an interface is fundamentally sound before more in-depth testing with real users.
What: A comprehensive inventory of all design elements, content, and interface components on a page, arranged in three columns of high, medium, and low priority. The content areas of the page are described in prose, as in a functional specification.
Why: Documents the elements of each page without specifying layout. May be used instead of wireframes, or preceding wireframes. Allows greater collaboration between team members responsible for visual design and functional specification.
What: Personas are archetypal users of an intranet or website that represent the needs of larger groups of user, in terms of their goals and personal characteristics. Includes a name, picture, user quotes and other info with a focus on goals, motivation, and behavior.
Why: Crates empathy for the specific user and avoids self-referential design. Focus on accomplishing specific goals allows the product to satisfy many people with that goal, whether or not they match a specific market segment.
What: Scenario planning is not about predicting the future. Rather, it attempts to describe, via story-telling methods, what is possible. The result of a scenario analysis is a group of distinct futures, all of which are plausible. The challenge is how to deal with each of the possible scenarios.
Why: Many planning techniques focus on current data and fail to address the unpredictability of future events. Divergent stories help to increase our understanding of our operating environment, and expose our basic assumptions about how the world works.
What: Sketch boarding is a collaborative design technique developed to capture concepts, iterate through low-fidelity comps and work toward more detailed interfaces. All of this is staged on a large sheet of paper. Starts by posting criteria like discovery findings and then sketching and arranging potential solutions nearby, first as thumbnail sketches and then as detailed screens.
Why: Design the big picture of a site or application without getting bogged down in incremental detail like wireframes can. Collaborative low-fi format keeps project criteria at hand to build common ground.
What: Using simple post-it notes enables ease of use in re-positioning without having to deal with written mistakes on paper. Can be attached to a wide variety of flat surfaces, including documents, walls, monitors, and white boards.
Why: UX professionals are indecisive. They answer most questions with ‘it depends’. Myriad bits of paper (or ‘data’) can be useful for creating the impression that we know a lot of stuff, so ‘stakeholders’ shouldn’t mess with conclusions.
What: Diagram that displays parallel streams for users, business, and technical process flows. May also include a storyboard stream. A diagram is created for each core product scenario or activity. Provides foundation for use cases.
Why: Provides alignment and integration of task flow with process and technical requirements. Establishes understanding of all components of a specific process in one document, while allowing clearer separation, responsibility, and delegation.
What: Where users test drive a prototype or production system. Usually one-on-one, with a participant and moderator, the participants are asked to think out loud as they complete representative tasks. Typically 6-8 participants per user segment.
Why: Usability testings helps one understand what works and what doesn’t. The process helps focus in finding specific interface issues, layout, labeling, and interaction.
What: Storytelling approach to design that captures user motivations and actions in short, focused, narrative form. Each scenario captures the moment for a particular set of action focused on meeting a specific need for a user. Typically written, sometimes captured through pictures or video.
Why: Brings users to life while keeping focus on tasks and behavior. Scenarios can link together to tell the entire story of a product or service. Easy to explore and iterate, scenarios complement personas, and can lead to more detailed use cases.
What: Measurement tool that provides insight into the analysis of user behavior based on logs of activity on a website. These tools provide information such as entry and exit pages, most popular pages, paths through the site, links from other sites, and search terms.
Why: Allows real time view of user behavior on websites. Particularly strong for measuring user intent through search terms, trouble spots where users leave, and conversion goals for marketing and sales.
What: This method visualizes interaction within a system by laying out the various screens of an application in one large document and drawing the connections between related screen elements.
Why: Provides comprehensive canonical picture of system interaction in one document. Can see key interactions and relationships at a glance. Caution: very labor-intensive to maintain as the system changes through iterations.
What: A wireframe is a basic visual guide used in interface design to suggest the structure of a website. It describes each element and behavior. Focus is on layout, labels, interactions, and relationships between other pages. Finished design elements such as color and photos are not used.
Why: Focus is on specifications for individual pages or templates. Can use as prototype for usability testing. Prevents premature conversations about surface issues like color, instead focuses discussion on correct and complete content and functionality.