A cor considera a tela, o ambiente e a cognição. Nos óculos, as cores usam uma paleta altamente refinada para viabilizar o comportamento de telas aditivas e otimizar o conforto visual. O uso de cores nos óculos precisa ser feito com cuidado para harmonizar com o mundo real, indicar ações importantes, mostrar imagens ou fornecer significado semântico.
O preto é transparente na tela óptica transparente. Tenha isso em mente ao criar o design, já que cores mais escuras vão parecer opacas ou transparentes, mas isso também pode ser usado para criar profundidade.
Esquema de cores
O esquema de cores dos óculos (coleção de tokens ou funções de cores para tematizar a cor do seu app) consiste em três funções de destaque, quatro de superfície (ou neutras) e suas contrapartes de cor. As funções de cores são semelhantes às funções do esquema para dispositivos móveis e devem ser usadas da mesma maneira.
As cores de destaque podem ser usadas para dar ênfase limitada a uma cor.
O que fazer
O que não fazer
Personalizar cor
Ao personalizar as cores dos óculos, é fundamental garantir obstrução visual mínima e harmonização com o mundo real, priorizando a legibilidade em diferentes condições de iluminação. Isso envolve calibrar cuidadosamente as cores para equilibrar o brilho e a saturação, garantindo a legibilidade e mantendo a saturação suficiente para que haja reconhecimento instantâneo. A cor primária pode ser personalizada para usar a cor da sua marca ou de interação principal. Considere o contraste, a saturação e o uso de energia da cor escolhida.
Cores semânticas e da marca otimizadas
As cores que representam marca, ações ou alertas do sistema precisam ser:
- Brilhante o suficiente para ser legível
- Saturado o suficiente para ser discernível como uma cor
Uso de energia
Algumas cores usam mais energia e geram mais calor do que outras. O verde é o que menos consome energia, e o azul é o que mais consome, ao comparar cores de tom igual, como visto à direita. Minimize o número de pixels iluminados. Quanto mais brilhante a tela, mais quente ela fica. Não preencha a tela com branco total, porque isso pode causar mitigação térmica.
O que fazer
O que não fazer
O que fazer
O que não fazer
Evite superfícies personalizadas.
Cores de contêineres escuras
Em geral, os contêineres precisam se concentrar em mostrar o conteúdo que está dentro deles, sem distrair:
- As superfícies precisam ser pretas para ter o maior contraste
- Os contornos precisam ser visíveis, mas sutis
O que fazer
O que não fazer
É possível personalizar o contorno para adicionar branding ou uma interface expressiva.
O que fazer
O que não fazer
Alerta
Personalização do foco do contorno em azul: o destaque do estado de foco é feito de dois contornos, e a cor é aplicada à camada 2 para ajustar o estado de foco.