Freedom Design System
Na Havan a liberdade tecnológica é essencial para o negócio, por isso construímos e evoluímos nossa própria tecnologia. Esse recurso é que nos dá a agilidade para se adaptar as mudanças do mercado de varejo brasileiro. São diversas ferramentas para garantir o sucesso da operação e a inovação no negócio, entre a compra e a venda de cada produto existem inúmeros processos e tecnologias envolvidas.
Para garantir a excelência tecnológica necessária para encantar colaboradores e fornecedores, investimos em uma inteligência coletiva através de um design system.
Nesse contexto, como resultado do esforço de pessoas que querem melhores experiências para usuários e de uma liderança que acredita na excelência tecnológica, nasce o FreeDOM como ferramenta para garantir a qualidade de uso e velocidade de entrega dos sistemas de uso interno da Havan.
Hoje o FreeDOM design system é usado por mais de 300 profissionais de tecnologia, que compões o Havan Labs e impacta positivamente na qualidade de uso dos sistemas para os mais de 18.000 colaboradores espalhados por 175 lojas no Brasil.
Pilares do design system
Existem 4 pilares norteadores para o desenho e manutenção do FreeDOM DS. Isso não quer dizer que outras preocupações não são levadas em consideração, mas que estas são as prioridades na hora da tomada de decisão.
- Projetado para o complexo: Deve ser suporte para cenários desafiadores com atividades complexas e grandes quantidades de informação.
- Projetado para evolução: Deve ser focado em flexibilidade na realização de tarefas, atendendo usuários iniciantes, mas oferecendo recursos avançados para acelerar a produtividade dos usuários mais experientes.
- Projetado para o sucesso: Deve ser pensado com atenção dobrada para prevenir e recuperar erros e deslizes do usuário, garantindo o sucesso contínuo das operações.
- Projetado para o foco: Dever ser cuidadoso nos detalhes, pensado para gerenciar a atenção do usuário entre as tarefas do sistema e as operacionais.
Organização
O FreeDOM funciona com 4 principais fontes de informação sendo 3 delas bibliotecas de componentes.
Tokens: É fonte de verdade para as libs e conta com as definições base para qualquer componente (ex. Cores, espaçamentos, curva de borda);
Base lib: É uma biblioteca com componentes base, ou seja, não consomem outro componentes como dependência (ex. Botões, tags, checkbox);
Core lib: É a biblioteca com os componentes mais estruturados, e que dependem dos componentes base para sua composição (ex. Filtro, Data grid, Total cards);
Sup lib: É uma biblioteca com outros elementos que podem ser utilizados para compor os componentes ou em conjunto com componentes (ex. Ícones, Imagens, Ilustrações);
As bibliotecas são desenvolvidas em react e ficam localizadas em nossa CDN para uso dos colaboradores do Havan Labs. De forma espelhada as mesmas bibliotecas estão presentes em ambiente no figma e podem ser utilizadas por qualquer designer da organização.
Documentação
A documentação foi construída utilizando storybook e dividida em duas partes, a documentação de diretrizes para utilizar o design system e a documentação de componentes para auxiliar na aplicação dos componentes na interface.
Documentação de diretrizes:
- Princípios do FreeDOM (para manter a organização alinhada quanto as prioridades do sistema);
- Regras de aplicação para os tokens (para quando for necessário criar componentes ou atender um cenário não previsto);
- Organização da arquitetura dos componentes (para ajudar a encontrar e entender o funcionamento dos componentes);
- Guia de aplicação para sistemas (Para garantir a consistência em outros aspectos como texto, navegação, feedback);
Documentação de componentes:
- Declaração sobre o contexto que deve ser usado (quando usar);
- Previsão de outros cenários que não devem ser usados, com indicação do que deve ser usado;
- Utilização de hiperlinks para navegação rápida entre outros componentes relacionados;
- Dicas com exemplos de aplicações recomendadas, não recomendadas e exceções.
Próximos passos
O design system traz para o Havan Labs grandes poderes e grandes responsabilidades com o amadurecimento do produto, que faz seu primeiro aniversário no mês de Abril desse ano (2024).
Para os próximos passos estamos:
- Analisando o uso na mão do nosso usuário;
- Otimizando processos de governança;
- Criando novos componentes para atender outras necessidades;
- Replicando as bibliotecas para uso em Genexus.
Nosso foco é tornar o FreeDOM uma ferramenta cada vez mais eficaz para contribuir com nosso propósito de:
Garantir a excelência tecnológica e transformar ideias em soluções inovadoras que agregam valor ao nosso negócio e encantam clientes, colaboradores e fornecedores.
Leia também:
