Design systems have become a hot-topic as of late. Designers have always been using principles to design consistently and systematically, but actual assets used to be organised and collections of styles or style guides, and processes weren’t codified. Now, with design systems, everything fits neatly under an organisational umbrella. Styles and foundations, atomic component libraries and ways of working can all be placed within an architectonic structure: an organisation’s design system.
This shift has led to forward-thinking businesses hiring design systems designers, or even entire teams dedicated to the creation and maintenance of a design system.
But what about the less mature companies? How should they move up that design system maturity scale?
Well, let me introduce to a tool I’ve been creating over the last few months. It’s called the design system canvas.
The design system canvas is a one-page tool to help designers champion the value of design systems in organisations.
The DS Canvas is a tool that helps teams create an effective design system by providing an overview of the entire process and framework used to build, maintain, and integrate the design system among an organisation.
It’s valuable at any point of the process: if there’s an existing design system, or if no work has been started yet.
It’s most useful if there exists an early version of a design system (a proto-design system), maybe comprised of a list of styles of a few structured components. The canvas encourages teams to analyse their current set of assets and processes, making sure these get folded into the overall design system.
It also helps teams to get stakeholder buy-in on the overall design system, from initial concept creation to development and beyond.
Product designers can use the DS canvas to advocate for the creation of or scaling up of a design system.
If there are design systems designers already in place at the organisation, they can use the DS canvas to advocate for investment in the design system.
Product managers can use the DS canvas helps to ensure all stakeholders are on the same page and moving in the same direction, and provides a structure for documenting and understanding the value of a design system.
Print out the canvas, ideally A1 size, or open it up in FigJam or Miro if you’re working remotely. Set aside 30–40 minutes, and get everyone in the room who needs to be in the rooms: all designers, PMs, and developers who’ll be affected by the implementation of a design system.
Start in the top left and follow the numbering, ending in the bottom right.
The canvas starts by assessing where you currently are. Using that, you can plot where you are on a maturity model. This shows you how far you can go, and helps you decide what new assets and artefacts need to be created, and what the benefits are. Next it looks at people: DS consumers, maintainers and champions, and ends by looking at the adoption strategy and the cost of implementation.
Download it for free as a PDF or PNG from https://designsystemcanvas.com. You can also open it directly in FigJam!
Thanks for reading! Read more articles tagged Design, or check out everything.