Diário Dev7: Por que decidi criar meu próprio design system?
Source: Dev.to
Por que decidi criar meu próprio design system?
Essa provavelmente será a última postagem do ano. Em vez de fazer uma retrospectiva do projeto, quero aproveitar para apresentar algo novo!
O ponto de partida
Enquanto mostrava os mockups para um amigo desenvolvedor, ele comentou ao ver uma página no Figma cheia de componentes e variações:
“Nossa, parece que você está fazendo um design system.”
A frase ficou na minha cabeça. Já havia trabalhado em empresas que criavam seus próprios design systems, mas nunca atuei diretamente no time que os mantinha; eu apenas consumia os componentes e seguia as guidelines.
Decisão de criar os componentes do zero
Algumas escolhas foram motivadas pelo meu desenvolvimento pessoal. Decidi, portanto, criar os componentes do zero, mesmo sabendo que isso tornaria o projeto mais demorado. Não imaginava que levaria tanto tempo, mas a experiência tem sido valiosa.
Design system vs. biblioteca de UI
Pesquisei sobre design systems e percebi as diferenças em relação a bibliotecas de componentes de UI:
| Aspecto | Biblioteca de UI | Design System |
|---|---|---|
| Escopo | Conjunto de componentes reutilizáveis (botões, cards, modais, formulários, etc.) | Biblioteca + diretrizes de consistência, design tokens (cores, espaçamentos) + documentação extensa |
| Objetivo | Facilitar a construção de interfaces | Garantir coerência visual e de código em todo o produto |
No contexto do meu projeto, o MoldeKit começará como uma biblioteca, mas à medida que evoluir poderá se tornar um design system completo.
Estratégia para o MoldeKit
- Fase inicial – O MoldeKit conterá apenas os componentes necessários para suportar a interface do projeto Mangos.
- Expansão – Conforme eu finalizar os componentes que pretendo usar no Mangos, eles serão disponibilizados no MoldeKit.
- Reuso – Quando iniciar um novo projeto, já terei meus próprios componentes prontos, agilizando o desenvolvimento.
Estado atual e próximos passos
Estou animado e um pouco apreensivo, pois é a primeira vez que crio algo assim. O objetivo não é uso em produção, mas sim um portfólio que demonstra meu conhecimento e promove meu desenvolvimento pessoal, conforme deixado claro na documentação do projeto.
Links úteis
- Repositório do MoldeKit: https://github.com/usuario/moldekit
- Storybook do projeto: https://moldekit-storybook.netlify.app
Contribuições são bem‑vindas!