Design Systems and Systems Design

What are the qualities of each role?

I’ve had several recruiters read my resumé about my experience in Design Systems and contact me about jobs. Only to find out they were hiring for people with Systems Design experience. I’ll be outlining what both topics are and help people understand the qualities of each.

Design Systems, Systems Design

Design Systems

An engineer who works on a design system typically has some interest in visual design and/or user experience. The engineer would be interested in colors, typography, spacing, and reusable components. They would also be interested in design tools like Sketch and Figma and how to integrate or enhance product design tools. Their work revolves around creating the building blocks that their peers can use to create interfaces and experiences quickly; keeping a consistent look and feel. They may also be responsible for coding features into components or creating the framework that allows the parts to be used easily by their peers.

These engineers are typically not developing apps or features nor are they often creating wireframes or flows, except when a smaller component has several states (eg. date-picker). However, it is common for these types of people to help their peers within feature teams integrate their deliverables into the larger system.

When this type of role didn’t exist, these engineers would liken themselves toward traditional frontend engineering roles. These roles might include:

Another resource on Design Systems:

Everything you Need to Know About Design Systems – Audrey HacqAn indepth write up about the fundamentals of any Design System.

About frontend

The definition of frontend (or front-end) has shifted over the years. Before JavaScript could run on the server-side; if you were a frontend developer you worked almost exclusively in web browser technologies. Your languages were HTML, CSS, and JavaScript. You hardly ever had to connect to a database or create an API.

Today, frontend developers are often required to be closer to what traditionally meant full stack. They are now not only responsible for the frontend (or user interface) but also serve that frontend, manage the state of the application, and connect to backend services. This is also why many of them do not have visual design experience or even CSS experience (a technology that is quintessentially frontend). They are now responsible for too much.

Personally, I wish the term frontend didn’t shift and instead we use JavaScript engineer to describe roles that use JavaScript on the browser and server as this more accurately describes what these engineers are doing.

More resources on this topic:

The Great DivideThe divide of those who self-identify as a front-end developer who have skill sets heavily revolved around JavaScript and others who skills sets are focused more on other areas of front-end .
Frontend Design, React, and a Bridge Over the Great Divide – Brad FrostWhere does Front end Designer sit in the great divide and how does this role work with React?

Systems Design

I’d like to first admit that I don’t identify myself as having systems design experience except that in my experience creating design systems, I often need to connect parts to create a larger system. This is the basis for the role of engineers with system design skills. These engineers are making decisions on how a database might connect to a server, how many load-balancers would be needed for web traffic, how to deploy code from a repository to different environments or perhaps as simple as creating an API for a component.

An engineer creating a system will be taking parts to create a greate whole. The process of deciding and moving the parts around is the design part of systems design. Deciding on which method to use to iterate over an array could be considered systems design (performance versus readability).
I don’t believe there are many roles that focus only on systems design except roles that include the word “architect”. As the name suggests, an architect designs the building, but other people follow the plans and build the structure. In the word of tech, architects are very senior engineers who create plans where junior engineers would learn and code using those plans.

More resources on Systems Design

System Design in Software Development – Didacus Odhiambo
What is the purpose of System Design and what types of elements are included?
Fundamentals of System Design – Vaibhav Aparimit
When designing systems, there are three primary concerns that should be addressed — reliability, scalability and maintainability and why they are important.

Takeaway

Design Systems is a focus that some designers, engineers, and other partners deliver to their peers in the form of guidelines, components, and other resources. Systems Design is a skill that engineers should possess when connecting different technologies together.

A person who creates the system in which designers and developers use the same resources and technologies could be called the system designer (ie. architect) of the company’s design system (ie. component library). However, a person working on a design system might not be the person creating it. They might just be adding to it or making changes. These might be people in the engineering roles listed above or designers, researchers, copywriters, and other partners. These are examples of people in design systems roles that are not systems designers.

I hope this helps people outside the community of design systems understand the usage of the design and systems better as it pertains to our work and focus.

This article was originally published on Donnie’s Medium page.

Senior UX Engineer at Compass | More on Donniedamato.info

Related Posts

→ Pour la version en Français, c’est par ici Design Systems has become a key part of my everyday work… And from the surrounding discussions, it is now the case for many people 😉 After reading Alla Kholmatova’s book last year, I was lucky to attend the first European conference on the subject in March. All of this strengthened my… Read More →

I recently created a case-study for my colleagues in New York about a multi-brand Design System project I worked on, for one of our clients back in London. While gathering information for this presentation, I was inspired to write an article and share my thoughts about what I’ve learned during this year-long experience and how it opened my eyes to… Read More →

It’s a practice of creating apps, sites, and products usable for everyone, including people with visual, motor, auditory, speech, or cognitive disabilities. Why should you support accessibility? You can impact someone’s life by making inclusive and easy-to-use products. One billion people have disabilities: your product can be used by them. Better accessibility support leads to better UX and cleaner code…. Read More →