sortera-design-system v1.0.34

Introduction

TODO: Give a short introduction of your project. Let this section explain the objectives or the motivation behind this project.

Getting Started

TODO: Guide users through getting your code up and running on their own system. In this section you can talk about:

🗄 Work Routine from design to implementation

This design system board is used to create understanding on when new additions or updates are made to the design system. The design system board is supposed to help design and development with a process to maintain an up to date connection between code and creation.

To start with, the routine include components.

Every component is a ‘feature’ in Azure DevOps. The name of the component is always identical to the component in Figma. All updates made to a component results in a sub-task of the feature in Azure DevOps. Changes in Figma are overwritten directly in the component.

🪜 Steps

1. An addition or update to a component is suggested
2. The addition or update is designed in Figma. When needed, discussion of the update happen in this step
3. When the design is ready for implementation, the component is moved to ‘TODO’ in both Azure DevOps and Figma.
4. A sub-task is created in the Azure DevOps feature, describing the update.
5. When the sub-task is documented, a comment is made in the Azure DevOps feature telling the entire team that the update is available as the sub-task.
6. When a developer is working on the implementation of the update, the entire feature is moved to ‘In progress’. Any major changes in the suggested update is discussed between colleagues and documented in comments in the sub-task in Azure DevOps if needed.
7. When the developer and designer agrees that the coded update (or new component) is up to date with the design the state of the sub-task is changed to ‘To Do’.
8. The feature in Azure DevOps and the component in Figma are both moved to ‘Implemented’ in the design system board.

🤿 Swimlanes

The design system board uses three swimlanes to assist the states of the components. The current swimlanes:

• TODO
• In progress
• Implemented

The swimlanes need to be synced in Figma and in Azure DevOps at all time.

🏊‍♀️ TODO (Right now TODO is called Approved)

• ⭕️ When an addition or update is made to a component, the component feature (in Azure DevOps) and component design (in Figma) is moved to TODO.

🏊 In progress (right now In progress is called Commited)

• 🔘 When a component is under development.

🏊‍♂️ Implemented (right now In progress is called Design Implemented)

When the component is synced between Azure DevOps, Figma and implementation.

• 🚨 Components in the Implemented swimlane are always ready for production.
• 🥅 The goal of the design system board is to always strive to have all components in this swimlane as much as possible.