Cor

Ferramenta de interface que guia atenção, marca estado e carrega significado, antes mesmo de qualquer texto.

Hard

O que é

Cor em produto faz trabalho funcional, e não só estético. Ela cria hierarquia, ou seja, indica o que olhar primeiro, sinaliza estado quando mostra erro, sucesso ou alerta, e ainda dá identidade à marca dentro da tela. Por isso a escolha de cor é uma decisão de produto, não um detalhe de acabamento.

O contraste é a parte que define a legibilidade. Quando o texto não tem contraste suficiente, ele some pra quem enxerga pouco e também pra quem está no sol tentando ler no celular. É por isso que cor anda sempre junto de acessibilidade: a escolha não é questão de gosto, e sim de a pessoa conseguir ou não ler e agir.

A cor também carrega leitura cultural. O mesmo tom pode dizer coisas diferentes em mercados diferentes, então em produto global vale checar isso antes de assumir que a leitura é universal.

Em uma frase

A cor de sucesso não pode ser o único sinal aqui, vamos apoiar num ícone também.

A pergunta que ele responde

Como uso cor na interface pra guiar a pessoa, e não só pra deixar bonito?

Quando usar

Use ao desenhar hierarquia, estados do sistema e identidade visual de qualquer interface, porque a cor é o que organiza essas três camadas ao mesmo tempo.

Como não usar

O cuidado é não deixar a cor como único portador de significado. Se o erro aparece só em vermelho, sem ícone nem texto, você acaba excluindo parte das pessoas que não captam esse sinal.

Na prática

Repare que o botão de ação principal costuma receber a cor de maior contraste da tela. Todo o resto recua um pouco justamente pra deixar esse botão sobressair.

Não confunda com

Vale separar cor de paleta bonita. Cor aqui é função percebida, não enfeite, e por isso uma cor que comunica sucesso pode falhar com quem tem daltonismo se ela for o único sinal na tela. Sempre que dá, é bom apoiar a cor em outro recurso.

D

Em inglês

Color

Pronúncia

n/a

Também chamado de

cor em interface, uso de cor

Origem

n/a

Fonte

Saiba mais

Nielsen Norman Group, artigo sobre uso de cor em interfaces.