3/8

Design system documentation

City of Montréal

Documented Montréal's design system with clear UX guidance, increased adoption for internal teams and external suppliers.

Challenge

The City of Montréal runs dozens of digital services built by different internal departments and external suppliers. A design system already existed, but it was underused and needed clearer guidance to support consistent adoption.

My contribution

I structured and wrote practical documentation covering UX best practices, reusable components and accessibility guidelines, using examples, step-by-step guidance and clear dos and don'ts. The documentation connected design guidance with implementation through Figma and the existing component library.

Results

Internal departments and external suppliers began adopting the design system more consistently, supported by clearer guidance and reusable components.

Samples of the design system documentation

Design system available online at zeroheight

Buttons: primary and secondary, with their states
Text field: states and anatomy of a form element
Text field: placeholders, required fields and error messages
Info tiles: vertical and horizontal