Design System: o primeiro passo para escalar o design do seu produto.

Falamos muito em escalar o negócio, mas será que o time de produto está preparado para todo esse growth?

— — — —

1º de muitos
Esse é apenas o primeiro de uma série de artigos, onde vamos contar como ajudamos times de produto a ganharem produtividade enquanto alcançam um controle mais rigoroso da qualidade, além de conseguir tempo para conhecer de verdade seu usuário e seu negócio.

— — — —

Virar um unicórnio não é um conto de fadas.

Crescer não é fácil

Implementar uma nova funcionalidade não deveria ser uma tortura; mudar um botão que converte mais deveria ser trabalho de segundos e ter tempo para resolver problemas que REALMENTE irão impactar o negócio não deveria ser um luxo. Não vamos nem falar na “missão impossível” de largar o caos do escritório e tirar o dia para ouvir quem usa nosso produto.

Crescer e se tornar um negócio bilionário virou o sonho de “10 a cada 10 empresas”, mas virar um unicórnio está longe de ser um conto de fadas. Todo esse growth traz muitas consequências e, nem todas, boas para seu produto.

Mas será que você está combatendo o problema da maneira correta?

Quando as inconsistências, a falta de qualidade e de produtividade surgem, a reação natural é contratar um batalhão. Depois separar em algumas frentes de trabalho (seja squads ou qualquer outro nome que você queira dar) e meter a mão na massa.

Será que é por aí?

Fake Agile

Prazos insatisfatórios podem ser muito bem disfarçados por uma falsa sensação de agilidade. Você já se perguntou se o seu time é realmente produtivo ou se dá passinhos de formiga de sprint em sprint?

Produtividade se vê pelo roadmap: o quanto seu produto evoluiu no último semestre? E no último trimestre? No último mês? Essa evolução foi realmente relevante ou apenas um amontoado de bugs corrigidos?

Evolução é diferente de ego

Um produto é um organismo vivo. Ele PRECISA evoluir. O problema está na linha muito tênue entre evolução e ego. A primeira faz o produto andar para frente, a segunda faz andar em círculos.

Quando é a hora de criar um novo padrão? De dar aquele tapa no visual de um botão? Essa é uma questão muito difícil, talvez só o bom senso possa responder. Mas não tenha dúvidas de que ela surge infinitamente mais quando não se tem padrões bem estabelecidos. Nessa situação, a primeira coisa que um designer deveria se perguntar: “é realmente necessário ou estou apenas alimentando meu gênio interior?”

Para criar um time de produto capaz de desenvolver em escala é fundamental trabalhar o mindset de todos, deixar claro seus papéis e fazer entenderem o que os torna “verdadeiramente geniais”.

— — — —

Spoiler 01: não é redesenhar um botão, eu garanto! ;)

— — — —

O tal do Design System

Lembra do Atomic Design? Uma lógica para se pensar do menor para o maior: átomos, moléculas e organismos. A quem use essa mesma abordagem com outras nomenclaturas: elementos, componentes e módulos. O importante é como projetar, não como você vai chamar.

Átomos, moléculas, organismos e templates.

Maravilha! Agora pense desenvolver cada uma dessas pecinhas isoladamente (HTML, CSS e o framework que você escolher, na Meiuca trabalhamos com React), instalar essa biblioteca em seu projeto e sair construindo telas a partir desses componentes já criados. Imaginou?

Nessa o time de produto ganha:

1. MUITO mais produtividade
Esqueça desenhar e codar tela por tela, imagine construí-las como quem brinca de lego. E com um pouco mais de maturidade, sem nem a necessidade de passar pelo Sketch. Pois é! O Airbnb já chegou lá de uma maneira fantástica e nós também estamos no caminho (falaremos disso em breve). \o/

Na prática, isso quer dizer um ganho surreal de produtividade, com tarefas que chegam a ser executadas em menos de 10% do tempo que seria necessário na forma tradicional. Uma verdadeira revolução no workflow do seu time!

2. Manutenção centralizada
Fazer pequenas correções e melhorias também passa a ser infinitamente mais fácil, já que ela acontece a partir da sua “biblioteca de componentes”. Mude nela, muda em todos os seus projetos ou produtos, em absolutamente TODAS as suas interfaces.

3. Times mais próximos
Criar e trabalhar com um Design System exige que o time de design e front-end fique ainda mais próximo, deixam de ser uma “esteira” onde um empurra o problema pro outro e passam a falar a mesma língua. Isso ajuda muito com o objetivo de escalar design, mas de quebra, acaba contribuindo para o engajamento da equipe. É o fim dos cabos de guerra! \o/

4. Redução das inconsistências 
Grande parte das inconsistências nasce da falta de padrão, o que é a base de um Design System. Logo… :) O reflexo dessa redução é uma menor curva de aprendizado para o usuário e uma interface com uma identidade mais clara, o que torna a experiência muito mais agradável e gera impacto positivo em uma série de métricas do seu produto.

Trabalhe como os grandes.

Trabalhe como os grandes (do mundo)

Lá fora (pra variar), os grandes nomes do mercado já estão alguns passinhos à frente quando o assunto é escalar design de produto. A IBM com o Carbon e o Trello com o Nachos são bons exemplos de Design System.

Segundo o The Design Genome Project, iniciativa do InVision para mapear como as maiores empresas do Vale estão trabalhando, 86% das entrevistadas já estão trabalhando com Design System.

E há ainda quem esteja BONS passos à frente. Hoje talvez o Airbnb seja a empresa de vanguarda no assunto. Pra se ter ideia do estágio que estão, já desenvolveram uma bela traquitana que mistura inteligência artificial com reconhecimento de imagem, capaz de identificar padrões do seu Design System a partir de um wireframe feito à mão e exportar uma tela codada. Isso, CO-DA-DA.

Duvida? Veja com seus próprios olhos.

— — — —

Spoiler 02: estamos desenvolvendo algo parecido na Meiuca para oferecer aos nossos clientes. Aguarde! :)

— — — —

Foque na cultura do seu time.

Só não esqueça de focar na cultura…

Padrão sem disciplina é inútil e burlável, ainda mais quando o jargão “não podemos engessar” está na ponta da língua. Por isso criamos processos que precisam ser seguidos e fiscalizados, para que com o tempo eles se tornem hábitos e naturalmente virem cultura.

Criar o mindset de escala em times cheios de vícios não é fácil! Em nosso processo de consultoria, encaramos o pilar de treinamento (onde implementamos os processos e todas as ferramentas para que ele aconteça) como algo fundamental. Sem isso, você corre o risco de seu Design System virar apenas uma biblioteca esquecida.

Por isso dizemos que para implementar um Design System é necessário criar todo um verdadeiro “ecossistema”. Aos pouquinhos, vamos dar dicas de como fazer isso acontecer! :)

— — —

Próximo artigo: “fazer com meu time ou terceirizar?”

Essa é uma decisão menos obvia do que parece. Passa por foco, curva de aprendizado, ROI e algumas outras coisinhas. O assunto vai longe, mas levantamos os principais pontos para você refletir nesse artigo aqui. :)

— — —

Já está planejando seu Design System? Comenta aí!

Ou se quiser bater um papo sobre o assunto: Facebook, Linkedin ou hassu@meiuca.design :)

Meetup Meiuca

Fique por dentro das discussões presenciais que teremos no nosso novo espaço! As vagas do Meetup Meiuca serão limitadas e iremos sempre lançar primeiro por e-mail. \o/