O design system da Livelo (parte 2)
Superando os desafios e impulsionando resultados
Este artigo faz parte da nossa série sobre o design system. Se você perdeu, dê uma olhada no artigo anterior para entender como o nosso design system está organizado atualmente.
Em um mercado tão competitivo quanto o atual, é desafiador entregar uma boa experiência do usuário, principalmente para produtos digitais. A tarefa fica mais complexa dado um cenário com diversas tecnologias, inúmeras linguagens e dezenas de equipes atuando em vários projetos simultaneamente. Um DS (design system) bem estruturado pode ser de grande ajuda neste processo.
Um design system nada mais é do que um produto onde o cliente alvo é a própria empresa. Ele disponibiliza diretrizes sólidas e bibliotecas de componentes visuais reutilizáveis, que impactam positivamente na atuação e performance do time de design e desenvolvimento.
Ao invés de pensar em tudo do zero, os designers e desenvolvedores utilizam os componentes na hora de criar interfaces e jornadas completas, sobrando mais tempo para que se dediquem a avaliar as melhores experiências, garantindo também a consistência, escalabilidade e eficiência no desenvolvimento dos produtos digitais, com entregas mais rápidas e com custos reduzidos.
Desafios
Antes do design system, cada designer do time focava nas necessidades de sua squad, sem considerar a consistência da experiência com os outros produtos da Livelo, resultando em falta de padrões e jornadas inconsistentes.
O time de desenvolvimento também enfrentava problemas, já que a biblioteca usada na época (sem envolvimento de designers) não tinha documentação ou manutenção, além de não ser claro quem era o responsável pelo gerenciamento delas.
O primeiro passo para a construção de um design system consistente e eficaz foi a criação de um time de design e uma squad focados nesse projeto, e os passos seguintes foram mapear todos os fluxos já existentes nos canais web e app e organizar um inventário de todos os elementos utilizados.
A partir disso, priorizamos a construção e o desenvolvimento de componentes, já que ainda não tínhamos documentações e validação dos times que seriam os usuários, que poderia influenciar negativamente na adesão ao DS.
Pensando em todos esses desafios, decidimos focar em três pontos na evolução do projeto:
- Organização
Transformar um design system inicial em um projeto estruturado, com validação e documentação. - Acompanhamento e suporte
Criar processos para orientar e educar. - Engajamento e adesão
Engajar o time de design e toda a Livelo a aderir ao DS.
Vamos detalhar como usamos esses três pontos para superar os desafios que descrevemos acima.
Organização
Com um time de design relativamente grande, cada designer utilizava do seu repertório e experiências pessoais para desenvolver um projeto de design, o que comprometia a consistência e gerava jornadas diferentes para realizar a mesma função. Na parte de desenvolvimento acontecia a mesma coisa, com interfaces acumulando a mesma função e apresentando comportamentos diferentes.
Nosso objetivo era garantir a consistência visual e de comportamento entre as jornadas, sem limitar a criatividade do time. A partir do inventário de componentes, seguimos com a criação e reconstrução dos que apresentavam maior incidência, contando com a participação de todos os designers para validação antes do desenvolvimento, dando visibilidade do roadmap do design system, mitigando mudanças drásticas que impactariam seus projetos.
A inclusão de todos os designers do time nos processos de construção fez com que todos passassem a entender sua importância e se envolverem no desenvolvimento e aplicação, possibilitando também mapear os casos de uso de forma mais abrangente, identificando possíveis falhas e melhorando a qualidade dos componentes.
Acompanhamento e suporte
Como em todo produto digital, acompanhar sua utilização e dar suporte aos seus usuários é fundamental para a evolução, maior adesão e engajamento. Sem esse suporte, a tendência é que aconteçam erros recorrentes, obsolescência e perda de valor.
Após priorizarmos a entrega de componentes, nosso próximo passo foi criar as documentações, incluindo descrições, variações, boas práticas de design, orientações de uso e aplicação. Isso foi essencial para apoiar os times, passando até a fornecer suporte assíncrono para consultas sempre que se fizessem necessárias.
Em seguida, implementamos diversas iniciativas para identificarmos problemas e recebermos feedbacks com o objetivo de atuarmos com maior assertividade. As principais iniciativas implementadas foram talks semanais com o time de design, pesquisas, apresentações, ações de onboarding e até mesmo conversas informais.
Engajamento e adesão
Com o produto mais estruturado e documentado, começamos a perceber que o número de squads utilizando o sistema estava abaixo do esperado. Compreendemos que é complicado alterar os roadmaps para incluir a aplicação do design system nos projetos, mas para validar o que realmente poderia estar acontecendo, precisávamos entender o nosso “cliente”.
Junto ao time de research, realizamos uma pesquisa interna para entender como o nosso DS era percebido, e ficou claro que ainda estávamos distantes das squads e precisávamos melhorar a comunicação, disseminando o valor da utilização do produto.
Voltamos a olhar para fora do time de design, começamos a fazer apresentações para as squads, com o objetivo de mostrar os benefícios de seu uso, entre outras iniciativas para criar proximidade. Queríamos garantir que todas as equipes fossem ouvidas, criando um canal de contato para dúvidas e sugestões, facilitando a identificação de problemas e necessidades, além de agilizar o processo de evolução.
Conclusão
Nesses desafios, ficou evidente que construir um design system é muito mais fácil do que fazê-lo funcionar. O principal desafio foi fazer com que os vários times envolvidos entendessem sua importância e que, a médio e longo prazos, a economia de tempo e dinheiro certamente seria expressiva.
Para compartilhar um pouco do nosso aprendizado, deixamos aqui algumas dicas para os primeiros passos ao iniciar um projeto desse tipo:
- Envolva todas as equipes interessadas na construção do projeto;
- Comece com um design system pequeno e funcional;
- Priorize a documentação para promover o uso e evitar erros;
- Desenhe os processos e compartilhe com as equipes;
- Defina métricas de sucesso e acompanhe-as.
A partir das ações implementadas, conseguimos melhorar o engajamento, a adoção e o uso. Ainda temos muito o que melhorar e evoluir, a estrada é longa, e ter um time unido faz toda a diferença.
E sobre nosso time, muita gente incrível foi responsável por essa construção:
Design:
@Demian Magini, @Antonio Joelson e @João Rocha
Desenvolvimento:
@Maycon Garavelli, @Adams Alves e @Caio Furtado
Agilidade:
@Olívia Diniz
Qualidade:
@Cássio Benincá
Liderança Técnica:
@Felipe Fregulhia
