AutoZone is the largest retailer of automotive parts and accessories in the United States. With over 6,000 stores, 80,000 employees, and 12 distribution centers across the US and Mexico, AutoZone is managing a complex system of internal and external applications.

We were tasked with building a new visual language and using it to reimagine their disparate applications. We delivered a design system, style guide, and 1000+ screens for AutoZone's Warehouse Management System.

Type Client Project // Timeline 6 Months // Scope Design System, Style Guide, Desktop App // Team Carl Morner, Sophie Brittain, Felicia Evangeline, Kathy Li, Tanya Yan

Type Client Project // Timeline 6 Months // Scope Design System, Style Guide, Desktop App // TEAM Carl Morner, Sophie Brittain, Felicia Evangeline, Kathy Li, Tanya Yan

Type Client Project // Timeline 6 Months // Scope Design System, Style Guide, Desktop App // Team Carl Morner, Sophie Brittain, Felicia Evangeline, Kathy Li, Tanya Yan

We took AutoZone's iconic look and feel and modernized it for the web.

We took AutoZone's iconic look and feel and modernized it for the web.

It began with a design system audit to overhaul their e-commerce site. We uncovered hundreds of inconsistencies and redundancies in their visual language. In the end, we built out a full design system and style guide, which became the foundation for our work across their other applications.

It began with a design system audit to overhaul their e-commerce site. We uncovered hundreds of inconsistencies and redundancies in their visual language. In the end, we built out a full design system and style guide, which became the foundation for our work across their other applications.

Design system bento
Design system bento
Design system bento

Their data was rich, but inaccessible. So we made it easy to draw value from a data-dense system.

Their data was rich, but inaccessible. So we made it easy to draw value from a data-dense system.

One key function of warehouse management is monitoring inventory levels. The Inventory Control department conducts what are called "Cycle Counts", where teams manually count products throughout the distribution center to track inventory. Inventory Control Managers oversee the process by creating various types of Cycle Counts, assigning counters, and monitoring discrepancies. We helped digitize these tasks, leveraging cycle count data to provide greater visibility and foresight into warehouse inventory.

One key function of warehouse management is monitoring inventory levels. The Inventory Control department conducts what are called "Cycle Counts", where teams manually count products throughout the distribution center to track inventory. Inventory Control Managers oversee the process by creating various types of Cycle Counts, assigning counters, and monitoring discrepancies. We helped digitize these tasks, leveraging cycle count data to provide greater visibility and foresight into warehouse inventory.

We adapted the design system to work for hyper-complex and hyper-nuanced scenarios.

We adapted the design system to work for hyper-complex and hyper-nuanced scenarios.

Dropdowns were a prime example of this challenge. How did we maintain a consistent visual language while allowing for flexibility? We designed and documented the dropdown component to be its own set of building blocks—able to accommodate all types of selections, variable sizing, and optional elements.

Dropdowns were a prime example of this challenge. How did we maintain a consistent visual language while allowing for flexibility? We designed and documented the dropdown component to be its own set of building blocks—able to accommodate all types of selections, variable sizing, and optional elements.

Tables alone were able to accommodate 11 types of content, multiple languages, and highly variable columns.

Tables alone were able to accommodate 11 types of content, multiple languages, and highly variable columns.

Tables were a crucial design element to AutoZone's Warehouse Management System. How did we design for tables with only a few columns to tables with tens of columns? We put together a set of guidelines outlining the behavior of a table cell depending on the type of content. Highly variable content, like a vendor name, would have different constraints than one with fixed content, like a date. Our final logic balanced incremental sizing, min widths, and fluidity, to ensure flexibility.

Tables were a crucial design element to AutoZone's Warehouse Management System. How did we design for tables with only a few columns to tables with tens of columns? We put together a set of guidelines outlining the behavior of a table cell depending on the type of content. Highly variable content, like a vendor name, would have different constraints than one with fixed content, like a date. Our final logic balanced incremental sizing, min widths, and fluidity, to ensure flexibility.