Atividade 5 do Capítulo 7: Mini Design System

A Hard Day's UI

Sistema de design focado em alto contraste e semântica BEM.

Ver Componentes

Conceito do Design

Este design system, batizado de A Hard Day's UI, foi inspirado na estética visual do terceiro álbum de estúdio dos Beatles, "A Hard Day's Night" (1964). O álbum é um marco na cultura pop, sendo a trilha sonora do primeiro filme da banda e o primeiro a conter apenas composições originais de Lennon e McCartney.

A identidade visual do sistema busca mimetizar a icônica capa da versão monaural: o uso do azul vibrante como moldura, o vermelho intenso para destaques e o preto e branco de alto contraste das fotografias de Robert Freeman. Essa escolha não é apenas estética, mas funcional, focando em uma interface de leitura clara, componentes bem definidos e uma hierarquia visual baseada em contrastes marcantes, unindo o charme do design mid-century com a robustez da metodologia BEM.

Tokens de Cor

Visualização Nome da Variável Código Hex
--cor-primaria #006CFD
--cor-secundaria #050002
--cor-destaque #FE0506
--cor-fundo #FFFFFF

Botões

Cards

Clássico Mono

Album Mono

A versão monaural de A Hard Day's Night traz a mixagem original pensada pela banda.

Saiba mais →

Formulário

Campo obrigatório (mínimo 5 caracteres).
Insira um e-mail válido.
Turno de preferência:
Selecione um turno.
Por favor, selecione um instrumento.