Client —
Dick’s Sporting Goods

Design System —
Retail, sports and recreation

Timeline —
Winter to Summer 2019

Role —
Experience Design Lead

Responsibilities —
Planning and roadmapping
DesignOps and leadership
Discovery and research
Experience design
Usability testing
Content strategy
Acceptance criteria

Getting started

Discovery

Conducting research and getting acquainted with business, design, and experience brand opportunities.

Identify wins

Zone new content for flows

Produce high-level page abstractions to call out opportunities for enhancements based on research.

Nail the look

Establish a style direction

Explore the overall art direction of the design system with samples of styling applied to images, iconography, and text.

Set the stage

Redesign pages within flows

Design high-fidelity wireframes and mockups that allow components to be designed and assembled within the context of real pages.

Break it down

Scrape layouts for components

Identify functional puzzle pieces that comprise wireframes and/or mockups to yield components (may be elements or patterns).

Organize it

Prioritize component order

Introduce a hierarchy to the scraped components based on high priority; order components by frequency of usage and level of complexity.

Write the rules

Document acceptance criteria

List each component out and provide detailed notes regarding its usage and behavior (functional, style, technical, and accessibility).

Stress test it

Design component worksheet

Articulate the acceptance criteria of the component through a design worksheet that captures all visual and functional states.

Give it a story

Document component usage

Produce a copydeck with rules and suggestions on how to use and govern the component across the digital experience.

DesignOps in action

Well-organized Figma files allow for a robust ecosystem that lends itself to a scalable Design System.

Time to recap

This is a recommended approach to working on a large-scale Design System.

Print it out.
Put it on your wall.