Design Systems

Component Audit And Categorization

A component audit catalogs every UI element across your product. It reveals inconsistencies and redundancies that you might not know exist. This exercise is the foundation for any design system effort.

Duration
3 hours
Group Size
3-5
Category
Design Systems
Difficulty
Easy
Energy
Medium

Objectives

Participants will:

  • Systematically audit existing UI.

  • Identify and categorize UI components.

  • Surface inconsistencies and redundancies.

  • Create a foundation for design system planning.

  • Build shared understanding of design debt.

Outcomes

Participants will:

  • Complete an inventory of UI components.

  • Document inconsistencies and redundancies.

  • Lay the foundation for design system development.

  • Share team awareness of design debt.

Step-by-Step Instructions


  1. Screenshot Collection (45 minutes): Capture every unique screen, including all states (empty, loading, error, success), edge cases, and admin views. Organize screenshots by feature or user flow.

  2. Component Identification (60 minutes): Print screenshots or use digital tools. Circle and number each distinct UI component: buttons, inputs, cards, modals, icons, typography. Note variations.

  3. Categorization (45 minutes): Group similar components. Create categories like navigation, forms, content display, and feedback. Identify intentional vs. accidental variations. Note components for consolidation.

  4. Documentation (30 minutes): Create a component inventory spreadsheet. Record component name, category, variations, locations, and issues. Photograph each unique component. Note usage patterns and inconsistencies.

  5. Synthesis (15 minutes): Summarize total component count and category breakdown. Highlight consolidation opportunities. Prioritize components for standardization. Plan next steps for design system development.

Unlock Step-by-Step Instructions

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

Facilitator Tips

Be thorough; components hide in settings and error states. Question every variation: "Is this intentionally different?" Don't fix during the audit; just document. Take photos of the sorting process. Common findings: 5-10 button variations, inconsistent typography, similar components with different interactions, and "snowflake" components appearing only once. Share findings with the team. Use as input for design system prioritization. Create a consolidation roadmap.

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 product screens.

  • Screenshot tool.

  • Large wall space or digital collaboration tool (Miro/FigJam).

  • Printed screenshots (if physical).

  • Colored stickers or markers.

  • Component inventory template (spreadsheet).

  • Category labels.

  • Shared folder for screenshots.

  • Presentation template.

Unlock Materials Required

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

Resources & Templates

Design Audit Guide - The Design System Guide
Comprehensive design audit methodology.
Design System Audit Guide - DOOR3
Enhancing design foundations through design system audits.
Design System Audit Guide - Ramotion
Simple steps for conducting a design system audit.

Unlock Resources & Templates

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

Discussion

0/2000
Loading comments...

Related Exercises

See all exercises

Design System Landscape Mapping

2 hours

Before building a new design system, map what already exists. Design system landscape mapping inventories all components, patterns, styles, and docume...

Design systems

Design System Governance Framework Development

2 hours

A design system needs governance to thrive. Without it, components become outdated. This exercise helps you establish rules, roles, and processes. We'...

Design systems

Component Classification

3.4 hours

Your design system's components feel disorganized. Component Classification creates a taxonomy based on function, complexity, and relationships. In th...

Design systems

Service Specifications

3 hours

Service specifications document every touchpoint, feature, and interaction. They guide design and implementation.

Service design tools

SDT-Future Backcasting

3 hours

Future Backcasting is a planning method. Start with a clear, desirable future. Then, work backward to find the steps to get there. Unlike forecasting,...

Service design tools