forma visual e cor
TRANSCRIPT
Forma Visual e Cor
Comunicação Visual e Design Gráfico
Marketing
Forma Visual
3CVDG
Comunicação Visual
A área de comunicação visual - gráfica ou multimédia – é um dos
campos mais explorados da actividade do design.
Áreas e produtos do design gráfico / design multimédia:
▲ Editorial - Livros, revistas, BD
▲ Publicitário - Projectos, catálogos, anúncios, cartazes, website
▲ Embalagens - Caixas, etiquetas, embalagens varias
▲ Identidade - Marcas, logótipos, imagem
▲ Sinalética - Painéis, letreiros, pictogramas
Tal como as pessoas e os espaços, as empresas têm necessidade
de uma identidade própria que seja facilmente reconhecida por
todos - o Design da Entidade Empresarial.
4CVDG
Percepção
É o sistema visual humano que nos permite ver/percepcionar.
Ao visualizar qualquer figura, a mesma é identificada pelo
contorno ou silhueta sobre o fundo onde é apresentada.
▲Define-se como “espaço positivo” a área ocupada pela figura
▲ Aos espaços não ocupados pela figura, é comum chamar
“espaço negativo”
No entanto, existem imagens em que a percepção é afectada
por efeitos que derivam da ambiguidade entre o que é o
fundo e a figura apresentada.
19CVDG
Teoria de Gestalt
A psicologia de Gestalt afirma que as partes nunca podem
proporcionar uma real compreensão do todo.
De acordo com a teoria gestáltica, não é possível ter
conhecimento do "todo" por meio das suas partes, pois o todo é
maior que a soma de suas partes.
A Gestalt, após sistemáticas pesquisas, apresenta uma nova
teoria sobre o fenómeno da percepção. Segundo esta o que
acontece no cérebro não é idêntico ao que acontece na retina. A
agitação cerebral não se dá por pontos isolados, mas por
extensão. A sensação gerada já é global, de forma e unificada.
Sete fundamentos de Gestalt aplicados ao Design:
▲ Proximidade
▲ Simetria
▲ Unidade
▲ Segregação (Figura/Fundo)
▲ Semelhança
▲ Continuidade
▲ Fechamento
20CVDG
Princípios de Gestalt aplicados ao Design
Proximidade
Simetria
Unidade
Segregação (Figura/Fundo)
Segregação (Figura/Fundo)
Semelhança
Semelhança (mau exemplo)
Continuidade
Fechamento
Fundam
Cor
31CVDG
A cor é radiação electromagnética emitida num
determinado comprimento de onda do espectro
electromagnético.
O que é a Cor?
32CVDG
O que é a Cor?
É o resultado percetual da incidência na retina da luz, na
região visível do espectro electromagnético.
– a retina humana tem 3 tipos de fotorreceptores de cor.
A cor é luz reflectida...
– quando vemos uma cor, o que vemos de facto é um
objecto que absorve certos comprimentos de onda e
reflecte outros
33CVDG
Modelos de Cor
A forma de armazenar e representar cores num sistema
informático pode ser vista, de certa forma, como uma
simplificação da forma que o olho humano usa para
reconhecer as cores.
Com vista a representar com exactidão cada uma das
cores, e visto que ainda não se generalizou forma de
descrever todos os aspectos relacionados com a cor,
foram desenvolvidos diversos modelos para a
representação da cor.
34CVDG
RGB
Segundo a teoria dos 3 estímulos proposta por Young-Helmholtz
(Século XIX), o olho humano interpreta a cor através da
estimulação dos 3 pigmentos visuais presentes nos cones da
retina (existem igualmente os bastonetes), que possuem picos
de sensibilidade aproximada nos seguintes comprimentos de
onda: 630 nm (Vermelho (R)), 530 nm (Verde (G)) e 450 nm
(Azul (B)).
Curiosidade: O daltonismo deve-se a uma anomalia de um (ou
mais) destes pigmentos. Faltando um, todas as cores terão de
ser representadas através da combinação dos outros dois
pigmentos, originando representações “incorrectas” das cores.
35CVDG
Sistema Aditivo (RGB)
RGB: Red, Green, Blue
Vermelho + Verde + Azul = Branco (255,
255, 255)
Verde + Azul = Ciano (0, 255, 255)
Vermelho + Azul = Magenta (255, 0, 255)
Vermelho + Verde = Amarelo (255, 255, 0)
▲ cores aditivas são aquelas
inerentes à luz
▲ usado em monitores, projectores,
câmaras vídeo…
36CVDG
Sistema Visual Humano vs RGB
37CVDG
Sistema Subtrativo (CMYK)
CMYK: Cyan, Magenta, Yellow, blacK
Cião + Magenta + Amarelo Preto
Amarelo + Magenta = Vermelho
Amarelo + Cião = Verde
Cião + Magenta = Azul
▲ cores subtractivas absorvem as
outras cores.
▲ usado na impressão (tintas,
pigmentos…)
38CVDG
Pantone
Pantone Inc. (www.pantone.com), é uma empresa norte
americana conhecida pelo seu sistema (numérico) de cor,
largamente utilizado na indústria gráfica.
O sistema Pantone é baseado numa mistura específica de
pigmentos para se criarem novas cores. O sistema Pantone
também permite que cores especiais sejam impressas, tais
como as cores metálicas e fluorescentes.
O sistema Pantone garante uma fidelidade de impressão entre
95% e 100%. Contudo, é mais caro imprimir com tons Pantone
do que com o sistema CMYK.
39CVDG
Pantone
O sucesso do sistema deveu-se muito ao facto de ser muito
mais confiável especificar números, que não são ou estão
sujeitos a subjectividade humana do que em nomes, que podem
ter diferentes conotações noutros locais ou sociedades.
Os números de cor e valores da Pantone são propriedade
intelectual da Pantone Inc. e o uso gratuito da lista não é
autorizado. É por este motivo que as cores Pantone não são
suportadas em aplicações gráficas de software livre como GIMP
e Inkscape, e muitas vezes não estão presentes em soluções de
software de baixo custo.
40CVDG
Pantone
Curiosidade: O Parlamento
escocês definiu que a bandeira
escocesa é da cor Pantone
300. Outros países, como
Canadá e Coreia do Sul,
também indicam cores Pantone
para a produção de bandeiras.
41CVDG
Sistema HSL
HSL:Hue (Matiz)
Saturation (Saturação)
Luminance (Luminância)
42CVDG
Propriedades da Cor
Matiz (Hue)▲ uma outra designação para cor
Saturação (Saturation ou Chroma)
▲ refere-se ao brilho (ou intensidade) de uma matiz
▲ a saturação é + elevada nas cores puras (ñ misturadas)
Valor lumínico (Value)
▲ refere-se à intensidade de uma cor
▲ é alterado com a adição de branco ou preto a uma matiz
Valor lumínico = 0.2 * R + 0.7 * G +0.1 * B
43CVDG
Valor lumínico
No entanto, o valor lumínico também depende da cor de fundo
onde ela é apresentada. Por exemplo, sobre fundo claro, as
cores claras parecem mais escuras e menos luminosas. A
mesma cor sobre um fundo escuro parece mais luminosa.
44CVDG
Condicionantes na escolha de cores
A cor, uma linguagem universal, embora, conforme a
cultura, possua significados diferentes. A selecção de
uma cor deve ser sempre criteriosa, tendo em conta:
▲Limitações humanas
▲Identidade visual do público alvo
▲Ambiente e regime de trabalho
▲Limitações do hardware
45CVDG
Como escolher as cores?
▲Ver outros trabalhos…
▲Definir as cores antes de executar todo o trabalho– definir os níveis de ênfase necessários
– fazer testes parciais (ecrãs tipo)
▲Favorecer o contraste e harmonia– cores complementares
– valor lumínico das cores
▲Reduzir a fadiga– vibrações
– saturação
46CVDG
Discriminação
▲escolher uma gama de cores bem discriminadas- máximo de 5±2
▲distanciar as cores em valor lumínico- variar pelo menos duas das suas componentes
▲ordenar as cores pela sua ordem espectral:
vermelho, laranja, amarelo, verde, azul, roxo, violeta
▲discriminação diminui ao longo do espectro
ex: mais difícil distinguir pequenas variações nos vermelhos e
violetas
▲receptores de azul nos nossos olhos são escassos:- evitar cores adjacentes que diferem apenas na quantidade de azul- não usar azul puro em texto, linhas ou detalhes
47CVDG
Valor lumínico
Valores aproximados: vibração ! Valores distanciados: contraste
Valor lumínico como medida de contraste entre duas cores:
48CVDG
Valor lumínico
Valor lumínico como medida de equilíbrio entre várias cores:
Valores distintos: desequilíbrio Valores mais próximos: + harmonia
49CVDG
Ordem espectral
A ordem espectral é mais harmoniosa
50CVDG
Cores complementares
(0, 50, 100)
(255, 205, 155)
(255, 0, 0)
(0, 255, 255)
(255, 0, 255)
(0, 255, 0)
a
a a
a(150, 50, 100)
(105, 205, 155)
Cores complementares e saturadas: vibração!
Cores complementares não saturadas: contraste + harmonioso
51CVDG
Saturação
Textos colocados sobre
fundos de cores saturadas
provocam fadiga
Combinações de cores muito saturadas produzem sombras ou vibrações:
Textos extensos em cores
muito saturadas provocam
fadiga no leitor
52CVDG
Texto vs Fundo
Aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor.
Aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor.
Aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor.
Aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor.
Aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor.
Aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor, aplicação de texto sobre um fundo de cor.
Algumas combinações de cores desadequadas...
53CVDG
▲Utilizar cores saturadas para chamar atenção
▲Agrupar elementos usando uma cor de fundo comum
▲Luz ambiente condiciona o ênfase:
▲A periferia da retina é pouco sensível às cores
‒ são excepção: azul, preto, branco e amarelo
‒ recorrer a intermitências ou alteração de tamanhos
Fundo
Texto, linhas
ou detalhes claros
escuro
escuros
claro
Fraca luz ambiente Forte luz ambiente
Ênfase
54CVDG
Ênfase
O vermelho quando apresentado em pequena extensão assume
enorme força. Chama a atenção por estar em menor tamanho.
55CVDG
Dinâmica das cores
A cor afecta profundamente a nossa percepção do espaço.
Cores saturadas (quentes), visualmente parecem mais
próximas do observador. Cores frias, parecem mais distantes.
56CVDG
Consequências do mau uso da cor
▲Fadiga ou desconforto visualex: combinação inadequada de cores
▲Dispersão da atençãoex: excesso de cores
▲Interface ilegívelex: não foram tidas em conta as condições de iluminação local
▲Aprendizagem difícilex: incoerência no uso da cor
▲Aversão ao uso de uma aplicaçãoex: escolha de cores choca com a identidade dos utilizadores
57CVDG
Simbolismo da Cor
A cor actua fortemente sobre a sensibilidade e condiciona a
fisiologia dos seres que a percepcionam.
Alguns significados possíveis (embora subjectivo):
cores quentes:
cores frias:
cores escuras:
Azul:
Vermelho:
Amarelo:
Castanho:
Roxo:
Preto:
Branco:
acção, avanço, intrusão
passividade, afastamento
autoridade, poder, controle
inteligência, conhecimento, credibilidade, solidez
perigo, tensão, dinamismo, paixão
acção, alegria, ansiedade
protecção, calma, natureza, antiguidade
misticismo, artificialidade
autoritarismo, distanciação
pureza, clarividência
58CVDG
Simbolismo da Cor
59CVDG
Contraste por cores primárias
60CVDG
Contraste por cores complementares
61CVDG
Contraste por cores quente-frio
62CVDG
Profundidade por cores saturadas complementares
“La Agoria en el Jardin”, El Greco (1590)