O TEMA DO FÓRUM ESTÁ EM MANUTENÇÃO. FEEDBACKS AQUI: ACESSAR

O Estudo das Cores no Mundo dos Games!

Iniciado por Geraldo de Rívia, 22/03/2016 às 21:26

22/03/2016 às 21:26 Última edição: 03/09/2016 às 12:55 por King Gerar


"Para quem busca criar os próprios gráficos para seu projeto ou mesmo os que editam buscando harmonizar as cores dos cenários em geral, o visual do jogo é um ponto crucial. Mais do que uma tela bonita, cores bem escolhidas, calibradas e combinadas, retratam o tema, a época, o sentimento e muitas outras informações que o jogo quer passar para o jogador. Isso além do papel de atrair a atenção do jogador para pontos específicos, como destacar um item ou o nome de um personagem e, com certeza, influenciar na experiência do player. Ou você ainda acha que o famoso Limbo foi feito em preto e branco porque faltaram lápis de cor?"

[box class=plainbox]O que é cor?[/box]

      Antes de tudo, é bom sabermos o que iremos estudar, não é mesmo?
     Por mais mínimo que seja nosso conhecimento sobre esse termo, sabemos distinguir a cor daquilo que vemos. O que melhor para caracterizar a logomarca do facebook do que um efe num quadrado azul escuro? Pois bem, mas saibam que existe mais do que um sistema de cores, sendo assim, há mais de um modo de chegarmos a... àquele azul escuro, por exemplo, mas nesta matéria veremos sobre o sistema aditivo de cores, ou que você já deve estar cansado de ver no RPG Maker: RGB.
     No sistema RGB temos inicialmente três cores: vermelho(red), verde(green) e azul(blue), que são as conhecidas cores primárias da luz. Nossos jogos são feitos para serem visualizados em monitores. Monitores emitem luz. Logo, as cores que escolhemos são geradas por esse sistema, por isso é interessante saber como ele funciona. Esse também é chamado de sistema aditivo de cores, pois para formarmos novas cores precisamos adicionar quantidades de uma cor à outra, como por exemplo, se adicionarmos vermelho e verde ao azul, teremos o branco.
     Mas para formarmos cores diferentes precisamos de proporções diferentes de cada cor. Desse modo, cada cor primária é dividida numa escala de 256 cores. Lembra quando você vai mudar a tonalidade do mapa e tem lá aquela barrinha de cores? Então. E multiplicando 256 do vermelho, 256 do verde e 256 do azul temos mais de 16,5 milhões de cores pra usarmos em nossos games!

Imagem do jogo pra lá de colorido: FEZ

[box class=plainbox]O Círculo Cromático[/box]

     O círculo cromático foi criado em 1666, por ninguém mais, ninguém menos que Isaac Newton. Newtinho - como gosto de o chamar - havia dividido um raio de luz nas cores do arco-íris, e criou esse círculo com o intuito de mostrar que a luz, até então tida como branca, na verdade era tão colorida quanto poderia ser. Provamos isso girando o círculo cromático rapidamente.
     Ele geralmente é composto por 12 cores, sendo elas: vermelho, azul-escuro e verde, que são nossas cores primárias; magenta, amarelo e ciano, que são nossas cores secundárias (e são as cores primárias no sistema CMYK, mas essa é só uma informação a mais); e as cores terciárias, laranja, verde-amarelado, verde-azulado, azul, violeta e coral/rosa).


     Creio que na época ele não pensava muito na aplicação disso no universo dos jogos, mas o círculo cromático é muito útil para nós na escolha das cores. Com esse círculo à nossa disposição podemos escolher melhor cores que trabalham de maneira harmoniosa juntas, que ao mesmo tempo combinam, deixam a tela bonita e dão o devido destaque aos elementos nela. E essa harmonia pode ser alcançada principalmente de três formas: entre cores análogas; entre cores complementares e; em tríade. Sacode a cadeira aí, que agora a matéria começa de verdade.

[box class=plainbox]Cores Análogas[/box]

     Cores análogas são cores tidas como vizinhas no círculo cromático. Por exemplo, caso você escolha o azul-escuro como sua cor principal, o violeta e o azul serão duas cores análogas do azul-escuro. Essa escolha de cores é convenientemente utilizada em jogos com o visual de pouca saturação, passando uma imagem mais fria. The Elder Scrolls V - Skyrim é um jogaço que aproveita muito bem essa harmonia, principalmente em cenários em que há neve presente. Mas ninguém para representar cores análogas do que Don't Starve.

     

[box class=plainbox]Cores Complementares[/box]

     Cores complementares estão posicionadas no lado oposto umas às outras no círculo cromático. É, sem dúvidas, o modo harmônico de cores mais utilizados no mundo dos jogos, pois é o modo que mais destaca alguns objetos em relação à outros. Um exemplo fácil? Pode ser uma boa explicação para o Luigi ser verde. Outro exemplo mais do que óbvio está em Portals.

     

[box class=plainbox]Tríade[/box]

     Tríade é o modo mais interessante, por trabalhar a harmonia de três cores opostas entre si. É bastante aplicado quando se busca contraste entre os elementos, geralmente pequenos, como uma partícula na tela, uma hud ou algum texto informativo. É também aplicado em personagens, principalmente na composição cabelo-camisa-calça, onde cada elemento ganha uma das cores. Um exemplo é o Sonic, que utiliza o azul-escuro, vermelho e amarelo, bem como nosso Homem de Aço.

     

[box class=plainbox]Matiz, Saturação e Luminosidade[/box]

     Mas aí você lembra de Limbo, o primeiro exemplo que citei nesta matéria, e me pergunta: Mas ele não apresenta cor, qual sua explicação para ele ser preto e branco? É aí que entram mais dois parâmetros fundamentais na escolha da cor final.
     Em Journey vemos, na maioria do gameplay, uma tela variando em uma única cor. Mas esta cor não é naquela tonalidade que vimos no círculo cromático, tanto é que diferenciamos bem os objetos no cenário, mesmo sendo de cores muito parecidas, certo? Isto porque no círculo escolhemos somente a matiz da cor, sendo esta a mistura das cores no mais alto valor de suas escalas (256, lembram?). Após escolhermos a matiz, precisamos também calibrar: a saturação, que vai ditar o quão viva será a cor e com isso um contraste maior ou menor em relação às outras em sua volta e; a luminosidade, que dita o quão clara ou escura será a cor. E após esses ajustes, aí sim conseguimos cenários que, mesmo com uma única cor, são bem coloridos, harmônicos e transmitem todo sentimento que foram feitos para transmitir.


[box class=plainbox]Sensações das cores[/box]

     Outro fator que também pode influenciar na escolha da cor é o que você quer transmitir com ela. Nesse texto já frisei algumas vezes isso, agora é hora que apresentar um pequeno leque de sensações que algumas cores transmitem. Vale lembrar que a cor sozinha e isolada não vai ser totalmente responsável por o que o jogador sente, vai depender muito do restante do cenário.

Amarelo: Luminosidade, Alegria, Ludicidade, Criatividade. Indicado sempre a projetos para crianças.
Laranja: Dinâmica, Estímulo, Força, Comunicação.
Vermelho: Comando, Ação, Atenção. É a cor que mais mexe com os instintos humanos. Use com moderação!
Verde: O verde puro é o ponto de equilíbrio entre a emoção e a razão. É a cor da Natureza, da Sorte, da Segurança.
Azul: Racional, Individualista. Dependendo da matiz, cor da Limpeza, da Educação.
Violeta: Luxo, Nobreza e Vaidade.


E pra fechar com chave de ouro - ouro que é amerelo - ficam aí algumas dicas da autora da matéria na qual me baseei para escrever esta.

1 • Crie sempre paletas reduzidas, pois não é necessário (normalmente), utilizar um número muito grande de cores em um mesmo jogo.
2 • Antes de escolher as cores, leve em consideração o tipo de jogo, o estilo do jogo, em que época acontece, o local, o tipo de cenário, a idade dos jogadores, os personagens, entre outras coisas.
3 • Um bom contraste depende da escolha correta de dois elementos: da figura e do fundo.
4 • Você pode escolher uma cor como elemento de destaque para seu jogo.
5 • Muito importante dizer também que as cores não fazem só o papel de deixar o jogo bonito. Elas têm a função de "levar" o olhar do jogador para o lugar certo no monitor, auxiliando-o na jogabilidade.
6 • No universo dos games, as cores ajudam a contar uma história, a criar harmonia e integração, e a movimentar o jogador.

[box class=plainbox]Conclusão[/box]

E então, você já se tocou do quão importante pode ser escolher as cores dos elementos de seu projeto? Quando tiver essa dúvida, lembre-se dos grandes jogos que você adora e observe o que tem de peculiar no visual deles. Certamente encontrará alguma característica nas cores que tornou esse jogo tão belo na sua opinião. Então fica aí a minha dica pessoal: quando estiver planejando ou recolhendo os recursos para utilizar em seu projeto, mentalize bem o visual que irá buscar e procure deixar os gráficos ao redor disso. Pode parecer frescura ou até um detalhe insignificante, mas vá juntando detalhes aqui e ali e conseguirá ver um jogo diferente de todos os outros, simplesmente por causa desses detalhes.

Quem quiser brincar com esses sistemas de cores: Paletton


Matéria baseada no artigo A Importância do Estudo das Cores no Desenvolvimento de Games de Patrícia Tamega

Poxa, isso com certeza é bem interessante e muito útil!

Mais um dos tópicos da CRM que vão para minha barra de favoritos, afinal, vai dar aquela ajuda na hora de criar uma harmonia legal pro visual do projeto.

Ótima matéria King:XD:


Fantástico King. Eu já havia estudado um pouco sobre as cores mas isso foi bem interessante pra me ajudar a entender melhor!




Só uma observação. Nessa parte você quis se referir ao Superman certo? Então seria Homem de Aço.

Citação de: King Gerar online 22/03/2016 às 21:26
bem como nosso Homem de Ferro.


Citação de: Draken online 23/03/2016 às 07:15
[...]
Só uma observação. Nessa parte você quis se referir ao Superman certo? Então seria Homem de Aço.
Eu sabia que seria melhor colocar Clark Kent  :derp:
Valeu pelo alerta, Draken!

E que bom que curtiram, pessoal! o/

Saudações!

Parabéns pelo texto, ficou realmente muito bom e interessante!

Sucesso sempre!

Até mais!
Canal YouTube: https://www.youtube.com/channel/UCYZbBHdVs1zKPJi-epNZB-w

Visitem também minha idéia de jogo (A Jornada): http://centrorpg.com/index.php?topic=14189.0

E...gostaria de ter um review do seu jogo/projeto? Veja como em: http://centrorpg.com/index.php?topic=14491.0

Muito bom o tópico, Gear! Acho isso muito importante pra gente que faz pixel art, pois como trabalhamos como um número extremamente limitado de cores cada cor deve ser escolhida sabiamente!

 :clap: :clap: :clap: :clap:
Excelente, mais um daqueles que você fica de boca no chão.
Uma coisa que eu não havia pensado, mais é super importante!
Parabéns!
No meu jogo vou usar bastante o marrom: Para passar uma ideia morta.
Estou fazendo a escolha certa?
(Usarei o marrom nas partes exteriores).
Valeu pelo tópico, até!

Muito interessante, sempre busco aplicar esses conceitos, mesmo que seja para dar apenas uma editada ou uma cinematografia ou climatização um pouco mais harmônica. Não apenas com cores de tela, mas com eventos luminosos, e pictures sobrepondo a tela. principalmente com a aplicação de cores Análogas, da uma ar de conforto ao jogo.

Spoiler
[close]

Gostaria de usar a carta do reavivamento para dizer que esta matéria é a coisa mais útil que eu já vi, haha'
Estou ansioso para ver mais matérias assim. Queria agradecer ao Gerar também por ter produzido essa ótima matéria.

Graças a carta do Alisson eu pude ver essa ótima matéria, com certeza é coisas que devem ser levadas em considerações, agora eu sei o que fazer pra deixar o jogo meio dark, ou um tom feliz. Obrigado!
Veja meu projeto em andamento (24/7/2016):


Apoio: