Startups precisam de Design System?

Há uma resposta simples para essa pergunta: sim, as startups precisam de um Design System. No entanto, poderia-se argumentar que o foco de uma startup é validar o MVP o mais rápido possível, e investir em um Design System poderia ser visto como um esforço desnecessário. Claro, é preciso identificar o estágio em que a startup se encontra; se estiver em fase de validação, tendo a concordar com o argumento apresentado, mas em partes.

Veja, em uma startup que trabalhei eu achava também que o foco do meu esforço, deveria ser único e exclusivamente da validação do produto, mas na hora da entrega de alguns fluxos para a equipe de desenvolvimento começamos a perceber que havia uma dissonância visual nas interfaces apresentadas pelos diferentes designers o que ocasionava retrabalho.

Diante disso, e para mitigar as divergências visuais e aprimorar a qualidade das entregas aos desenvolvedores, inicialmente incorporamos no Definition of Done (D.o.D.) da equipe de designers a prática de revisar a padronização sempre que um fluxo ou interface fosse concluído. Era uma dinâmica semelhante ao Design Critique.

No início, essa abordagem teve o efeito desejado, mas percebemos que algumas entregas estavam atrasando devido à necessidade de validação de toda a equipe de design, tornando-se um gargalo. Começamos então, a abrir exceções no cumprimento do D.o.D., e os problemas de equidade visual e padronização de componentes ressurgiram.

Dessa forma, tornou-se necessário criar um artefato que pudesse alcançar a equidade visual que buscávamos. Assim, decidi focar em um Design System, mas era essencial que tivesse um impacto prático em um curto período de tempo. Iniciei então a construção do nosso Design System, baseando-o inicialmente nos princípios do Atomic Design.

Mas Caio, o que é Atomic Design?

O Atomic Design já é muito conhecido e muito difundido no mercado, mas apenas para relembrar, Atomic Design é uma metodologia de design de interfaces proposta por Brad Frost, onde os príncipios do Atomic Design são baseados na analogia com a estrutura da matéria, onde os elementos básicos são combinados para formar móleculas, organismos e assim por diante. Aqui estão os príncipios do Atomic Design.

• Átomos: Elementos básicos e indivisíveis da interface, como botões e ícones.
• Moléculas: Combinações simples de átomos que funcionam juntos, como um campo de texto com um botão.
• Organismos: Componentes mais complexos formados pela combinação de moléculas e/ou átomos, representando seções reutilizáveis da interface.
• Templates: Estruturas que organizam organismos em layouts específicos, definindo a estrutura da página ou do componente.
• Páginas: Implementações finais do design, onde os templates são preenchidos com conteúdo real, resultando em interfaces interativas e completas.

E então, deu certo?

Certamente. Reservei uma sprint para realizar esta primeira rodada do Design System e, além de aprimorar consideravelmente as entregas da equipe de design, economizamos tempo evitando retrabalhos durante a construção da interface, bastando reaproveitar os átomos, moléculas, organismos ou templates já prontos.

A startup onde você trabalha está em fase de validação? Não repita o mesmo erro que eu cometi. Desde o princípio, defenda a criação do seu Design System ou, no mínimo, de seu embrião, utilizando os princípios do Atomic Design. Em primeiro lugar, isso simplificará o trabalho de toda a equipe. Em segundo lugar, e mais importante, economizará o tempo de todos os designers, permitindo que o foco esteja verdadeiramente na validação do seu produto.