13
Guia de cores Joao Paulo Battisti

1º WordPress Meetup Florianópolis - Guia de Cores para Design em Websites

  • Upload
    incuca

  • View
    183

  • Download
    1

Embed Size (px)

Citation preview

Page 1: 1º WordPress Meetup Florianópolis - Guia de Cores para Design em Websites

Guia de cores

Joao Paulo Battisti

Page 2: 1º WordPress Meetup Florianópolis - Guia de Cores para Design em Websites

a importância das cores

o significado das corescores mais e menos amadascontrasteAgradar a gregos e troianoscores na webusando cinza, preto e branco

Page 3: 1º WordPress Meetup Florianópolis - Guia de Cores para Design em Websites

o significado das cores

transmite sentimento;influenciam na decisão;no tempo de usabilidade;interferem na interação;atraem ou expulsam;suavizam ou agridem a visão.

Page 4: 1º WordPress Meetup Florianópolis - Guia de Cores para Design em Websites

o significado das cores

azuldepressãonostalgiafriezahonestosolidãoordemsinceridadetecnologiadesespero

vermelhoalertadinamismoagressividadeimpacienciaamordeterminaçãohumilhaçãorevoluçãoviolência

amareloenergiadoençaatividadedinheiroderrotaidealismocovardiafelicidadeexpansivo

Page 5: 1º WordPress Meetup Florianópolis - Guia de Cores para Design em Websites

cores mais e menos amadas

AzulverdevermelhopretoAmarelovioletaLaranjaBrancorosaMarromouro

45%15%12%10%6%3%3%2%2%1%1%

MarromrosaCinzavioletaLaranjaAmarelopretoverdevermelhoouroprataBrancoAzul

20%17%14%10%8%7%7%7%4%3%2%1%1%

Page 6: 1º WordPress Meetup Florianópolis - Guia de Cores para Design em Websites

contraste

hierarquizar informações;visibilidade;facilidade e rapidez;facilitar a interação;análoga para reforçar ideia;complementar para mais contraste.

Page 7: 1º WordPress Meetup Florianópolis - Guia de Cores para Design em Websites

contraste

cores análogas

Page 8: 1º WordPress Meetup Florianópolis - Guia de Cores para Design em Websites

contraste

cores complementares

Page 9: 1º WordPress Meetup Florianópolis - Guia de Cores para Design em Websites

agradar a gregos e troianos

considerar uma persona;considerar o usuário;usuários com pressa;material design - google;considerando a impressão;

Page 10: 1º WordPress Meetup Florianópolis - Guia de Cores para Design em Websites

cores na web

material design - google

Page 11: 1º WordPress Meetup Florianópolis - Guia de Cores para Design em Websites

cores na web

considerando a impressão.

cor visivel

cor rgb

pantone

cmyk

Page 12: 1º WordPress Meetup Florianópolis - Guia de Cores para Design em Websites

usando cinza, preto e branco

cinza como cor neutra;branco como área de trabalho;preto como detalhes e tipografia;mancha;preto 100%?

Page 13: 1º WordPress Meetup Florianópolis - Guia de Cores para Design em Websites

e um slide colorido