Empresa

Revelo

Projeto

Design System

Contexto /

Documentar e manter uma biblioteca de componentes de UI compacta, porém flexível, focando em componentes de fundação, com a intenção de diminuir o número de componentes de uso único ou “locais” dentro dos times a qual o Design System servia.

Família de componentes

Documentação /

Padrão de documentação no Figma

Os componentes foram documentados e centralizados em uma única biblioteca do Figma, seguindo o mesmo checklist de fatores a serem levados em consideração durante o processo de documentação:

Do’s & Don’ts - Boas práticas sobre como utilizar (e não utilizar) os componentes
Anatomy - Todos os elementos visuais dos componentes, com suas funções semânticas descritas
Hierarchy - As variações hierarquicas dos componentes (quando aplicável), por exemplo: Primário, Secundário e Terciário
Variants - As variações de conteúdo e tamanho dos componentes.
Interactions - Os estados de interação dos componentes: Static, Hover, Pressed, etc
Components - Os componentes reutilizáveis que alimentam a biblioteca que os Designers usam diretamente em seus arquivos.
Testing - Área os onde os compontes atômicos são usados em casos reais de aplicação.
Changelog - Registro das mudanças e ajustes feitas nos componentes e em sua documentação ao longo do tempo.

Design Ops /

Organização e normas de nomenclatura

Para padronizar os múltiplos padrões de arquivo que existiam, um sistema de nomenclatura foi criado para organizar os arquivos existentes, e com outros designers colaborando e fazendo a manutenção dos arquivos, garantir que o projeto do Design System tivesse um crescimento e documentação escalável e organizado.