# Introduction to Design Systems

A design system is a tool that allows teams to **establish patterns** in order to build digital products. These patterns are derived from a series of elements that are reused to achieve **consistency and time efficiencies**. The system is built to be **modular**, allowing elements to **scale** and support the most basic to complex functionalities (the same way the modular Billy shelf can be combined in very different ways to support different functionalities).

{% hint style="info" %}

#### A Digital System is a set of connected patterns and shared practices, coherently organised to serve the purpose of a digital product.

{% endhint %}

## Principles

A digital system creates a **common language** between the design and development teams, defining **rules** that that are grounded in a clear set of principles:

![](/files/-MO1py9b3rSJZ3JvMXBS)

Solutions should work for the smallest to largest projects and teams.

![](/files/-MO1ofMPQYsDVVpSwVbg)

Common patterns are what creates the time efficiencies and quality assurance.

![](/files/-MO1pplzQFLYcFU5B2lE)

Clear guide rails that enhance not limit growth and innovation.

![](/files/-MO1xWJwz2KkgCPAMZcD)

Decisions need to be made considering the company culture and digital ecosystem.

![](/files/-MO1kW-6yk_rw6jLRTNJ)

The use and performance of the system has to be tracked in detail in order to prove its value with real data.

## A scalable, dynamic tool

A digital system is flexible and continually evolves based on business objectives, user testing, industry trends and innovation. This is the main difference between a style guide and digital system—a digital system is scalable and dynamic. As opposed to handing off a style guide at a certain point in time, in digital systems, the collaboration between designers and developers is ongoing. To that point, we always recommend that a digital system be treated as an **ongoing** **product** instead of a fixed project within a company.&#x20;

**This tool is increasingly adopted by teams who support the agile methodology, allowing companies to build faster and save a lot of time and money.**

{% hint style="info" %}
We always recommend that a digital system be treated as an ongoing product instead of a fixed project within a company.
{% endhint %}

##

## What value does it add?

Using a digital system and its defined patterns ensures the **consistency** of products across all design and development teams, both internal and external.

| Patterns | <p>Internal Design/<br>Development teams</p> | <p>External Design/<br>Develpment Teams</p> |
| -------- | -------------------------------------------- | ------------------------------------------- |
| Brand    | ✔️                                           | ✔️                                          |
| UX       | ✔️                                           | ✔️                                          |
| UI       | ✔️                                           | ✔️                                          |
| Motion   | ✔️                                           | ✔️                                          |
| Front    | ✔️                                           | ✔️                                          |

This improves the user experience and significantly shortens **time to market** and **time to fix bugs.** Digital systems are essential for **scaling product efficiently** across teams and business units. And most importantly, all this means more time innovating and more **money saved.**

## Main benefits of having a Digital System

The most evident business benefit is efficiency—in time and money—but a digital system will help any organisation:

* Create time efficiencies
* Ensure accessibility
* Foster autonomy and speed
* Scale product
* Reduce risk
* Make data-driven decisions
* Onboard new members
* Innovate
* Manage the backlog
* Ensure product consistency
* Develop one common language


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://dsplaybook.farcostudio.com/pagina-1/what-is-a-digital-system.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
