Retail · B2B
A Cleaner B2B Buy: Reskinning AutoZone's Professional Storefront
A focused visual refresh of AutoZone's B2B storefront — preserving complex purchasing logic while improving clarity, hierarchy, and speed for professional buyers.
- Role
- UX/UI Designer
- TIMELINE
- 8 weeks
Objective
Modernize the look and feel of key B2B pages without disrupting the underlying business logic — quoting, approvals, invoicing, and repeat purchasing — that professional customers rely on every day.
The problem
The existing B2B experience worked, but it showed its age. Dense layouts, inconsistent type and spacing, and weak visual hierarchy made common pro tasks — finding labor times, looking up parts, and narrowing results — slower than they needed to be. A full rebuild was off the table; the reskin had to honor existing flows, constraints, and stakeholder requirements.
Discovery & Research
Developed a deep understanding of the end-to-end B2B purchasing workflow — quoting, approvals, invoicing, and repeat purchasing — by partnering with product, engineering, and account stakeholders.
Audited existing flows and constraints to map which interactions were business-critical and could not change, versus which surfaces were free to evolve visually.
Design Approach
- 01
Established a refreshed visual language — typography scale, spacing system, and component states — aligned to the broader AutoZone design system
- 02
Reskinned high-traffic pro surfaces: Labor Shelf, Part Lookup, Narrow Product Results and more, preserving every existing field, action, and flow
- 03
Rebuilt hierarchy and density so scannable information (labor times, part numbers, fitment) leads, with secondary metadata stepping back
- 04
Documented before/after states and component specs to support engineering hand-off with minimal logic changes
Before & After
01 · Labor Shelf
Reorganized labor times and operations into a clearer, scannable shelf — same data, sharper hierarchy.
02 · Part Lookup
Tightened the lookup surface so vehicle context, part numbers, and fitment lead the eye.
03 · Narrow Product Results
Refined the filter and results layout to make narrowing fast — denser where it helps, lighter where it doesn't.
Outcome
The reskin gave the B2B storefront a calmer, more confident feel — same powerful tools, with less friction between the pro user and the answer they came for.
By holding the business logic constant and focusing purely on clarity and hierarchy, the work shipped quickly and without risk to the workflows pro customers depend on.
7
Pages reskinned
Zero
Business logic changes
Elevated
Visual clarity
Next project