Os Princípios do Design System da TOTVS

Henrique Peixe
Hub de Design TOTVS
4 min readOct 28, 2020
Três emoticons na cor amarela: uma mão em punho, mãos se cumprimentando e uma mão escrevendo com uma caneta.

Sim, a TOTVS está trabalhando em um design system. Seu nome é PODS, ou PO Design System. O prazer é nosso!

O PODS é feito…

✊ Para ser acessível e inclusivo

De pessoas para pessoas: o PODS tem a responsabilidade de garantir que suas aplicações sejam acessíveis e inclusivas desde a pesquisa dos componentes, passando pelo desenvolvimento do código até a utilização do usuário final.

🤝 De forma colaborativa e consistente

De todos para todos: o PODS é concebido para ser um design system totalmente com código aberto (open source), ou seja, desenvolvido de forma padronizada, consistente e abrangente o suficiente para atender as necessidades dos usuários dos mais variados segmentos corporativos.

✍️ Para impulsionar negócios

Das empresas aos clientes: o PODS tem o foco de suas decisões de design na utilização dos componentes em aplicações de negócios do mercado corporativo, com o intuito de gerar alta produtividade aos times de desenvolvimento e, aos designers, prover maior tempo de pesquisa com os usuários de suas soluções, tirando de sua jornada qualquer decisão relacionada aos componentes.

E para que serve os princípios de design?

De forma resumida, os princípios de design direcionam as decisões de design do time envolvido na criação, divulgação, capacitação, manutenção, evolução e suporte, ou seja, a equipe de design system ops.

E quando falamos em decisões de design, queremos dizer: priorização de backlog, pesquisa de mercado (benchmark), cores, formatos, direcionamento estratégico (roadmap), estados de interação, testes de usabilidade, aplicação dos comportamentos e por aí vai.

O legal na utilização de princípios de design é que, além de direcionar os nossos esforços, servem como histórico da evolução da maturidade do DS. Por exemplo, podemos revisitar periodicamente e entender se ainda faz sentido com o nosso propósito como produto, caso não faça mais sentido podemos atualizar e seguir nossa jornada.

Calma, calma… ainda é um daqueles casos que o DS está em fase de concepção, ainda temos que decidir muita coisa. Então, aqui vai o contexto de como chegamos a esses princípios.

Como chegamos nesses princípios

Primeiramente, o nome PODS (PO Design System) é uma herança do PO UI, a biblioteca instalável baseada em Angular que nasceu na TOTVS e se tornou open source. Além do nome, herdamos todos os aprendizados do gerenciamento desta biblioteca, seja com processos, nomenclaturas, estudos e criações de componentes, comunicação entre designers e devs desse produto que é UX Friendly desde sua primeira versão. E mesmo assim, o desenvolvimento do design system será independente do que foi utilizado no PO UI, pois por estratégia de implementação serão equipes diferentes no momento inicial, sendo que nossos produtos se complementarão num futuro (tomara que próximo).

Ilustração de uma onça preta entre folhas com ornamentos em tons de rosa.
Nosso mascote é uma onça preta (ou onça pintada com melanismo).

E como falamos sobre a herança do nome, aqui vai uma breve explicação.

PO significa Panthera Onca (nome científico do latim) ou Onça Pintada do PT-BR (português do Brasil). Tínhamos a hipótese que o trocadilho funcionaria e realmente é um nome que pegou.

Enfim, tem muito o que se falar sobre esse assunto, mas vamos focar na concepção dos princípios.

Nossa jornada até os princípios

Na criação dos componentes do PO UI não tínhamos "regras" ou algo que direcionasse nossas decisões de design, tanto que algumas das difíceis decisões ainda são tomadas diretamente pelo time de desenvolvimento responsável pela biblioteca, não que seja algo errado, mas na camada de design, sentíamos que muitos direcionamentos eram tomados sem um propósito claro, ou seja, muito de nossos esforços era direcionado pela "percepção" do time.

Então, aqui temos uma polêmica?

Mais ou menos, usar a "intuição" para certas tomadas de decisão num ambiente controlado e que se tem acompanhamento de perto talvez não seja tão ruim, como Joe Gebbia relata na entrevista sobre Papéis Criativos e Intuição no livro Do Design Thinking ao Design Doing do Jon Kolko, ele utilizou de "intuição" (nascida de sua vivência e de seus sócios) para continuar apostando em sua startup, mesmo quando seus dados diziam o contrário. Pois é, e estamos falando do AirBnb.

De qualquer forma… a etapa de design era custoso para as pessoas envolvidas, pois não tínhamos um direcionamento claro dos componentes, não éramos alinhados as necessidades da empresa. Era aí que morava a maior dor.

Como podíamos resolver esse problema?

Após alguns treinamentos e muita pesquisa sobre o que é um design system e quais os benefícios de sua implementação, realizamos uma pesquisa em equipe a partir de hipóteses para aprofundar o assunto e visualizar sua real aplicação na TOTVS.

A partir daí, para criarmos os princípios (que já contamos para vocês) realizamos workshops de ideação com pessoas interessadas no assunto (stakeholders) e validamos com usuários utilizando ordenação de cartas (card sorting).

E aí? Qual a sua percepção sobre os princípios de design? Ou conta pra gente se fez sentido todo esse papo.

Nos vemos por aí, pessoal!

--

--

Henrique Peixe
Hub de Design TOTVS

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