Workshop — How to prioritize your design system components
This year, I’ve worked on several design systems and I’ve learned a lot about how to get started and the mistakes to avoid…
Today, we’re going to talk about prioritization!
Let’s say you’ve just started your design system. You’ve already set the list of the main components of your system and probably already put them into a sketch library. But now, you need to start building your system in code and you don’t really know which component you should develop first…
In order to prioritize the first components you need to develop, we’ve imagined (and tested of course) a workshop that I think is pretty relevant to start your backlog: the components prioritization workshop.
Goal
Map all the components of your system and understand which ones are used in most projects and which ones are quick to develop.
Timing: 1:30
People you need to invite: designers, developers and product owners from your design system team and your pilot projects. 1 facilitator.
Material needed
- A whiteboard
- Black markers
- A printed version of all your system’s components
- 3 drawing version of the diagram
- Sticky notes
- Pens & paper
Preparation
Before the workshop, prepare the room. Print all the components of your system with their name, display them on a wall and make sure they will be accessible to everyone, at any time.
Steps
- Make 3 multi-profiles and multi-projects groups and distribute one drawing diagram for each.
- Each group needs to discuss where to place the components on the diagram: the most used and easy to develop at the bottom left corner and the rare and difficult to develop on the top right corner (45 min).
- Display every diagram next to each other and draw a big diagram on the whiteboard. The facilitator takes each component and places it on the final diagram, trying to understand the differences between each group.
For example: “why group A considers this component as “complex to develop” while group B puts it into the “simple to develop” part of the diagram?” (45 min).
At the end of this workshop, all the components that are on the “P1” zone will be developed first. Then, the “P2” and “P3” zone will follow. Components that are very rare and specific to one product should never be part of the system but they may be developed only for one specific project.
If you have a lot of components in the “P1” zone, you can organise a vote to keep only the 10 favourite ones of the teams.
Tips
- At the beginning of the workshop, define with your developers what “simple” and “complex” means. For example, you can say that “simple” take less than 3 days of development while “complex” takes more than 6 days.
- For this exercise, select the basic components of your system (such as buttons, forms elements, navigation…) but don’t forget also the components that are unique to your business and your needs (For example, a TV program card for a TV program app!).
- Prepare some sticky notes where you can write the names of your components so that the participants will not have to do it during the workshop. This will save you a lot of time for what’s next.
- Keep some blank sticky notes and encourage the participants to write down any missing components.
- At the end of the workshop, set a date for the first development sprint and talk about the next steps.
This exercise can be run regularly, in order to check if the prioritization is still valid (for example, when new projects join the system).
And by the way, we wrote a whole book on design systems that you can download on the link below:
