Building a Design System? Start with a map

Carlos Yllobre
Prototypr
Published in
5 min readDec 10, 2019
Building a Design System? Start with a map

Building a system is not an easy task, but it is an enjoyable one. Discovering connections, creating new ones, improving the parts, and seeing the whole evolve in shape and purpose are some of the things that make it such an interesting project to work on.

In her incredible book, “Thinking in Systems”, Donella Meadows mentioned that there are 3 fundamental ideas that apply to a system: It’s pieces or stocks, the connections between these pieces and the purpose of the system.

This time, I will cover the first 2 ideas and share a successful way to identify the parts of a system and define and understand how they are connected. I am talking about building a design system map or system taxonomy.

Why a map?

“I wisely started with a map.” ― J.R.R. Tolkien

According to the Cambridge Dictionary, a map is a diagrammatic representation of an area of land or sea showing physical features, cities, roads, etc. If we abstract this concept a bit and bring it to the Design System arena, we can use it as a representation of the system itself, displaying information about it and allowing us to make better decisions when it comes to modifying, updating, and evolving our system.

The benefits and objectives of building a system map are covered under 3 main areas:

Understanding, Alignment and Optimisation

Understanding: Identifying the parts and their connections

A map provides us with a sense of location and a better understanding of where we are and where we want to go. Defining the landscape and its particularities are key to understanding the system itself. What are the smallest pieces? How many components and patterns do we have? How many elements can we identify? In the same way that we differentiate cities from forests or deserts and give them a different treatment, we need to define the parts of our system that are different and distinguish their characteristics.

Understanding: Identifying the Parts and their connections

Once we start mapping out, organizing, and defining all the different elements in our system, placing them on a map provides us with a view of the whole, allowing us to identify more easily the connections between the parts and how they interact with each other. Think of a family tree, where we can connect ourselves and close relatives to distant ones by reading the connections and links between the parts. Without this “view from above’’ granted by a system map, none of this would be possible.

Alignment: A shared language

Alignment: A shared Language

Identifying the parts is not just about organizing the different spaces in our system, but about classifying them properly. The first step to get alignment is to name things the same way.

Developing a shared language is critical to communication, communication is critical to collaboration, and collaboration is critical to business and education. Developing a shared language is an ongoing process that requires time, which results in better understanding. Having a map that serves as a guidance tool on where to find things and what to call them is critical to achieving alignment across individuals and teams in an organization.

Alignment: A primary source of truth

Alignment: A primary source of truth

Building a shared language and achieving alignment won’t be completed without incorporating these to all the parts and areas of our system. The way we organize our elements, information, tools, and process must always refer to our map, but we also need to remain flexible to adopt modifications and updates based on the needs of the system.

Every system will always have multiple sources of truth or data points. This is inevitable because we need different sources to serve different purposes and audiences. The problem is that when it comes to the alignment between these sources, we are missing a reference point, and choosing one over the others brings inconsistencies along the way.
A map provides us with that agnostic reference point which doesn’t respond to a specific need, tool, or audience but serves all of them.

Optimization: Spotting the ‘Points of Interest’

One of the most important benefits of building a well-defined map is to identify what needs to be updated and to keep track of the changes.

In my previous article, “The ABCD of System Thinking” I mentioned how important it is to find the ‘Points of Interest’ of our system. These are issues, bugs, broken links, areas, or elements that require our attention.
As I mentioned in my previous post, I like to think of this process as a layer we add to our map where we mark these points.

Optimization: Spotting the ‘Points of Interest’

By adding this layer, we are in a better position to create a backlog of tasks that we can then classify based on the level of complexity, the effort involved, etc.

Conclusion

From the first humans on Earth using the stars to place themselves in time and space to sailors, travelers, architects, and engineers, having a map has always been a must when it comes to obtaining a better understanding of ourselves and our surroundings and providing us with the necessary information and metrics to build complex structures, stories, and systems. Regardless of the purpose of your trip, the problem you are solving, or the type of system you are trying to build, starting with a map is always a good idea.

Thank you for reading! 😊

Free

Distraction-free reading. No ads.

Organize your knowledge with lists and highlights.

Tell your story. Find your audience.

Membership

Read member-only stories

Support writers you read most

Earn money for your writing

Listen to audio narrations

Read offline with the Medium app

Published in Prototypr

Prototyping, UX Design, Front-end Development and Beyond 👾 | ✍️ Write for us https://bit.ly/apply-prototypr

Written by Carlos Yllobre

Product Design Leader, systems thinker, illustrator, ukulele player, surfer, photographer, avid reader and occasional writer. 🇨🇺🇪🇸🇪🇺 www.carlyllo.com

Responses (5)

What are your thoughts?

I have no idea what you’re talking about.

--

And for gosh sake, make it accessible. The world absolutely, positively does NOT need more inaccessible design systems.

--

Nice article!

--