gamut.codecademy.com

Codecademy's Design System

Codecademy's design team was growing to service multiple brands, business units, and products. However, designers and developers often struggled with issues like drift, miscommunications, and confusion while building out designs. I was brought onto the team to standardize design practices and mature a design system that was used by over 40 designers and engineers.

This was a highly technical role that combined front-end architecture, design operations, and developer-designer diplomacy. As design systems sped up development and made product teams more efficient, I was able to focus on more strategic projects like Expressive Colors and complex atomic organisms like Tables.

Role: Design Systems DesignerTeams: Web Platform, Brand Design
Gamut File Cover
GridForm Component
Alerts Component
Badge Component
Menu Component
Modals Component
Tag Component
List Organism
Alerts Component
Gamut Organisms
Taxonomy
Insights
Gamut Expressive Colors
Yellow Color Study
Gamut Patterns
Red Color Study
Gamut GitHub
"Stephen has had an incredible impact on the design and gamut teams in their tenure at Codecademy. They have accelerated the maturation of the gamut design system and brought us much further in achieving our mission of gamut-as-a-service."
HEAD OF DESIGN
"Stephen is called out time and again as a top-tier collaborator with engineering and has been instrumental in bringing design and engineering closer in culture and craft."
WEB PLATFORM ENGINEER

All product teams shipped critical projects using Gamut

Trust was repaired across teams and disciplines

Gamut has matured and so has the design team

Every product designer was able to suggest or implement component updates in Figma

Every business unit had at least one in-depth Gamut collaboration

Leadership recognized Platform Design as critical to business needs during an all-hands