Unifying Systems Across All Platforms
Design System
Foundation Library
Unifying Systems Across All Platforms
When I joined GoPro, it didn’t take long to identify the issues in the design system—multiple, scattered design systems that were neither consistent nor complete, and a lack of a bridge between design and development. Rather than settle for the status quo, I set out to build a unified, scalable design system that would serve not just designers but the entire product and engineering ecosystem across all OS platforms.
Client
GoPro
Timeframe
2023-2025
Project Type
Design System
Role
Lead UX/UI Designer
Foundation Library
Overview
GoPro's software team was operating with fragmented design assets spread across three separate libraries. None were aligned—naming conventions were inconsistent, collaboration between design and development was strained, and redundant components were rampant.
As a UX Designer, I led the effort to audit, realign, and rebuild the design system from the ground up. I collaborated directly with both Android and iOS front-end developers to ensure consistency across platforms, naming conventions, and workflows. This foundational work led to the creation of the GoPro Design System: Foundation Library.
Foundation Library
The Challenge
With three competing libraries, design decisions were being made in silos, leading to inconsistencies in UI, user experience, and engineering implementation. There was no single source of truth.
Designers and developers were speaking different languages. Asset names differed by platform, icons were duplicated or outdated, and code handoff was error-prone. There was no streamlined process to support scalability or collaboration.
Foundation Library
The Solution
I initiated a full audit of existing design elements, starting with icons and typography. We eliminated duplicates, outdated assets, and inconsistent patterns. From there, we introduced a naming convention shared by designers and developers, enabling 1:1 asset handoff across platforms.
Design Systems UX/UI Digital Research + Insight
I worked with the Android and iOS teams to generate 821 shared icons across platforms from Figma, resulting in 16k lines of Android code and eliminating redundant manual work. I also implemented a typographic scale using the major second scale system, which brought order to the chaotic font sizing across the app.
Foundation Library
Foundation Library
Performance Results
Through the creation of a unified design system, we reduced the icon count by 27% by eliminating duplicates and unused assets, generated over 16,000 lines of Android code directly from Figma, and implemented a shared naming convention across iOS, Android, and Web. These changes not only improved consistency and cross-team collaboration but also reduced the space required on camera hardware, resulting in noticeable performance gains.
New icon library
Generated from Figma assets
Shared across 3 platforms
The project didn’t just improve the product—it improved the process. Communication between design and engineering became smoother, onboarding new team members became easier, and the Design System Foundation Library set the stage for the Component Library, which was well underway before my departure.
