SlideShare uma empresa Scribd logo
1 de 102
cor cor
cor cor
Inteligência, comunicação,
confiança, eficiência,
serenidade
Frieza, altivez, falta de
emoção, apatia
cor cor
cor cor
Consciência espiritual,
refreamento, visão, luxo,
verdade, qualidade
Introversão, decadência,
supressão, inferioridade
cor cor
cor cor
Otimismo, confiança,
auto-estima, extroversão,
criatividade
Irracionalidade, medo,
fragilidade emocional,
depressão, ansiedade
cor cor
cor cor
Coragem física, força, calor,
energia, masculinidade,
agitação
Desafio, agressão, impacto
visual, tensão, acidente
primeiro
gse redo
nenhuma
cor é feia
você é que
bebeu pouco
nenhuma
cor é feia
a cor
não é uma
coisa,
é uma
qualidade
a cor
não é uma
coisa,
é uma
qualidade
chamativa
fresca
feliz
discreta
aconchegante
infantil
http://accurate-personality-test.softonic.com.br/
Lüsher
segundo
gse redo
cor existenão
cor existenão
e existe
ausência de luz
existe luz
X???
X???
!!!
terceiro
gse redo
COM QUE COR EU VOU PRO PAGODE QUE VOCÊ
ME CONVIDOU?
COM QUE COR EU VOU PRO PAGODE QUE VOCÊ
ME CONVIDOU?
PARA
USAR CORES,
COMO NA
MODA,
NÃO EXISTE
CERTO OU
ERRADO.
PARA
USAR CORES,
COMO NA
MODA,
NÃO EXISTE
CERTO OU
ERRADO.
EXISTE
CON
TEX
TOCONTEXTO
AS CORES SÃO AS
ROUPAS QUE VESTEM
AS EMOÇÕES E
SENSAÇÕES DAS
COISAS, marcas, layouts,
do mundo enfim.
quarto
gse redo
as cores não existem
SOZINHAS
fatoscoloridos
Certo, entendi.
Tem cor pra tudo.
E cada cor empresta
sua personalidade
para a coisa que
«veste» essa cor. Mas,
Como
escolher
a cor pro
meu layout?
problema:
Fazer uma capa para
o manual do estudante
do IBES 2012 usando a
foto da bonitinha ao
lado.
As informações abaixo
são obrigatórias:
1 - Manual do Estudante
2 - 2012
3 - Ibes e Facsal
solução:
Use o filtro
«Mosaico» do
Photoshop para
reduzir as cores da
foto até um nível
aceitável.
solução:
Separe as cores,
começando pelas
mais presentes e
depois as mais
discretas.
Pele:
Cabelo:
Camisa:
Jeans:
Pele:
Use a ferramenta Eye Droper
ou Conta Gotas, no Corel,
Illustrator ou no Photoshop
para «copiar» as cores dos
pixels ampliados.
alternativa
solução: Você também pode se inscrever no site
kuler.adobe.com
e fazer sua paleta de maneira automatizada e rápida
solução:
Teste a imagem nos
fundos escolhidos
Neste exemplo vamos
utilizar a paleta criada no
kuler
cyan
magenta
yellow
black
61
35
0
55
0
0
1
5
0
31
58
25
0
48
75
35
0
46
72
55
solução: Escolha os tons mais apropriados para passar a
mensagem que deseja
Os azuis, aqui representando os tons
frios, transmitem relações confiáveis,
serenidade e modernidade
Os pastéis passam ideia de conforto,
confiança, antiguidade, seriedade
Uma vez escolhida a
cor base, é hora de
acrescentar cores
ao layout. Use um
círculo cromático
para isto.
solução: Crie paletas de cores. Há várias maneiras de fazer
isto usando o círculo cromático.
monocromática complementar
análoga
análoga
complementar
solução: Você pode usar o Kuler para montar estas paletas
por você!
solução: Crie o layout e aplique as cores.
cyan
magenta
yellow
black
100
81
32
18
85
58
0
0
70
43
3
0
24
47
100
5
45
57
100
35
Neste exemplo vamos utilizar a
paleta COMPLEMENTAR criada
no kuler.adobe.com
2012
manualdoestudante
IBES
FACSAL
solução: Crie o layout e aplique as cores. Neste exemplo vamos utilizar a
paleta TRIANGULAR criada no
kuler.adobe.com
2012
manualdoestudante
IBES
FACSAL
solução: Crie o layout e aplique as cores. Neste exemplo vamos utilizar a
paleta COMPLEMENTAR criada
no kuler.adobe.com
2012
manualdoestudante
IBES
FACSAL
Desta vez, alteramos
a cor base em cima da
qual a nova paleta foi
gerada.
2012
manualdoestudante
IBES
FACSAL
2012
manualdoestudante
IBES
FACSAL
2012
manualdoestudante
IBES
FACSAL
2012
manualdoestudante
IBES
FACSAL
2012
manualdoestudante
IBES
FACSAL
2012
manualdoestudante
IBES
FACSAL
Lorem
Ipsum
Dolor
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh
euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad
minim veniam, quis nostrud exerci tution ullam corper suscipit lobortis nisi ut
aliquip ex ea commodo consequat. Duis te feugi facilisi. Duis autem dolor in
hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat
nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent
luptatumzzrildelenitaugueduisdoloretefeugatnullafacilisi.
Lorem ipsum dolor sit amet, consectetuer adipiscing
elit, sed diem nonummy nibh euismod tincidunt ut
lacreet dolore magna aliguam erat volutpat. Ut wisis
enimadminimveniam,quisnostrudexercitutionullam
corper suscipit lobortis nisi ut aliquip ex ea commodo
consequat. Duis te feugi facilisi. Duis autem dolor in
hendrerit in vulputate velit esse molestie consequat,
Lorem
Ipsum
Dolor
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh
euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad
minim veniam, quis nostrud exerci tution ullam corper suscipit lobortis nisi ut
aliquip ex ea commodo consequat. Duis te feugi facilisi. Duis autem dolor in
hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat
nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent
luptatumzzrildelenitaugueduisdoloretefeugatnullafacilisi.
Lorem ipsum dolor sit amet, consectetuer adipiscing
elit, sed diem nonummy nibh euismod tincidunt ut
lacreet dolore magna aliguam erat volutpat. Ut wisis
enimadminimveniam,quisnostrudexercitutionullam
corper suscipit lobortis nisi ut aliquip ex ea commodo
consequat. Duis te feugi facilisi. Duis autem dolor in
hendrerit in vulputate velit esse molestie consequat,
Lorem
Ipsum
Dolor
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed
diem nonummy nibh euismod tincidunt ut lacreet dolore magna
aliguam erat volutpat. Ut wisis enim ad minim veniam, quis
nostrud exerci tution ullam corper suscipit lobortis nisi ut
aliquip ex ea commodo consequat. Duis te feugi facilisi. Duis
Loremipsumdolorsitamet,consectetuer
adipiscing elit, sed diem nonummy nibh
euismod tincidunt ut lacreet dolore
magna aliguam erat volutpat. Ut wisis
enim ad minim veniam, quis nostrud
Lorem
Ipsum
Dolor
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh
euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad
minim veniam, quis nostrud exerci tution ullam corper suscipit lobortis nisi ut
aliquip ex ea commodo consequat. Duis te feugi facilisi. Duis autem dolor in
hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat
nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent
luptatumzzrildelenitaugueduisdoloretefeugatnullafacilisi.
Lorem ipsum dolor sit amet, consectetuer adipiscing
elit, sed diem nonummy nibh euismod tincidunt ut
lacreet dolore magna aliguam erat volutpat. Ut wisis
enimadminimveniam,quisnostrudexercitutionullam
corper suscipit lobortis nisi ut aliquip ex ea commodo
consequat. Duis te feugi facilisi. Duis autem dolor in
hendrerit in vulputate velit esse molestie consequat,
Lorem
Ipsum
Dolor
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem
nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat
volutpat. Ut wisis enim ad minim veniam, quis nostrud exerci tution
ullamcorpersuscipitlobortisnisiutaliquipexeacommodoconsequat.
Duis te feugi facilisi. Duis autem dolor in hendrerit in vulputate velit
esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at
Lorem ipsum dolor sit amet, consectetuer
adipiscing elit, sed diem nonummy nibh
euismod tincidunt ut lacreet dolore magna
aliguam erat volutpat. Ut wisis enim ad minim
veniam,quisnostrudexercitutionullamcorper
suscipit lobortis nisi ut aliquip ex ea commodo
quinto
gse redo
Lorem ipsum dolor sit amet, consectetuer
adipiscing elit, sed diem nonummy nibh euismod
tincidunt ut lacreet dolore magna aliguam erat
volutpat. Ut wisis enim ad minim veniam, quis
nostrud exerci tution ullam corper suscipit lobortis
nisi ut aliquip ex ea commodo consequat. Duis te
feugi facilisi. Duis autem dolor in hendrerit in
Lorem ipsum dolor sit amet, consectetuer
adipiscing elit, sed diem nonummy nibh euismod
tincidunt ut lacreet dolore magna aliguam erat
volutpat. Ut wisis enim ad minim veniam, quis
nostrud exerci tution ullam corper suscipit lobortis
nisi ut aliquip ex ea commodo consequat. Duis te
feugi facilisi. Duis autem dolor in hendrerit in
Lorem ipsum dolor sit amet, consectetuer
adipiscing elit, sed diem nonummy nibh euismod
tincidunt ut lacreet dolore magna aliguam erat
volutpat. Ut wisis enim ad minim veniam, quis
nostrud exerci tution ullam corper suscipit lobortis
nisi ut aliquip ex ea commodo consequat. Duis te
feugi facilisi. Duis autem dolor in hendrerit in
Lorem ipsum dolor sit amet, consectetuer
adipiscing elit, sed diem nonummy nibh euismod
tincidunt ut lacreet dolore magna aliguam erat
volutpat. Ut wisis enim ad minim veniam, quis
nostrud exerci tution ullam corper suscipit lobortis
nisi ut aliquip ex ea commodo consequat. Duis te
feugi facilisi. Duis autem dolor in hendrerit in
quente,vibrante,
definido
opaco,maior vibrante,menor,
dançante
quantomais
magentaeamarelo,
maissemgraça
100%magenta,
coresquase
indistingíveis
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores
Aula Cores

Mais conteúdo relacionado

Mais de Daniel Branco

Posicionamento de Marcas
Posicionamento de MarcasPosicionamento de Marcas
Posicionamento de MarcasDaniel Branco
 
Como as marcas marcam 2013
Como as marcas marcam 2013Como as marcas marcam 2013
Como as marcas marcam 2013Daniel Branco
 
Experiência de marca
Experiência de marcaExperiência de marca
Experiência de marcaDaniel Branco
 
Design met criacao marcas 2012
Design met criacao marcas 2012Design met criacao marcas 2012
Design met criacao marcas 2012Daniel Branco
 

Mais de Daniel Branco (9)

Posicionamento de Marcas
Posicionamento de MarcasPosicionamento de Marcas
Posicionamento de Marcas
 
Branding 2014
Branding 2014Branding 2014
Branding 2014
 
O que e design 2013
O que e design 2013O que e design 2013
O que e design 2013
 
Como as marcas marcam 2013
Como as marcas marcam 2013Como as marcas marcam 2013
Como as marcas marcam 2013
 
Experiência de marca
Experiência de marcaExperiência de marca
Experiência de marca
 
Design met criacao marcas 2012
Design met criacao marcas 2012Design met criacao marcas 2012
Design met criacao marcas 2012
 
Aula fontes 2013
Aula fontes 2013Aula fontes 2013
Aula fontes 2013
 
Diagramação 2011
Diagramação 2011Diagramação 2011
Diagramação 2011
 
Redesign 2011
Redesign 2011Redesign 2011
Redesign 2011
 

Aula Cores

  • 2. cor cor Inteligência, comunicação, confiança, eficiência, serenidade Frieza, altivez, falta de emoção, apatia
  • 4. cor cor Consciência espiritual, refreamento, visão, luxo, verdade, qualidade Introversão, decadência, supressão, inferioridade
  • 6. cor cor Otimismo, confiança, auto-estima, extroversão, criatividade Irracionalidade, medo, fragilidade emocional, depressão, ansiedade
  • 8. cor cor Coragem física, força, calor, energia, masculinidade, agitação Desafio, agressão, impacto visual, tensão, acidente
  • 11. você é que bebeu pouco nenhuma cor é feia
  • 12. a cor não é uma coisa, é uma qualidade
  • 13. a cor não é uma coisa, é uma qualidade chamativa fresca feliz discreta aconchegante infantil
  • 14.
  • 15.
  • 19. e existe ausência de luz existe luz
  • 20.
  • 21.
  • 22.
  • 23.
  • 24. X???
  • 26.
  • 27.
  • 28.
  • 29.
  • 31. COM QUE COR EU VOU PRO PAGODE QUE VOCÊ ME CONVIDOU?
  • 32. COM QUE COR EU VOU PRO PAGODE QUE VOCÊ ME CONVIDOU?
  • 33. PARA USAR CORES, COMO NA MODA, NÃO EXISTE CERTO OU ERRADO.
  • 34. PARA USAR CORES, COMO NA MODA, NÃO EXISTE CERTO OU ERRADO. EXISTE CON TEX TOCONTEXTO
  • 35. AS CORES SÃO AS ROUPAS QUE VESTEM AS EMOÇÕES E SENSAÇÕES DAS COISAS, marcas, layouts, do mundo enfim.
  • 37. as cores não existem SOZINHAS
  • 39.
  • 40. Certo, entendi. Tem cor pra tudo. E cada cor empresta sua personalidade para a coisa que «veste» essa cor. Mas, Como escolher a cor pro meu layout?
  • 41. problema: Fazer uma capa para o manual do estudante do IBES 2012 usando a foto da bonitinha ao lado. As informações abaixo são obrigatórias: 1 - Manual do Estudante 2 - 2012 3 - Ibes e Facsal
  • 42. solução: Use o filtro «Mosaico» do Photoshop para reduzir as cores da foto até um nível aceitável.
  • 43. solução: Separe as cores, começando pelas mais presentes e depois as mais discretas. Pele: Cabelo: Camisa: Jeans: Pele: Use a ferramenta Eye Droper ou Conta Gotas, no Corel, Illustrator ou no Photoshop para «copiar» as cores dos pixels ampliados.
  • 44. alternativa solução: Você também pode se inscrever no site kuler.adobe.com e fazer sua paleta de maneira automatizada e rápida
  • 45. solução: Teste a imagem nos fundos escolhidos Neste exemplo vamos utilizar a paleta criada no kuler cyan magenta yellow black 61 35 0 55 0 0 1 5 0 31 58 25 0 48 75 35 0 46 72 55
  • 46. solução: Escolha os tons mais apropriados para passar a mensagem que deseja Os azuis, aqui representando os tons frios, transmitem relações confiáveis, serenidade e modernidade Os pastéis passam ideia de conforto, confiança, antiguidade, seriedade Uma vez escolhida a cor base, é hora de acrescentar cores ao layout. Use um círculo cromático para isto.
  • 47. solução: Crie paletas de cores. Há várias maneiras de fazer isto usando o círculo cromático. monocromática complementar análoga análoga complementar
  • 48. solução: Você pode usar o Kuler para montar estas paletas por você!
  • 49. solução: Crie o layout e aplique as cores. cyan magenta yellow black 100 81 32 18 85 58 0 0 70 43 3 0 24 47 100 5 45 57 100 35 Neste exemplo vamos utilizar a paleta COMPLEMENTAR criada no kuler.adobe.com 2012 manualdoestudante IBES FACSAL
  • 50. solução: Crie o layout e aplique as cores. Neste exemplo vamos utilizar a paleta TRIANGULAR criada no kuler.adobe.com 2012 manualdoestudante IBES FACSAL
  • 51. solução: Crie o layout e aplique as cores. Neste exemplo vamos utilizar a paleta COMPLEMENTAR criada no kuler.adobe.com 2012 manualdoestudante IBES FACSAL Desta vez, alteramos a cor base em cima da qual a nova paleta foi gerada.
  • 54.
  • 55.
  • 56.
  • 57.
  • 58.
  • 59. Lorem Ipsum Dolor Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad minim veniam, quis nostrud exerci tution ullam corper suscipit lobortis nisi ut aliquip ex ea commodo consequat. Duis te feugi facilisi. Duis autem dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatumzzrildelenitaugueduisdoloretefeugatnullafacilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enimadminimveniam,quisnostrudexercitutionullam corper suscipit lobortis nisi ut aliquip ex ea commodo consequat. Duis te feugi facilisi. Duis autem dolor in hendrerit in vulputate velit esse molestie consequat,
  • 60. Lorem Ipsum Dolor Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad minim veniam, quis nostrud exerci tution ullam corper suscipit lobortis nisi ut aliquip ex ea commodo consequat. Duis te feugi facilisi. Duis autem dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatumzzrildelenitaugueduisdoloretefeugatnullafacilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enimadminimveniam,quisnostrudexercitutionullam corper suscipit lobortis nisi ut aliquip ex ea commodo consequat. Duis te feugi facilisi. Duis autem dolor in hendrerit in vulputate velit esse molestie consequat,
  • 61. Lorem Ipsum Dolor Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad minim veniam, quis nostrud exerci tution ullam corper suscipit lobortis nisi ut aliquip ex ea commodo consequat. Duis te feugi facilisi. Duis Loremipsumdolorsitamet,consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad minim veniam, quis nostrud
  • 62. Lorem Ipsum Dolor Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad minim veniam, quis nostrud exerci tution ullam corper suscipit lobortis nisi ut aliquip ex ea commodo consequat. Duis te feugi facilisi. Duis autem dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatumzzrildelenitaugueduisdoloretefeugatnullafacilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enimadminimveniam,quisnostrudexercitutionullam corper suscipit lobortis nisi ut aliquip ex ea commodo consequat. Duis te feugi facilisi. Duis autem dolor in hendrerit in vulputate velit esse molestie consequat,
  • 63. Lorem Ipsum Dolor Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorpersuscipitlobortisnisiutaliquipexeacommodoconsequat. Duis te feugi facilisi. Duis autem dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad minim veniam,quisnostrudexercitutionullamcorper suscipit lobortis nisi ut aliquip ex ea commodo
  • 65.
  • 66.
  • 67.
  • 68.
  • 69.
  • 70.
  • 71.
  • 72.
  • 73.
  • 74. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad minim veniam, quis nostrud exerci tution ullam corper suscipit lobortis nisi ut aliquip ex ea commodo consequat. Duis te feugi facilisi. Duis autem dolor in hendrerit in Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad minim veniam, quis nostrud exerci tution ullam corper suscipit lobortis nisi ut aliquip ex ea commodo consequat. Duis te feugi facilisi. Duis autem dolor in hendrerit in Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad minim veniam, quis nostrud exerci tution ullam corper suscipit lobortis nisi ut aliquip ex ea commodo consequat. Duis te feugi facilisi. Duis autem dolor in hendrerit in Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad minim veniam, quis nostrud exerci tution ullam corper suscipit lobortis nisi ut aliquip ex ea commodo consequat. Duis te feugi facilisi. Duis autem dolor in hendrerit in quente,vibrante, definido opaco,maior vibrante,menor, dançante quantomais magentaeamarelo, maissemgraça 100%magenta, coresquase indistingíveis