Uso de Cores no Design de Interfaces

Apresentação em tema: "Uso de Cores no Design de Interfaces"— Transcrição da apresentação:

1 Uso de Cores no Design de Interfaces
Disciplina “Multimídia e IUM” Profa. Cristina Paludo Santos /II

2 Uso de Cores – Algumas dicas:
Não torne a tela muito brilhante ou escura Use as cores brilhantes em áreas pequenas e cores suaves em áreas maiores Não aposte na boa habilidade visual de todos os usuários (Um número muito grande de pessoas têm algum tipo de disfunção visual; isto faz com que algumas pessoas não consigam distinguir perfeitamente algumas cores e confundir outras; não só o daltonismo mas também a distorção de algumas lentes provoca estes efeitos) Se possível tornar as cores personalizáveis (Permitir que o usuário defina as copres ao seu gosto) Não use muitas cores extravagantes

3 Uso de Cores – Regras Gerais:
Simplicidade: use poucas cores (2 a 7); é mais fácil de dominar e mais simples de distinguir em dispositivos de menor qualidade ou preto-e-branco Se as cores serão usadas para indicar continuidade, como a passagem de tempo enquanto se espera que uma tarefa termine, então não use um espectro de cores (do violeta ao vermelho). Não associar muitas cores para serem lembradas As cores podem possuir um significado, além daqueles mais populares (vermelho para Pare e Verde para Seguir). Lembrem-se ... Cores mal utilizadas é pior do que não usar cores

4 Cores – Associações comuns:
Vermelho: pare, perigo, fogo, quente Amarelo: cuidado, atenção, aviso Verde: siga, OK Azul: frio, água

5 Diferenças Culturais na Associação de cores
Alguns países têm cores associadas à alguns objetos e fatos: no Japão marginais usam chapéu azul no Egito o amarelo é a cor da alegria e prosperidade as caixas de correio são: - Vermelhas na Inglaterra, - Azuis nos Estados Unidos, - Amarelas na Grécia e - Verdes ou amarelas no Brasil

6 Cores Opostas - se vermelho é PARE: oposto é verde
- se vermelho é CALOR, QUENTE: oposto é azul They should be able to take the tool to the task, not as today, where we must take the task to the tool.” And these tools should folow three axioms of design: simplicity, versatility, and pleasurability

7 Cores Quentes e Frias Cores quentes ou luminosas:
Amarelo, laranja, vermelho e violeta Cores frias ou sombrias: Azul, Turquesa, Verde-mar, verde-alface

8 Harmonia das cores Harmonia das cores opostas ou de contraste: o maior contraste se obtém justapondo cores complementares; a maior superfície é colorida com uma cor quente e a menor com sua cor complementar fria Harmonia das cores análogas ou vizinhas: é o emprego de uma cor e uma ou duas vizinhas; por exemplo: laranja e seus vizinhos, vermelho e amarelo; a cor mais clara usada na superfície maior Harmonia monocromática ou de cor dominante: é o uso de uma única cor, aplicada pura e em vários tons, claros e escuros

9 Cores e Tamanhos Cores são difíceis de distinguir em pequenas áreas
Cores brilhantes parecem maiores Cores escuras sobre fundo claro oferecem maior legibilidade

10 Sensação das cores A sensação é o efeito psico-fisiológico sentido pelo ser humano Cada cor tem uma sensação associada, e portanto o uso inadequado de uma cor pode prejudicar a comunicação visual numa interface A sensação também pode variar em função do contraste, isto é, a cor de um texto ou objeto pode “ter” sensação diferente conforme a cor do fundo da tela Algumas cores podem ser usadas apenas em alertas ou pequenos espaços; é o caso do vermelho, do preto e do roxo/violeta Noticing and analyzing the design features of the everyday environment is a way of developing sensitivity to the designed world in which we live and work”

11 Sensação das cores Vermelho:
- É estimulante mental, aumenta a tensão muscular, a pressão sangüínea e o ritmo respiratório - É uma cor quente e excitante - Na tonalidade rosa é a cor preferida das mulheres - Aumenta a atividade sexual dos homens - Está associada ao fogo

12 Sensação das cores Amarelo:
- Estimulante mental, indicado para situações de calma e reflexão. - Diminui a fadiga visual, tendo ação calmante sobre o sistema nervoso - É a cor de maior intensidade - Letreiro preto sobre fundo amarelo âmbar é a combinação que dá melhor contraste visual; (é uma das poucas cores que tem a mesma visibilidade na inversão do fundo: letreiro amarelo e fundo preto)

13 Sensação das cores Azul:
- É calmante do sistema nervosos para pessoas emotivas - Diminui o ritmo respiratório, por baixar a tensão muscular e a pressão sangüínea - O excesso de exposição ao azul causa fadiga ou depressão - Inspira paz e a introspecção - É a cor predileta dos homens e também das crianças - Dá a sensação de amplitude, como ocorre com as outras cores frias

14 Sensação das cores Verde:
- Tem destacado efeito calmante, dilatando os capilares, abaixando a pressão sangüínea - É eficaz contra a irritabilidade nervosa, a fadiga e a insônia - É uma cor fria - É a mais repousante das cores - Simboliza a segurança, a continuidade e a natureza

15 Sensação das cores Laranja:
- Aumenta a emotividade e acelera as pulsações, ligeiramente - Dá a sensação de bem estar e alegria - Combina a intensidade e vitalidade do vermelho, com a alta visibilidade do amarelo - É uma cor quente, muito luminosa e pouco fatigante

16 Sensação das cores Roxo: Branco: Preto:
- É uma cor fria, porém em tons avermelhados ou púrpureos é quente - Apesar de ser deprimente quando empregada só, torna-se calmante quando em conjunto com outras cores Branco: - É símbolo de pureza e de paz - Em monitores é a cor que mais produz luz na tela Preto: - É deprimente quando usada só - Serve para marcar contrastes, especialmente com o amarelo e o branco