Bootcamp de design system da Meiuca

Henrique Peixe
Hub de Design TOTVS
5 min readMay 15, 2019

Só para rolar um alinhamento de expectativas… não vou falar o que eles falam lá ou como é um design system, mas como foi minha experiência com a Meiuca, mais especificamente o impacto para o Peixe (eu na terceira pessoa).

Foram 5 dias focados no assunto, além de abordarmos N pautas sobre design e seres humanos que me surpreenderam positivamente.

Pronto, terreno preparado… agora vou focar nas coisas que o Peixe vai levar pra vida (além do tema em si do bootcamp):

A relevância do design

Primeiramente, tenho um problema em me concentrar por muito tempo num único assunto, mas aprendi a lidar com isso da seguinte forma: eu fico de ouvido enquanto escrevo e desenho tudo o que ouço. Dito isso, qual a primeira coisa que vi ao chegar na mesa que seria minha base de estudo na Meiuca? Um caderninho maneiro demais, que me guiou a escrever esse texto aqui.

O caderninho é um dos golaços do pessoal da Meiuca (com licença para uso do termo, Thiago).

A história da Meiuca é um mundo a parte. O papo começou com um app para índios e terminou com seguinte a frase:

"Design é fazer a diferença"

Pensa bem nessa frase e o quanto isso é relevante.

Esses dias, numa discussão no trabalho perguntaram algo como: Como você explica sua profissão para uma pessoa leiga no assunto design? E uma das definições que chegamos em conjunto foi: Impactar positivamente a vida das pessoas.

Olha que legal, né? Vai na mesma linha de pensamento. 🤔

As expectativas, o meio e o fim

Se não rolar um alinhamento de expectativas um dos lados sairá machucado.

Ao alinharmos a expectativa do que seria abordado no bootcamp foi dito que não veríamos especificamente uma ferramenta ou outra, e aí ficou ainda mais claro que a tecnologia é "um meio" e não "o fim". Ou seja, não importa se você utiliza Figma ou se prefere Sketch+Zeplin, a ferramenta não faz um design system (ou seja lá o produto que você trabalha). Sem o alinhamento de mindset a coisa não anda.

Ah! Design system é um produto, não um projeto (nota mental pessoal). 🧠

Designers discutindo a semântica da coisa

Aqui só um dos desenhos que fiz.

Coisa importante e muito nova para nós designers; tratar da semântica é lidar com lógica e não padrões, são gatilhos para melhor entendimento das pessoas que vão lidar com tal produto. Precisamos aprender tanta coisa com nossos amigos devs.

E onde a semântica entra? Na identificação dos componentes que definimos ao longo do desenvolvimento do design system, mas que conseguimos por em prática já em nossas camadas do Sketch, Figma, Photoshop, ou seja lá qual for a ferramenta que venhamos a utilizar.

Tratar o wireframe com modelo semântico faz muito mais sentido para um produto digital. Certo, pessoal?

Ao invés de utilizar o desenho de caixas e linhas numa folha de papel, podemos facilitar a vida dos devs trabalhando em um modelo semântico de wireframe. Isso mesmo: Heading big, aí você põe um line height mid entre ele e o body text small.

Conseguiu realizar isso na cabeça enquanto você lia? Essa é a ideia.

O que é system e o que é atomic

I'm not atomic…
I'm a mothafocka design system!

Gente, eu gosto do conceito atômico para design, até me ajudou no melhor entendimento do que é o design system, mas uma coisa é uma coisa e outra coisa é outra coisa. É muito importante fazermos esse exercício de separar o conceito na cabeça, então não entre no assunto design system sem deixar atomic design no cantinho.

O primo do DevOps

Retrato do Paulo que falou muito (e bem demais) sobre design system ops e acessibilidade.

E para fechar a semana… eu não ia perder o fechamento nem a pau. O assunto design ops me interessa muito! Mas lógico, o universo funciona de uma forma engraçada e o ônibus que me levava para a Meiuca no último dia quebrou a duas quadras do meu trabalho. Esperei o próximo, muito trânsito envolvido, para ganhar tempo peguei uma Yellow e ganhei aquele tempo que tinha perdido. Atrasei só 10 ~charmosos~ minutos.

Após uma entrada triunfal e sem ar, deu para entender o quanto o papel de design system ops trabalha no âmbito político. Se o relacionamento profissional é importante no dia a dia de qualquer pessoa que trabalha imagina para alguém nessa posição estratégica de decisão, afinal é um conjunto de governança entre processos, pessoas e ferramentas. 🔧

As coisas que aprendi (e escrevi) não foram por acaso

Falei que não ia falar sobre design system e falei um monte. Lide com esse plot twist.

Mudança de cultura é uma grande construção.

E aqui abaixo um foco na segunda página da foto de cima.

A foto da galera ficou ótima, então fiz esse desenho aqui pra fechar o caderninho. :)

Resumão final, conheci pessoas ótimas e a troca de conhecimento foi muito importante para entender cada vez mais a importância da minha profissão, além de colocar nos trilhos o planejamento que almejo para minha carreira. E quase zerei o caderninho em uma semana de tanto conteúdo, hehehe.

Se design não for sobre fazer a diferença, é sobre o quê? (Roubei essa foto do mppagano que peguei na internet, pois fui um cabeção e não tirei essa foto.)

Obrigado pela conversa e escovem os dentes, galera! 🤙

--

--

Henrique Peixe
Hub de Design TOTVS

Designer de contextos complexos. / Complex contexts’s designer.