TOPAZ Design System
Designed scalable components for high-stakes workflows at Pearson VUE
ROLE: Designed and refined core components, defined interaction states, collaborated closely with developers, and maintained system consistency through versioning and fixes.
TIMELINE: 12 weeks · Jun to Aug 2025
TEAM: Collaborated with a Senior Product Manager
Beyond Screens
Designing for an Ecosystem Bigger Than Any One Screen
At Pearson VUE, I contributed to TOPAZ, a design system powering internal tools like scheduling, approvals, and administrative dashboards. These systems handle high-volume, high-stakes data, where small interaction failures can impact real workflows.
Designing for Real-World Systems
This meant designing for stability and predictability, while ensuring components scale across products, handle edge cases gracefully, and remain reusable over time.
Tree Component
Users needed to navigate deeply nested structures without losing context, so I designed a hierarchical tree component with expandable and collapsible nodes, clear selection states, and multiple visual variants. This approach helped structure complex navigation and reduce cognitive load, resulting in improved usability in dense data environments and a reusable pattern that could be applied across multiple tools.
Editable Table Component
Users were managing large datasets with frequent edits, but existing patterns were slow and error-prone. I designed an inline editable table with multi-cell editing, real-time validation, and controlled save behavior to keep users in flow and reduce errors. This improved clarity in data-heavy tasks and created a reusable, consistent pattern across workflows.
Time Picker
Scheduling flows required precise time selection, but varying formats often caused confusion. I designed a flexible time picker supporting both 12-hour and 24-hour formats with clear selection states and predictable behavior. This improved consistency across scheduling experiences and reduced ambiguity in time inputs.
Behind the Work
Core Team
+3 more
Behind the Work
clock
Start time
1:00 AM
2:00 AM
3:00 AM
Start time
Start time
Developer
Update on hover state
Developer
Question on error behavior
Behind the Work
Support Tickets
Need to fix
In-progress
Resolved
Need to fix
In-progress
Resolved
System impact & What I learned
Improved consistency across internal tools
Reduced duplication in component design and development
Supported accessibility in critical workflows
Enabled faster implementation of new features
This project shifted my thinking from designing screens to designing scalable behaviors, reinforcing that design systems are not just component libraries but decision systems.