Other documents:

📔 Getting Started 💡 Create components 📣 Modify component 📂 Deploy components 📝 Document component

In the world of design and development, the "Aqua DS" design system stands out as an invaluable tool for creating coherent and efficient digital products. Identifying the components within Aqua DS is essential to understanding how interfaces are built and how elements can be reused in different parts of the project. In this document, we will explore how to identify and use components in the Aqua DS design system.

Why Identify Components?

Identifying components in "Aqua DS" is key to achieving consistency and efficiency throughout the design and development process. By doing so:

• Ensures visual and functional consistency across all parts of the project.
• Speed up the development process, as pre-defined components can be reused instead of being designed and coded from scratch.
• Collaboration between designers and developers is encouraged, as both work with a common base of elements.

Steps for Identifying Components in Aqua DS

Review Documentation: Start by reviewing the Aqua DS documentation. This may include a style guide, component library and implementation examples. The documentation will provide an overview of the available elements.

Explore the Component Library: If "Aqua DS" has a component library in a tool such as Figma, explore this library to see what items are available. These components can range from buttons and cards to navigation elements and forms.

Analyze Examples: Review or look at examples of products or projects that have used "Aqua DS". See how the components have been implemented in these interfaces and how they contribute to consistency.

Identify Patterns: Identify repetitive design patterns in different parts of the project. These patterns may indicate the presence of reusable components. For example, if you see the same button style used in several sections, it is likely to be a component.

Consult with the Team: If you are part of a design or development team, consult with your peers for information on identified components and their proper use.

Refer to Documentation: Once you have identified the components, be sure to refer to the documentation to understand how they should be used. This may include design rules, recommended interactions, and technical details.

How to identify components, addons and patterns in figma ?

<aside> 💡 The quickest way to recognize if the element is an instance or a master element is by the purple color in the layer name.

</aside>