Design and usability methods and techniques

The educational technology and digital learning wiki
Jump to navigation Jump to search

Draft

<pageby nominor="false" comments="false"/>

Introduction

This article will attempt to summarize major User interaction and user interface design, user experience design and usability methods and techniques.

In general, usable designs are created using some kind of user-centered design (UCD) methodology.

A table and list of design and usability methods

(soon - Daniel K. Schneider 18:33, 11 March 2011 (CET))

Table of popular design and usability methods
Method/Tool Requirements and planning Design Testing
Card sorting
Contextual inquiry
Focus group
Storyboarding and Personas
Scenarios of use, use cases and use case modeling
Task analysis
Wireframing
Heuristic evaluation
Cognitive walk through
Usability and user experience surveys
Usability testing (design and interaction testing)

Other taxonomies of design and usability methods

Usability Net provides a nice interactive methods table leading to articles of which we reproduce a cropped screen copy below:

Methods table, Copyright usability.net 2006, retrieved 18:43, 3 March 2011 (CET). Reproduction permitted provided the original source is acknowledged.

Usability.gov - managed by the U.S. Department of Health & Human Services - presents a similar table leading to articles. It organizes usability methods according to where they take place in the user-centered design process.

Source: Usability.gov, retrieved 18:43, 3 March 2011 (CET)

This website also provides a step-by-step visual map for guidances through the user-centered design process. We show a screen copy below:

Step-by-Step Usability Guide by usability.gov, captured March 2011.

The Nasa usability toolkit includes a (by default copyright-free) table that also is organized by stages.

Tool / Method Requirements & Planning Stage Conceptual Design Stage Test & Evaluation Stage Resources Required Purpose of Method
Brainstorming X LOW Generates design ideas
Card sorting X X LOW Helps structure interface content
Cognitive walk through X X MEDIUM Checks structure and flow against user goals
Context of use analysis X LOW Specifies vital user and product characteristics
Contextual inquiry X MEDIUM Provides information about users' work context
Focus group X LOW Elicits user requirements/views through discussion
Functionality matrix X X LOW Specifies functions required to support tasks
Heuristic evaluation X X LOW Provides expert feedback on user interfaces
Interactive prototyping X MEDIUM/ HIGH Used for testing with users
Interview techniques X X LOW Provides detailed user experience about product usage
Observation X MEDIUM Describes user activity in detail
Paper prototyping X MEDIUM Tests design ideas with users
Parallel design X HIGH Provides one conceptual design idea from several
Participatory evaluation X X MEDIUM Detects task-related usability problems early in design
Rapid prototyping X MEDIUM Allows users to visualize future systems and evaluate
Scenarios X X MEDIUM Illustrates requirements and supports conceptual design
Storyboarding X MEDIUM Visualizes relationship between events and actions
Surveys X X HIGH Provides mass data from users
Task analysis X MEDIUM Analyses current user work in depth
User-based testing of design X MEDIUM Provides recommendations for how a design can be improved.
User-based testing of interaction X HIGH Measures usability and identifies interaction problems
WAMMI - Web site X LOW Provides an objective way of assessing user satisfaction
Wireframes X LOW Fast and easy concept prototyping that focuses on layout, navigation and high level content

Usability Body of Knowledge includes a the following list of articles: Affinity Diagramming, Brainstorming, Card Sorting, Checklist, Claims Analysis, Context of Use Analysis, Contextual Inquiry, Critical Incident Technique (CIT), Cultural Probe, Diary Study, Ethnography, Field Study, Focus Group, Formative Evaluation, Free Listing, Function Allocation, Heuristic Evaluation, Metaphor Brainstorming, Parallel Design, Phone Interview, Photo Study, Pluralistic Usability Walkthrough, Rapid Prototyping, Rating Scales, Storyboard, Wireframe, Wizard of Oz.

Links

Standalone introductions

Indexes (links to tools and methods)


On-line tools and usability services

(last checked on feb 2011)

  • Usability Scorecard (measuringusability.com)
  • UserTesting.com (for $39 hire a visitor that will send you a video message with problems found)
  • WhatUsersDo.com Quote: "We video people using your website so you can see how to improve the user experience" (£ 30 and up).
  • crazyegg.com/ Get heat map analytics (starting at $20/month)
  • feedbackarmy.com provides a questionnaire service (you submit questions and then get answers from 10 users, a questions test is $15)
  • WebSort enables you to conduct remote card sorting online. (one free study, 10 participant limit)
  • FiveSecondTest.com Landing page optimization for your mocks and wireframes. (commercial, but you can do tests to earn tests)
  • Usabilla Quote: "Ask your users simple questions to collect valuable feedback and discover usability issues. Use our One-Click-Tasks to measure task performance. Users simply share their feedback by clicking anywhere on your website, mockup, sketch, or image. Measure time, collect points, and get valuable feedback with notes." (commercial, free signup allows for 1 active public test with 10 participants).
  • VerifyApp. You can create tests with screenshots of new designs or wireframes for your site, but you can also capture from an existing site, or pull a screenshot straight from Notable. Several tests are implemented but, sorry, no list. I won't suffer watching a video instead of reading a short feature list....
  • Notable allows people to give feedback on design, content and code an any page of a website or application. (Capture with a firefox extension, upload jpg, type in URL, capture iPhone/Touch)
  • Google WebSite Optimizer. Google’s free website testing and optimization tool, allows you to increase the value of your existing websites and traffic. (free service). This tool works in similar way as Google Analytics.

See also web wireframe for wireframing tools

Excel workbooks and word processor forms

Software

Usability
  • Experience Capture Studio (A $18750 version includes hardware)
  • LiveLogger, prior version of Experience Capture Studio. Possible free for non-commercial use, upon request). According to UseTube (2006), it “acts as a dynamic notebook that tracks the time for you and allows you to choose from certain actions so that when you choose that action, it marks the time and lets you make a note regarding the circumstances.”
  • Morae A suite of three usability tools (recorder, observer and manager) by TechSmith ($1500 total/ 3/2011)
Simple screen and user capture
  • Silverback. A Mac OS X application: Screen capture, video of tester's face + voice, on-the-fly chapter markers, ... result is a *.mov composite. (30 days trial).
  • BB FlashBack Express
  • CamStudio Quote: "is able to record all screen and audio activity on your computer and create industry-standard AVI video files and using its built-in SWF Producer can turn those AVIs into lean, mean, bandwidth-friendly Streaming Flash videos (SWFs)" (open source). Software is also available from http://sourceforge.net/projects/camstudio/

Various articles