Projeto de UI: O uso das cores

Saber usar as cores em um projeto nem sempre é uma tarefa fácil, principalmente quando se está iniciando na área de UI Design. Algumas pessoas acham que precisam se aprofundar na psicologia das cores para entender e assim ser mais habilidoso. Porém posso te afirmar que, se você souber aplicar algumas regras e teorias, será de grande ajuda para iniciar e não fazer feio diante de um cliente.

As cores trazem um reforço extra para um projeto, destacando as qualidades do layout, provocando sensações e associações que marcam na mente do usuário. Vale lembrar que, o significado delas pode variar dependendo da cultura e das circunstâncias.

Precisando de uma paleta de cores? Olhe ao seu redor!

As melhores combinações de cores estão na natureza. Eles sempre parecerão naturais e familiar para todo mundo. Se você está num escritório ou em um ambiente em que não há muitos elementos para se inspirar, olhe algumas fotos no Google e use uma ferramenta que você possa extrair uma paleta de cores. Eu uso uma extensão de navegador chamada Pallete Creator que me ajuda a selecionar uma paleta de cores a partir da imagem que eu quero.

Exemplo de imagem usando o Pallete Creator.

Fato interessante sobre cores e a natureza:

Você sabia que a cor azul é que mais se destaca como cor preferida? Sim, isso mesmo! E existe vários motivos pra isso, e um deles é que as pessoas associam a cor azul ao céu com poucas nuvens, que acalma, que traz consigo um dia lindo de sol e a água limpa do mar, o que traz tranquilidade. Por isso a melhor opção em caso de dúvidas é partir para as cores da natureza.

Alguns designers defendem também a cor azul em seus projetos quando se trata de UI, porque ela não tem uma associação muito clara — eu diria até neutra — das cores mais conhecidas pelos usuários como vermelho, amarelo/laranja e verde, que respectivamente significa erro, cautela ou atenção e sucesso.

E até na questão de acessibilidade a cor azul ajuda, pois ela é uma das poucas cores que uma pessoa portadora do daltonismo pode ver:

Imagem — Como pessoas com deficiência visual vêem cores

Algumas dicas que podem te ajudar na hora de projetar UI:

1. Use as cores com moderação. Você obterá melhores resultados se ficar com no máximo três cores primárias em seu esquema de cores. Se você precisar de cores adicionais além das que você definiu, use tons das cores estabelecidas.

2. Mantenha o contraste. Algumas cores vão bem umas com as outras, enquanto outras irão entrar em conflito. Existem regras definitivas sobre como eles irão interagir, o que pode ser melhor observado em um “círculo cromático”.

3. Não deixe para decidir as cores no fim do projeto, elas tem que entra no conceito. Há grandes chances de você projetar algo e depois as cores não trazerem o equilíbrio e as sensações de uma boa experiencia para o usuário. Se estiver iniciando um projeto, use tons da cor selecionada para iniciar o projeto (depois que você fizer o wirefreme, se preferir), para te ajudar a visualizar como ficará no final. O importante é não deixar as cores para serem aplicadas no final.

Fonte da imagem

4. Utilize a teoria de Goethe sobre proporção de uso das cores.

“ Ele explica que se uma cor é por natureza mais luminosa, como o amarelo, por exemplo, deve-se combinar com um tom naturalmente mais escuro, cuja proporção entre as duas cores deve ser tal que a cor mais luminosa ocupe uma área menor do que a outra.” (BARROS, 2009).
Fonte: Imagem do livro A cor no processo criativo, da pesquisadora Lilian Ried Miller Barros

Saiba mais sobre essa teoria aqui.

Eu espero ter te proporcionado um caminho a seguir para a sua aventura com o uso das cores. Não tenha medo de usá-las, somente use com sabedoria e viva os prazeres de um projeto mais “colorful”.