PixelHub
InícioA oficinaBibliotecasO que o time ganhaDepoimentos
Biblioteca de componentes

O que o time ganha

O que muda no dia a dia de quem desenha e de quem programa.

Equipe reunida em volta de uma tela com a lista de componentes

A peça já existe

Antes de desenhar, a pessoa procura na lista e quase sempre acha.

A cor tem endereço

Trocar um tom deixa de ser caçada por arquivos espalhados.

O erro é sempre igual

Uma regra de mensagem vale para o formulário inteiro do produto.

A conversa encurta

Design e desenvolvimento passam a chamar a mesma peça pelo mesmo nome.

O celular vem junto

Cada componente nasce com comportamento nas duas larguras.

Quem chega se vira

A documentação e o vídeo de repasse encurtam a entrada do time novo.

Como a biblioteca nasce

Oito decisões que transformam um monte de telas em sistema

Sistema de design não começa por arquivo bonito: começa por contagem. No último inventário que fizemos apareceram onze alturas de botão e sete cinzas diferentes num produto de quatro telas.

01

Contar o que existe

Toda peça repetida entra numa lista com a tela onde aparece.

02

Um nome por peça

Nome curto, em português, escolhido junto com quem programa.

03

Escala de espaço

Uma régua de oito passos encerra a discussão de margem.

04

Cor com função

Cada tom ganha um papel: aviso, erro, apoio, fundo.

05

Texto em degraus

Cinco tamanhos de texto, nenhum improvisado no meio da tela.

06

Estado por peça

Foco, erro, desativado e carregando desenhados uma vez só.

07

Regra escrita

Quando usar e quando não usar, em duas linhas por peça.

08

Mesmo nome no código

O componente do repositório e o do arquivo se chamam igual.

Quantos botões diferentes existem no seu produto hoje?

Quase ninguém sabe responder de cabeça. O inventário responde em duas semanas, com a lista de conflitos em ordem de incômodo.