Detalhando o Princípio da Estética
Criação através da tipologia
Contraste - Cor
A cor é mais um termo com interpretações óbvias
A única coisa que você deve lembrar é que as cores quentes (vermelhos, laranjas) vêm na frente e comandam nossa atenção
Nossos olhos são muito atraídos pelas cores quentes
Cor
cores frias (azuis, verdes) desaparecem gradualmente diante dos nossos olhos
Grandes áreas de cores suaves são ideais; na verdade, elas são necessárias para criarmos um contraste eficaz
Cor
Observe que mesmo sendo menor, a primeira linha é dominante devido à aplicação da cor quente.
Agora o nome maior na cor quente se sobrepõe ao nome menor. Em geral, este é um efeito que deve ser evitado.
Cor
Veja como o nome “Scarlett” praticamente desparece
Geralmente, para que o contraste com uma cor fria realmente crie o efeito desejado, é preciso usá-la em maior quantidade. Veja como o nome praticamente desaparece.
Cor
É fácil criar um contraste com várias cores mas fazendo como os tipógrafos conseguimos referenciar o tipo preto e branco de uma página como um tipo colorido
Cor
Nesta citação podemos visualizar facilmente as “cores” diferentes no texto em preto e branco.
Cor
A “cor” é criada através de variações como o peso das letras, a estrutura, a forma, o espaço existente no interior das letras, o espaço entre as linhas ou o tamanho do tipo. Mesmo utilizando um único estilo para o mesmo tipo é possível criar “cores” diferentes.
Cor
Uma fonte suave, arejada, com bastante espaço entre as letras (conhecido com o entreletra) e entre as linhas (conhecido como entrelinha) cria uma “cor” e uma textura bastante suaves
Uma fonte em bold (negrito) e sem serifa, pouco arejada, cria uma cor escura, com uma textura diferente
Cor
Este é um contraste particularmente útil na montagem de páginas com muita massa de texto e sem figuras
A seguir, note como podemos mudar a cor através da fonte ou do tamanho fazendo ajustes mínimos.
Cor
Zurich Light, 8 pontos, entrelinha simples
Zurich Light, 8 pontos, entrelinha 1,5, entreletra adicional. Observe que o texto tem uma cor mais suave do que a do exemplo anterior.
Cor
Zurich Bold, 8 pontos, entrelinha simples. Este exemplo é exatamente igual ao primeiro, exceto por sua versão em bold e não em light.
Cor
A cor serve para: demonstrar um estado de espírito enviar mensagens de paz ou de guerra chamar a atenção
Cor
Embora o uso da cor nos programas até o momento seja bastante simples.
existem algumas regras que precisamos conhecer sobre a combinação de cores.
regras que fazem parte da teoria das cores
Cor
Independentemente de questões de gosto, uma cor pode transmitir sensações como: calor ou frio. Tristeza ou alegria.
Existem duas maneiras de analisarmos a cor enquanto luz e enquanto tinta
Fisicamente, as cores são provenientes de ondas de luz
Cor
Os objetos têm as cores que eles refletem Tanto isso é verdade que, dependendo da
cor da luz que incida sobre um objeto, ele parecerá ter uma cor diferente
Mostraremos agora como as cores se relacionam.
Cor
No campo das tintas, existem três cores primárias: azul vermelho amarelo
E três secundárias laranja violeta verde
Cor
Não se pode obter as cores primárias através de mistura alguma,
Todas as demais cores que existem são provenientes de misturas entre elas
(O olho humano é capaz de distinguir mais de 10 milhões de cores!)
Cor
No campo da Luz as cores primárias são: vermelho verde azul
Nesse caso, o amarelo é obtido pela mistura do vermelho com o verde.
Cor
As cores podem, então, ser arranjadas em um círculo, conhecido como roda das cores.
Cor
Neste círculo temos as três cores primárias (azul, vermelho e amarelo).
As cores secundárias obtidas pela mistura de duas cores primárias fica entre estas, assim, a mistura entre azul e amarelo resulta no verde, o qual, no círculo, aparece entre as duas
Cor
Ainda temos mais um nível, o das cores intermediárias
resultantes da mistura entre uma cor primária e uma secundária
A conclusão a que se pode chegar é que este círculo é praticamente infinito, já que podemos misturar uma cor primária com uma intermediária, e assim por diante
Cor
Por que o preto e o branco não estão no círculo? O preto e o branco não contam porque eles não são
considerados cores O preto é considerado ausência de cor o branco é a mistura de todas as cores
Se fizermos uma experiência caseira de colocarmos todas as cores misturadas, é bem provável que se chegue a algo mais parecido com o cinza do que com o branco. "cor de burro quando foge"
Cor
Logo, conclui-se que: Esta afirmativa de que a mistura de todas as cores resulta no branco vale para a cor luz e não a cor tinta
Como o computador trabalha com a cor luz é possível demonstrar isso através da tela de seleção de cores de algum software de edição de imagens como: Paint Brush, Publisher, Corel Draw, etc.
Cor Observe o triangulo da cor:
Cor
Preto BrancoCinza
Tom
NuançaSombra
Cor
Se nós pegarmos uma cor especificamente, podemos acrescentar branco a esta cor para clareá-la, ou podemos acrescentar o preto para escurecê-la
Ou ainda, podemos acrescentar branco e preto (cinza) para obter novos tons da mesma cor
O uso do preto e do branco vai ser necessário para criarmos os tons e nuanças da cor
Cor
O nome disto é Matiz Ou seja, muitas vezes podemos utilizar somente
uma cor e seus matizes Pra que isto?
Conhecer isso pode fazer com que você crie uma publicação atrativa visualmente, mas também relativamente barata na hora de imprimir, principalmente se você for utilizar uma gráfica
essas empresas fazem o orçamento de um trabalho levando em consideração o número de cores que a impressão utilizará
Cor
No caso do triângulo das cores, procure utilizar em conjunto aquelas que estão sobre uma mesma linha. Por exemplo, utilize a cor, uma sombra e o preto Ou uma nuança, um tom e o preto
Juntando a roda das cores e o triângulo de cores você pode perceber que as possibilidades de cores
existentes são praticamente infinitas
Cor
Voltando à roda das cores a posição que a cor ocupa no círculo nos diz um
pouco da sua característica Por exemplo, as cores que vão do verde ao
violeta são conhecidas como cores frias, e as demais, como quentes.
Veja um exemplo prático. Qual dessas duas representações transmite mais eficientemente a mensagem?
Cor
As duas são exatamente iguais em tipo de letra, formato, tamanho, posição, mas são diferentes em um item: a cor.
Isso quer dizer que você tem agora uma nova preocupação: a de escolher criteriosamente as cores
Cores monocromáticas
Existe um pensamento geral de que se um trabalho é monocromático, então ele é branco e preto, mas isso não é verdade!
Um trabalho monocromático é aquele que é feito sobre o triângulo de uma cor
Utilize esta técnica quando quiser baratear a impressão, ou quando não quiser arriscar no uso de mais de uma cor
Cores monocromáticas
Veja um exemplo de publicação monocromática:
Cor Monocromática
Cores complementares
São aquelas que estão diametralmente opostas na roda das cores
Você só deve tomar o cuidado de utilizar uma cor do círculo como a cor de base utilizando matizes da outra cor para evitar que as duas cores "briguem"
Você já fez a experiência de colocar um objeto vermelho sobre um fundo verde? Dependendo do tom das cores o seu olho parece que vê
os objeto "pulando"
Cores complementares
Veja a mesma publicação onde foi utilizado um esquema de cores complementares:
Cores Complementares
Cores análogas
São aquelas que estão próximas na roda das cores
Na maioria das vezes produzem trabalhos suaves
É a combinação de cores mais utilizada por aqueles que não conhecem a roda das cores, por ser a mais "óbvia"
Cores análogas
Cores Análogas
Cores contrastantes
As cores contrastantes são aquelas que estão à mesma distância umas das outras na roda de cores
Usadas em conjunto dão uma aparência equilibrada à publicação
procure usar matizes das cores contrastantes
Cores contrastantes
Cores Contrastantes
alguns conselhos sobre o uso de cores... Use as cores para destacar alguma informação,
mas use-as com moderação. Quanto mais cores forem usadas, mais difícil será para o leitor lembrar o quê cada cor representa.
Use as cores de maneira consistente, por exemplo, se usou vermelho para um título, use o mesmo vermelho para todos os títulos da publicação.
alguns conselhos sobre o uso de cores... use texto colorido com moderação e procure
aumentar o tamanho da letra quando o fizer. O texto colorido tem menos contraste em relação ao fundo branco e pode dificultar a leitura do mesmo
Faça testes de impressão. as cores que vemos na tela não são as mesmas que a impressora gera
alguns conselhos sobre o uso de cores... Se for utilizar os serviços de uma gráfica,
faça um orçamento antes para saber qual é o preço de se usar uma, duas ou quatro cores e execute sua publicação em relação ao quanto pretende gastar com ela
Cor
A tela apresentada abaixo é um exemplo de criação de cores permitida por muitos softwares
Veja no exemplo desta tela, que há uma cor selecionada, e que está aparecendo uma caixa amarela com a seguinte informação RGB(204, 204, 153)
Cor
Ainda nesta aula dissemos que, para a luz, as cores primárias são Vermelho, Verde e Azul e que todas as outras são obtidas pela mistura entre estas três
Assim, as letras RGB representam estas cores (Red, Green, Blue) e os números representam a quantidade de cada uma presente na formação da cor que está selecionada
No nosso exemplo temos uma que contém 204 partes de vermelho, 204 partes de verde e 153 partes de azul. O melhor desta história é que você pode criar sua própria cor!
Cor
Cor O quadro colorido com uma pequena cruz é o
local onde você escolhe a cor diretamente. Na parte de baixo você vê dois quadrados, Cor e Sólido os quais significam, respectivamente, a cor que você está escolhendo e aquela que será exibida caso não seja possível utilizar sua escolha.
A cor aplicada ao texto e a objetos com padrões (riscado, tracejado, com pontinhos, etc.) não pode ser uma cor misturada, e geralmente nesses casos será apresentada a cor sólida
Cor
Quando você arrasta esta cruz no sentido horizontal dentro do quadrado, você está modificando o seu matiz (a cor pura), o qual também pode ser alterado pela caixa de texto com mesmo nome na parte de baixo da tela
Nesta caixa (Matiz) você pode colocar números de 0 (vermelho) a 120 (verde) a 240 (azul) a 359 (quase vermelho)
Acredita-se que estes números representam graus em um círculo. Portanto, o numero que escolhermos provavelmente indica uma posição na roda das cores.
Cor
Se você estiver arrastando a cruz verticalmente no quadrado, você estará modificando a saturação da cor (a sua intensidade), o que também pode ser feito através da caixa de texto Sat. que existe logo abaixo do Matiz
Nesta caixa você pode colocar valores de 0 (cinza) a 100 (cor intensa)
Se você observar o triângulo das cores, vai perceber que, estaremos nos dirigindo, perpendicularmente, a partir do topo do triângulo para a sua base, ou seja, da cor original em direção ao cinza
Cor
Cor
Preto BrancoCinza
Tom
NuançaSombra
Cor
Para nos dirigirmos da cor ao branco e da cor ao preto, nós arrastaremos a seta que aparece na barra vertical ao lado do quadrado das cores, ou então, modificaremos o valor da caixa Lum, a qual significa luminosidade
Para clarear ou escurecer a cor digite um valor entre 0 (preto) e 100 (branco)
Cor
Quando você mexe com estes valores está executando a mesma tarefa que os pintores, quando eles misturam suas tintas (só que sem fazer a mesma sujeira!)
O valor máximo que você pode colocar de cada cor é 255
Cor
No início desta aula dissemos que o preto significa ausência de cor, e que o branco provém da mistura de todas as cores.
Agora nós podemos demonstrar isso. Se você colocar o valor 0 (zero) para o vermelho, o verde e
o azul, verá que será formada a cor preta. Já se você colocar o valor 255 para cada uma delas, ou
seja, o máximo que pode haver de cada uma, verá a formação da cor branca.
Problemas
Muitas vezes a resolução do monitor que estamos utilizando não é a melhor possível,
Decepção na hora de imprimir o trabalho Mesmo quando você fizer páginas Internet,
as quais, a princípio serão apresentadas somente no monitor, pode haver diferença na exibição da cor de um monitor para outro.
Exercício em Sala
Construir um documento utilizando páginas da internet ou trabalhos passados ou ainda novas construções.
Aplicar nesta interface as seguintes variações, para cada caso construir uma interface nova: Utilizar apenas cores quentes e/ou frias (analise o contexto). Utilizar o preto e o branco para criar sensações de cores. Utilizar apenas cores monocromáticas, segundo a roda das cores.
(neste caso é necessário consultar ainda o triângulo das cores) Utilizar apenas cores complementares, segundo a roda das cores. Utilizar apenas cores análogas, segundo a roda das cores. Utilizar apenas cores contrastantes, segundo a roda das cores.
Propósito de criar consciência na utilização de cores em páginas web, assim como aplicar conceitos e possibilitar análises críticas sobre utilização de cores em Interfaces gráficas