Design Systems

Pattern Library Mapping

Pattern Library Mapping visually inventories UI patterns in your product. Before building a design system, understand existing patterns, their locations, and relationships. This exercise maps that landscape.

Duration
3 hours
Group Size
4-6
Category
Design Systems
Difficulty
Easy
Create a comprehensive inventory of UI patterns. Categorize patterns and map relationships. Identify inconsistencies for consolidation. Find gaps where new patterns are needed. Build a foundation for a design system pattern library.
You'll get a visual pattern map of the UI landscape. You will document an inventory of patterns with metadata. You will identify consolidation and development priorities. This provides a clear picture of pattern debt and opportunities, and a foundation for systematic pattern library development.
Be exhaustive before organized. Don't skip admin, error, or empty states. Question every 'intentional' variation. Document context, not just appearance. Look for patterns doing the same job differently. Watch for orphan patterns used only once. Note patterns with inconsistent behavior. Identify missing patterns the team builds ad-hoc. Sometimes, teams have a hard time agreeing on pattern categories upfront; I've found it helpful to let them emerge during pattern collection instead.

  1. Scope Definition (15 minutes): Define what counts as a 'pattern'. Identify products/features to include. Agree on pattern categories (navigation, forms, content, feedback, etc.). Set up the mapping workspace.

  2. Pattern Collection (30 minutes): Screenshot every distinct UI pattern across products. Capture all variations and states. Note the context where each pattern is used. Don't judge—just collect.

  3. Pattern Mapping (25 minutes): Group patterns by category. Identify relationships between patterns. Mark variations of the same pattern. Note inconsistencies and duplicates.

  4. Gap & Opportunity Analysis (15 minutes): Identify missing patterns. Find opportunities for consolidation. Prioritize patterns for standardization. Note patterns to deprecate.

  5. Documentation & Next Steps (5 minutes): Photograph or digitize the map. Create a pattern inventory document. Assign ownership for pattern development. Plan the next steps for the design system.

Unlock Step-by-Step Instructions

Create a free account to access step-by-step instructions, agendas, and resources for all activities.

For Facilitators

  • Review participant profiles and expectations
  • Prepare all materials and supplies
  • Test technology and room setup

For Participants

  • Complete pre-session survey
  • Review background materials
  • Prepare examples or case studies

Unlock Pre-Work Requirements

Create a free account to access step-by-step instructions, agendas, and resources for all activities.


  • Large wall space or whiteboard

  • Printed screenshots of patterns (or digital tool)

  • Sticky notes

  • Markers

  • Access to audited products

  • Screenshot tool

  • Pre-printed pattern category labels

  • Pattern inventory spreadsheet template

  • Camera

  • Digital collaboration tool (Miro, FigJam)

Unlock Materials Required

Create a free account to access step-by-step instructions, agendas, and resources for all activities.

  • Facilitator Guide (PDF)
  • Participant Workbook Template
  • Presentation Slides
  • Printable Materials

Unlock Resources & Templates

Create a free account to access step-by-step instructions, agendas, and resources for all activities.

Discussion

0/2000
Loading comments...

Related Exercises

See all exercises

Design System Documentation Strategy

2 hours

Design system documentation turns code into a usable product. This exercise creates a strategy covering what to document, how to structure it, and how...

Design systems

Design-To-Development Workflow Mapping

2 hours

The design-to-development handoff is critical. It's where designs either flourish or fail. This exercise maps your current workflow. Identify friction...

Design systems

Design System Validation Protocol

2 hours

Teams must be confident in design system components before adoption. This exercise builds a validation protocol. It covers visual accuracy, accessibil...

Design systems