Uso de cores na Web- Web colors

Apresentação em tema: "Uso de cores na Web- Web colors"— Transcrição da apresentação:

1

2 Uso de cores na Web- Web colors

3 Objetivo: instruir o web designer com noções sobre como escolher cores e esquemas de cores ideais para a criação de um site, respeitando padrões diversos.

4 Intro Dentro dos princípios do design, a cor é um dos mais importantes. Não precisa nem trabalhar com layout para saber quando o esquema de cores foi mal escolhido. Isso porque as cores possuem significado intrínseco para o ser humano. Selecionar as cores certas para criar, seja um banner ou um layout, é uma das tarefas mais árduas para o web designer. Isso porque as cores comunicam diferentes estados para cada pessoa ou povo e a mistura delas abre ainda mais possibilidades de interpretação. Para dificultar também existe a diferença de percepção. O que para você é um alaranjado, para outra pessoa pode ser um vermelho fraco. Mesmo contando com tantas variáveis, são distinguíveis diretrizes que podemos seguir para compor a paleta básica do gráfico a ser criado. E neste artigo você aprenderá quais são elas. Mas antes de tudo vamos começar entendendo o que é a cor e como ela é formada.

5 A cor Um objeto é verde porque de todos os comprimentos de onda, a única que ele não absorve, então reflete, é o comprimento percebido por nós como verde. Já a intensidade vai depender da quantidade de luz e outras variáveis. Se um objeto não absorver nenhum espectro de onda é percebido como branco, enquanto que, se absorver todos, é preto. Esta informação é captada pelo olho por células localizadas na retina chamadas células cone e bastonetes, estes últimos reconhecem a quantidade de luz. Com a quantidade destas células variando entre as pessoas entendemos porque a mesma cor é percebida com diferença. No monitor e demais dispositivos eletrônicos, a cor é criada de forma aditiva. Três pixels são convocados para criar uma cor. Um ponto vermelho são três pixels somados com voltagens diferentes. A cor também é conhecida como matiz. A pureza da cor é chamada de saturação. À medida que for adicionada preto, branco ou cinza à cor esta pureza diminue. A luminosidade da cor, se ela é mais clara ou escura é rotulada valor. Cores claras tem valores altos, escuras tem o valor baixo. O tom é a adição de cinza na cor base resultando em uma cor mais sóbria e suave. Para tons claros adiciona-se o branco.

6 Circulo cromático Uma forma encontrada para representar a relação entre as cores é o círculo cromático. A relação existente diz respeito à derivação das cores resultado da mistura de outras. Sabendo que as cores primárias, vermelha, azul e amarela são a base do círculo e as adjacentes o produto da mistura entre elas. A disposição das cores no círculo cromático não é feita por simples conveniência. Existe um significado, uma relação entre elas, que facilita na hora de escolher as cores para compor o design. Veja que o branco, preto e cinza não aparecem no círculo cromático. Juntamente com cores pastel como marrom, bege e creme elas são conhecidas como cores neutras muito úteis como cor base devido à discrição

7

8 Relação Entre As Cores Você pode tanto criar o seu próprio esquema de cores quanto utilizar um dentre os existentes como resultado da relação entre as cores.

9 Monocromático Você escolhe uma cor e trabalha com as variantes de tonalidade dela. Por exemplo, trabalhar com o azul, azul-escuro, azul-claro, adicionando cinza, preto ou branco para criar outras nuances do azul.

10 Análoga Neste esquema você utiliza três cores vizinhas no círculo
Análoga Neste esquema você utiliza três cores vizinhas no círculo. Utilizando de exemplo o círculo cromático acima, podemos criar um esquema com o verde-claro, amarelo e alaranjado e seus tons.

11 Complementar Escolha duas cores opostas no círculo cromático e você consegue um esquema de cores que funciona chamado de complementar. Não é aconselhável utilizar elas com a saturação natural já que isso cria um contraste muito forte. Se for utilizar o verde puro, adicione um tom de vermelho e não a cor pura.

12 Tríade Escolha no círculo cores eqüidistantes como verde, violeta e alaranjado. Cria-se desta maneira um esquema menos óbvio apesar de harmonioso.

13 Significado Das Cores Um aspecto importante a ser observado no trabalho com as cores é que elas transmitem sensações. Isso se deve a analogia. A brasa do fogo é vermelha e quente, então a cor vermelha remete a calor. Enquanto que o gelo muitas vezes é azul-claro, então a cor fica associada ao frio. Sendo assim cores quentes são: vermelho, alaranjado e amarelo. Cores frias são: azul, verde e roxo/violeta. Mas estes significados não são universais. É preciso avaliar o público-alvo e pesquisar que significado eles dão para a cor. O vermelho que remete a paixão nos países ocidentais, pode lembrar Aids nos países africanos assolados pela doença, onde as campanhas têm esta como cor predominante. O significado das cores apresentado neste artigo leva em consideração a cultura ocidental, se o público for asiático, africano ou qualquer cultura que não se encaixa exige um pouco mais de pesquisa.

14 Vermelho

15 Vermelho Uma cor enérgica, quente e estimulante. Tanto que é associada ao coração, amor já que é a cor do sangue. A visualização do vermelho em grandes áreas aumenta a pressão sanguínea e a respiração. Também pode lembrar raiva e perigo. Evite utilizar em grandes regiões já que pode gerar desconforto visual. Muito útil quando você quer destacar alguma região do site. Utilizada em tonalidade mais escura associada a uma cor neutra como o bege pode criar um ambiente mais sofisticado.

16 Alaranjado

17 Alaranjado Uma versão mais branda do vermelho em se tratando de estímulo. É energética associada à vitalidade e juventude. Em tons escuros lembra o outono. Mais acertada a utilização em pequenas áreas do que grandes.

18 Amarelo

19 Amarelo Altamente estimulante ao olhar é a mais clara das cores quentes. Sendo da cor do sol remete a esperança e felicidade. Em tom médio lembra o ouro o que ajuda a criar a sensação de valor e durabilidade. Em dupla com o preto sinaliza perigo.

20 Azul

21 Azul Responsabilidade se for mais escuro, tranqüilidade e jovialidade quando mais claro. Utilizado quando o assunto é saúde. Sendo a cor do céu remete ao paraíso, então apresenta conotação espiritual.

22 Verde

23 Verde Quando se fala nesta cor sem dúvida nos vem à imagem da natureza. Representa também crescimento, riqueza sendo a cor do dólar, saúde, frescor e tranqüilidade em uma tonalidade mais clara.

24 Roxo / Violeta

25 Roxo/Violeta A cor de uma classe social, a realeza. Utilizada também para remeter á imaginação, criatividade e exclusividade. Também tem um sentido espiritual.

26 Neutros Nas cores neutras entram o preto, branco, cinza, bege, creme e marrom. Muito úteis como cores de fundo, funcionam em dupla com cores quentes e frias

27 Preto O preto possui um lado positivo remetendo ao poder, elegância, sobriedade e outro negativo associado à morte e mistério.

28 Branco O branco só tem atributos positivos, claridade, pureza, cuidados com a saúde e inocência. Comum no design minimalista por ser considerada a mais básica das cores.

29 Cinca O cinza é formal. Lembra ambiente estruturado e por isso tem haver com profissionalismo. Tem também o lado depressivo por não oferecer estimulação visual quando em tom médio.

30 Bege O bege funciona como contraponto de cores quentes. Quase sempre no fundo como textura.

31 Marrom O marrom é permanência, por isso é confiança e segurança. Cor de chocolate, da terra e árvores. Mas dependendo do tom pode ser entediante.

32 O significado de uma cor pode variar drasticamente dependendo das cores vizinhas. E não somente o significado, mas a cor em si também.

33 Ferramentas e Comunidades Online

34 Color Schemer Online – Você escolhe a cor base e ele lista as cores sugestões de cores que combinam com seus respectivos valores RGB e hexadecimal. Oferece uma versão para desktop.

35 Color On The Web – Você pode criar a cor base através de controles deslizantes ou colocando o valor hexadecimal e clicando em “set”. Sugere esquemas conforme a relação entre as cores, como análogas e complementares. Também traz variantes da mesma cor com saturações e matizes diferentes.

36 A Colour Lovers é uma das mais ativas comunidades dedicadas ao compartilhamento de informações sobre cor. Oferece a possibilidade de criar paletas online e compartilhar com os outros usuários. Tornando-se grande fonte de inspiração e descobertas

37 Conclusão O estudo das cores é um assunto instigante que exige muito estudo e prática. Você pode exercitar a criação de paletas pegando imagens simples e selecionando as cores componentes. Você verá como a natureza por si só já oferece grandes combinações de cores.

38 Conteúdo integralmente extraído http://www.webmaster.pt Igor Vale