Nesse Design System da semana peguei um direto da terra da Rainha: o governo federal do Reino Unido tem seu próprio Design System chamado… Gov.UK Design System. Nome não muito original mas vamos ver o que ele possui.

Ficha técnica

  • Nome: GOV.UK Design System
  • Empresa: Governo Federal do Reino Unido
  • Ano de desenvolvimento: 2018
  • Diferenciais:
    • Ao que tudo indica bem acessível, inclusive testado nesse ponto
    • Exemplos “live” em HTML e em Nunjucks
    • Onboarding para devs
    • Bem minimalista
    • Faça e não faça de todos os componentes e padrões
    • Espaçamentos padrões
    • Roadmap público (afinal, é do governo)
  • Pontos negativos:
    • Onboarding somente para devs, por onde anda o .figma? 😞
    • Senti falta de ilustrações, ícones e cores, mesmo sabendo que é justamente o que faz o layout desse DS ser minimalista

Imagens do Design System

home do design system do governo federal do reino unido. No meio o titulo convidando o usuário a projetar seu serviço usando os estilos, componentes e padrões do GOV.UK. Cores pedrominantes azul e branco. CTA Get started
pagina sobre a tipografia usada pelo DS do governo do reino unido. Menu na lateral esquerda com itens como fonte, titulos, links, listas. Na area de conteudo seções sobre a fonte helvetica e arial e titulos
padroes do componente botao usado no ds, no print um botao verde escrito salvar e continuar. Em baixo um code snippet em html do botao
exemplo de mensagem de erro em um campo de data
exemplo de padrao usado para pedir aos usuarios dados de cartão de crédito

O pessoal do Reino Unido envolvido no projeto fez esse post no lançamento do design system, vale dar uma conferida depois.

Que tal receber dicas de UX direto no seu e-mail?

Receba a newsletter que eu escrevo pessoalmente, com práticas de usabilidade, insights do mercado de UX e dicas do Figma