Design system
Role: lead designer
Situation
Atheneum lacked a design system, resulting in visual inconsistencies and inefficiencies across its products. Designers and developers were often reinventing components, leading to duplicated effort and inconsistent user experiences.
Task
My goal was to create a comprehensive design system with reusable components, clear documentation, and accessible patterns to drive consistency, efficiency, and inclusivity across our digital products.
Project success
✅ Reusable components saved time for both design and development teams.
✅ Clear documentation improved team understanding of when and how to use components.
✅ Accessible components ensured more inclusive product experiences.
Actions
I started by defining core elements, typography, colour, spacing, and grid, before progressing to components. I worked closely with developers and product stakeholders to ensure each element was technically feasible and aligned with business needs.
The design system was documented in Confluence for visibility and implemented in both Figma (for design) and Storybook (for code), creating a shared reference point for the entire product team.
Result
We launched the first version of the design system with a Figma component library and a corresponding Storybook repo. This enabled more consistent design decisions and sped up both design and development processes. While the system is still evolving, it now provides a strong foundation for ongoing product work.
Outcome
The design system is now a living product. As our needs evolve, so too will the system, with new components and refinements added iteratively.
Today, designers and developers have access to:
A Figma library with the core components
A Storybook repo with live code and usage documentation
Personal highlights
Seeing the design system take shape from the ground up, starting with no existing style guide.
Gaining deeper insight into how design and development teams can collaborate through a shared system.
Learning to define components by their functionality, not just their appearance, making the system more purposeful and scalable.
Note: this case study follows the STAR framework and is intentionally concise to provide a brief overview of the project. If you'd like to learn more, please feel free to reach out!