Overview
I collaborated with the design system team to define content guidelines and write clear documentation for Questrade’s design system. We started with the buttons component to set a foundation for future component documentation. Together, we reimagined how buttons worked visually, functionally, and semantically to improve consistency and usability across products and platforms. This work was part of a broader effort to create a scalable, refined design system.
Client: Questrade Year: 2023 |
Challenge
The existing button components were inconsistent across teams, leading to visual fragmentation, unclear UI patterns, and accessibility issues. There was no centralized documentation or guidance, and teams often created custom solutions that broke established design norms or confused users.
Process and collaboration
- Audited existing button usage across product experiences to identify inconsistencies in labeling and capitalization
- Led the effort to write microcopy guidelines for button labels, emphasizing clarity and user intent
Solutions
- Finalized all documentation on how to use the button component using a template in Figma
- Documented best practices for button microcopy (e.g. use of verbs, sentence case)
Outcome
- Button microcopy consistency across teams increased significantly after documentation was released
- The button component became a reference point for creating other scalable elements in the design system