SIMS 213: User Interface Design & Development Marti Hearst Tues, Feb 26, 2002

From James Horn '96, htm Affinity Diagrams A categorization method where users sort various concepts into several categories. Used by a team to organize a large amount of data according to the natural relationships between the items. Also called Card Sorting

From James Horn, htm How to do it Form a team Describe the issue Generate idea cards Sort cards into groups –Different ways to resolve conflicts –This is the hard part Create header cards Draw the Affinity Diagram –Draw lines connecting the headers, subheaders, and groups. –Connect related groups with lines. –The result looks a lot like a typical organization chart.

Example Restaurant web site Procedure: –Team A chooses a topic –Team A brainstorms category labels –Team A gives these labels to Team B Each member of Team B makes an independent grouping Team A then reconciles these different groupings

Interaction Flow Example Example from Last Year: McInterface –Linda Harjono, Saifon Obromsook, John Wai – Main idea: –Walk up kiosk for McDonalds Main goals –Easy –Fast

Interaction Flow Example

Some details missing from the diagram First branch not labeled correctly Let’s complete the example