Design Systems

UI Pattern Library Inventory

Before building a design system, catalog every UI pattern in your product. A pattern inventory highlights inconsistencies and redundancies. It also reveals gaps in your interface. You can't systematize what you haven't identified. Inventory is the foundation for design systems or component libraries.

Duration
2 hours
Group Size
2-4
Category
Design Systems
Difficulty
Easy
Energy
Medium

Objectives

Document all UI patterns. Identify inconsistencies and redundancies. Create a foundation for design system development. Build team awareness of interface complexity.

Outcomes

A comprehensive inventory of existing UI patterns. Documented inconsistencies and redundancies. A solid foundation for design system development.

Step-by-Step Instructions


  1. Define Scope (15 minutes). Decide what to inventory. Examples: the entire product, a specific section, or particular component types like buttons. Start narrow. A complete button inventory beats an incomplete inventory of everything. Set clear boundaries.

  2. Screenshot Everything (40 minutes). Systematically capture every pattern instance within the scope. If inventorying buttons, screenshot every button in the product. Capture every state (default, hover, disabled), every context, every variation. Use automated tools if available. Manual screenshots work too. Be comprehensive.

  3. Organize by Pattern (35 minutes). Group screenshots by pattern type. Put all buttons together, all forms together, all cards together. Within each type, look for variations in size, color, behavior, and labels. You might discover 8 button styles where you thought there were 2.

  4. Document Variations (30 minutes). For each pattern, note where each variation appears and why it exists. Is the difference intentional or unintentional drift? How many variations are there in total? This reveals whether inconsistency is strategic or accidental. It's usually accidental.

Unlock Step-by-Step Instructions

Join 2,500+ facilitators who use Workshopr to plan better workshops — free during beta.

Facilitator Tips

An incomplete inventory can be misleading. Missing 20% of button variations suggests less complexity than there actually is. Be thorough, even if it's tedious. Automation helps, but manual review catches exceptions. Some differences are strategic (primary vs. secondary buttons). Some are unintentional drift (someone reinvented the wheel). Document both, but know they require different solutions. Teams usually underestimate pattern diversity. "We have 3 button styles" often becomes "We have 17 button variations." Inventory makes hidden complexity visible. Remember, this exercise documents the current state, it doesn't fix it. Don't get sidetracked into redesign. Just document what exists.

Pre-Work

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

Join 2,500+ facilitators who use Workshopr to plan better workshops — free during beta.

Materials Required


  • Access to the product/section being inventoried

  • Screenshot tools or design audit tools

  • Large wall space or digital board

  • Spreadsheet or documentation tool

Unlock Materials Required

Join 2,500+ facilitators who use Workshopr to plan better workshops — free during beta.

Resources & Templates

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

Unlock Resources & Templates

Join 2,500+ facilitators who use Workshopr to plan better workshops — free during beta.

Discussion

Loading comments...