Design Systems
UX/UI
Building a Scalable Design System
UC Mobile
Overview
The University of Canterbury had developed a new app that aimed to be a central resource for students to access information and tools during their time at University. This was a quickly evolving product that would be central to the University's digital strategy.
Years of design and development had resulted in inconsistencies, mixed files, and missing documentation which made scaling difficult and created inefficiencies for both designers and developers.
Mission
Create a scalable, accessible design system that streamlined workflows, improved consistency, and supported the app’s long-term growth.
Solution
Audited existing styles and components to identify gaps and inconsistencies
Built a token-based Figma design system for colour, typography, and spacing
Designed an accessible component library with dark mode support and WCAG compliance
Published assets in Figma for easy reuse, cutting design time and improving alignment
Collaborated with developers to integrate the system into Storybook as a single source of truth
"The design system established a future-proof foundation for the student app, cutting design and development time, improving accessibility, and ensuring a consistent, reliable user experience for thousands of students. It also gave the university a scalable framework to support new features and long-term digital growth."
Tom Middleton | Head of UX
Impact
The design system established a future-proof foundation for the student app, cutting design and development time, improving accessibility, and ensuring a consistent, reliable user experience for thousands of students. It also gave the university a scalable framework to support new features and long-term digital growth.
Back to work