Entender o nome é o começo.
Escolher bem vem depois.
Guias práticos para conectar componentes, comportamento e acessibilidade às decisões do seu projeto.
Modal, drawer ou popover?
Escolha a superfície pela tarefa, pelo contexto e pelo quanto ela precisa interromper a navegação.
Ler o guia →02 / FeedbackToast, alerta, banner ou callout?
Nem toda mensagem precisa interromper. Relacione duração, urgência e alcance ao componente certo.
Ler o guia →03 / FormuláriosCheckbox, radio ou switch?
A diferença está no modelo de escolha e no momento em que a mudança é aplicada.
Ler o guia →04 / ComportamentoOs estados que toda tela precisa considerar
O caminho feliz é só uma parte da experiência. Planeje vazio, espera, falha, sucesso e recuperação.
Ler o guia →05 / AcessibilidadeAcessibilidade para quem está começando
Uma revisão prática de teclado, foco, rótulos, contraste e movimento — sem tratar uma lista como certificação.
Ler o guia →06 / IA e designComo pedir uma interface para uma IA
Transforme “faz uma telinha bonita” em um pedido com objetivo, estrutura, estados e critérios verificáveis.
Ler o guia →07 / LayoutResponsivo vai além de empilhar colunas
Adapte conteúdo, navegação e controles ao espaço disponível, sem perder o objetivo da tarefa.
Ler o guia →08 / FundamentosComponente, estilo ou sistema de design?
Entenda o que cada termo descreve para combinar referências sem misturar função, aparência e regras.
Ler o guia →09 / FundamentosGlossário essencial: do hover ao breakpoint
As palavras que aparecem nas conversas de design e desenvolvimento, explicadas sem complicação.
Ler o guia →10 / DadosTabela, cartão ou gráfico?
Escolha a representação que responde à pergunta da pessoa, em vez de começar pelo formato mais chamativo.
Ler o guia →