Ir para conteúdo
  • Cadastre-se

TUTORIAL [TUTORIAL] Entendendo o Básico sobre cores - Spriting


Posts Recomendados

Tutorial básico sobre cores.




Vejo no fórum e em outros locais, está dúvida sobre, como e que cores devo utilizar, tais motivos me levaram a passar o que aprendi sobre as cores ultimamente

Neste tutorial, vou explicar como funcionam as cores análogas, a monocromia, como usar ambas para nos spriters, e algumas técnicas de montagem de paleta. Este também, irá  nos ajudar na Pintura Básica e Antialiasing (AA). Então vamos lá ;

Cores Análogas e complementares:

 

  • Cores análogas são cores que ficam lado a lado no disco de cores, e são tidas como análogas por dividirem a mesma cor base. Por exemplo, na imagem a baixo podemos ver o azul do meio ao seu lado duas cores análogas:

 

 

  • collour_disc_complementar_analoga.png



Para que essa ideia serve no spriting?

 

  • As cores análogas irão dar uniformidade e equilíbrio no sprite e também irá recheá-lo com uma elegância, será agradável ao nossos olhos de ver, cores desse tipo são muito usadas no nosso cotidiano, tornando o olhar mais agradável devido a calma que a uniformidade causa, não sendo nada diferente nos sprites. Podemos também utilizar as cores complementares para equilibrar o sprite, ou na montagem de paleta para obter uma nova pigmentação que pode atingir aquela tonalidade que você quer!
  • Já as cores complementares são as cores opostas no diâmetro do circulo cromático, são sempre duas cores que se contrastam muito.
    Em uma escala monocromática para que as cores fiquem tanto análogas como complementares precisam estar sempre no mesmo nível saturação.



Monocromia:

 

  • A monocromia é bem simples de entender, é simplesmente a adição de preto ou branco em uma única tonalidade de cor sem alterar a cor base. Um bom exemplo é um degrade de escala de cinza. Segue exemplo a imagem a baixo:


monocromia.png

 

  • Na primeira da esquerda para direita uma escala de cinza simples feitas apenas reduzindo o valor luminoso dela (adição de preto/branco) Já na segunda a mesma escala com a cor primária vermelho, terceira imagem apenas com adição de branco, e na quarta apenas adição de preto.



A grande maioria de nós spriters começou sombreando os sprites assim, fazendo com que o sprite fique morto e frio. Ao decorrer de treinos, novos trabalhos e muita prática, a percepção para adicionar novos pigmentos para dar o volume, sombra, contraste e os reflexos, desejados, irão aos poucos evoluindo de forma natural.

Adivinha como é feito é na teoria? Aha! Ai estão as cores análogas! Mas como assim, as cores análogas não funcionam só com cores da mesma saturação?
Sim realmente, mas duas escalas monocromáticas, uma para cada cor, teremos 2 pigmentações que se uniformizarão na imagem. É ai que está o segredo dos sprites com as cores análogas, não, logicamente, esta teoria é para ser seguida a, mas seu conceito é sim importante na criação da paleta, podendo ser complementada com cores terciárias em outra escala monocromática. Como por exemplo esse círculo cromático a baixo.
cores_monocramoticas_analogas.png

Técnicas simples para extração de cor para montagem de paleta.

De fato algo muito simples que muito provavelmente todos sabem, mas para esclarecer, e simplificar, vou mostrar métodos simples, fáceis e eficazes para mesclar cores.

Vou utilizar o programa básico que todos nós usamos, é uma técnica muito fácil  e funciona com qualquer programa  que tenha pincéis com AA automático;
technic_explain.png

 

  • Inicialmente separe as cores bases que deseja usar, e selecione o pincel, faça uma mancha com a cor desejada, um circulo um quadrado de um tamanho razoável.

 

 

  • Agora seleciona uma nova cor, a qual você deseja misturar, e simplesmente passe o pincel por cima da cor base.

 

 

  • Feito isso, aproxime a imagem e note que o AA automático do programa mesclou as cores, gerando um meio termo entre as duas, você pode utilizar esse meio termo em uma nova mistura para pegar um pigmento ainda mais parecido com a cor caso não esteja o suficiente.




Pronto, você já sabe como fazer para mesclar agora só utilizar sua criatividade para aperfeiçoar sua paleta, buscando cada vez mais cores que irão harmonizar ou contrastar causando um efeito lindo no sprite

 

 

É isso ai meus amigos, chegamos ao fim de mais um tutorial simples, porém de extrema importância para aqueles que queiram se aventurar conosco haha

 

Espero ter ajudado alguém com este tutorial, e espero ver os resultados deste tuto aplicados nos show off's da vida por aqui haha

 

Grande abraço e até o próximo tutorial!

 

Créditos:

Weto (tutorial)

Thayam (compartilhamento no fórum)

Editado por Thayam (veja o histórico de edições)
Link para o post
Compartilhar em outros sites

Apenas corrigindo... André é o dono do P45, mas não é responsável por todo conteúdo do fórum, o autor deste tópico é o Weto, portanto os devidos créditos são dele e não do André.

 

Sem duvida é um ótimo tutorial, tenho certeza que vai ajudar muitos.

 

 

 

Nós somos aquilo que fazemos repetidamente. Excelência, não é um modo de agir, mas um hábito.

                                                                                                                                                                                                                                        Aristóteles 

Link para o post
Compartilhar em outros sites

Apenas corrigindo... André é o dono do P45, mas não é responsável por todo conteúdo do fórum, o autor deste tópico é o Weto, portanto os devidos créditos são dele e não do André.

 

Sem duvida é um ótimo tutorial, tenho certeza que vai ajudar muitos.

Créditos corrigidos, agradeço a dica Mestre!

Link para o post
Compartilhar em outros sites
  • 2 weeks later...

Rapaz, legal você trazer o meu tutorial pra cá e tudo, mas porque é "meus trabalhos" na sua assinatura se você só deu um control + c + v aqui?

Editado por Ewerton Weto Costa (veja o histórico de edições)

IHWPF.png3UfC0.pngipNdU.png

Vendo sprites perspectiva e items.

Até 128x128 px contato: [email protected] ou mande uma mensagem pelo tibia king.

Link para o post
Compartilhar em outros sites

Rapaz, legal você trazer o meu tutorial pra cá e tudo, mas porque é "meus trabalhos" na sua assinatura se você só deu um control + c + v aqui?

Meus trabalhos e e trabalhos de minha autoria são contextos totalmente diferentes :)

A autoria e os créditos são seus, mais o trabalho de trazer para o TK fui eu quem tive, então, não considero nada injusto/errado.

É um ótimo tutorial que me ajudou e ajuda até hoje, achei interessante traze-lo ao tk. Espero que não tenha problemas :)

Editado por Thayam (veja o histórico de edições)
Link para o post
Compartilhar em outros sites

Participe da conversa

Você pode postar agora e se cadastrar mais tarde. Se você tem uma conta, faça o login para postar com sua conta.

Visitante
Responder

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emojis são permitidos.

×   Seu link foi automaticamente incorporado.   Mostrar como link

×   Seu conteúdo anterior foi restaurado.   Limpar o editor

×   Não é possível colar imagens diretamente. Carregar ou inserir imagens do URL.

  • Quem Está Navegando   0 membros estão online

    Nenhum usuário registrado visualizando esta página.

  • Conteúdo Similar

    • Por Underewar
      Tutorial: Criando um Sistema de Enviar efeito com OTClient.


       
      Neste tutorial, vamos criar um sistema simples de Enviar efeito no OTClient.
      Este sistema permitirá que os jogadores ativem um efeito especial e vejam uma janela ao clicar em um botão específico.
      Pré-requisitos:
      Ambiente de Desenvolvimento:
      Certifique-se de ter um ambiente de desenvolvimento configurado com OTClient Edubart. Conhecimento Básico em Lua:
      Familiaridade com a linguagem de script Lua.
       
      Passo 1: Estrutura do projeto
       
      Organize seu projeto conforme abaixo:

      OTC / MODS



      Passo 2: Criando a Interface Gráfica (OTUI)

      game_pass.otui
      Repare que em nossa interface nossos botões de ação entram no caminho do module e iniciam uma função que esta disponivel em nosso game_pass.lua (Client-Side)

       



      Passo 3: Criando funções Client-Side

      Agora com as funções criada podemos chamar elas de acordo com a necessidade em nosso arquivo de interface.
      Por exemplo a função effect() que foi chamada em nosso arquivo de interface.otui agora é criada aqui para mostrar o efeito ao jogador.

      game_pass.lua
       
       
      Passo 4: Registrando o novo Mod

      Agora podemos registrar e iniciar nosso modulo usando o arquivo de configuração

      game_pass.otmod
       

      Feito isso ja podemos ver nosso module no client e enviar opcodes através do gameprotocol e também receber o buffer para manipular os dados podemos utilizar :
      protocolGame:sendExtendedOpcode(14, "1")
      Basicamente oque estamos fazendo é armazenando o valor 1 na variaval 14 do ExtendedOpcode e futuramente podemos recuperar esse valor.

      Recuperamos esse valor em nosso server side data/creatuerscript/otc/game_pass.lua

      Verificando se o opcode é 14 se for 14 então fazemos x ação.

      Show, tendo isso em mente para que o nosso client-side consiga receber com sucesso o efeito enviado ao jogador então utilizamos 

      Passo 5: Criando o Server-side responsavel por enviar o efeito correto ao jogador dependendo do opcode selecionado no nosso cliente.

      data/creaturescripts/otc/game_pass.lua
       
      Passo 6: Registrando o evento para evitar erros futuros!
      Para que tudo funcione corretamente sem erros é  necessário registrar o evento no creaturescript.xml / login.lua

      creaturescript.xml
      <event type="extendedopcode" name="GamePass" script="otc/game_pass.lua" />
      login.lua
          player:registerEvent("GamePass")  


      Ótimo agora ao selecionar o menu recompensa o jogador recebera um efeito.

      Espero que tenha ficado claro como usar Opcodes/ExetendedOpcodes.

      Arquivos usados no tutorrial:
      OTC MODULE
      game_pass.rar
      Creaturescript
      game_pass.lua

      Vi muitos tutoriais desatualizado então resolvi trazer esse!
      Reparem que nesse caso passamos creature como parametro do buffer isso porque precisamos enviar um efeito no player.

      Melhorando a formatação com JSON Encoder

       
       
    • Por guiferr
      Alguem me ensina a descompilar as sprites do ot pokemon ou me manda ela atualiazada 2023? por favor
       
    • Por ArisenCodex
      Olá galera do TK, após um bom tempo parado resolvi voltar a me aventurar nesse mundo de arte digital, dessa vez não me limitando apenas ao estilo original do Tibia, estarei postando aqui as sprites/pixel arts que eu for criando, aceito críticas construtivas e sugestões desde colaborem para meu desenvolvimento. Inicialmente estarei fazendo pixel art/sprites simples e vou aumentando a qualidade conforme for evoluindo, enfim, espero que gostem.
       
      Uma casca de banana
      Uma roda de queijo cortada (sei que essa precisa de mais polimento, mas por enquanto é oque consigo fazer)
      Estarei atualizando o post conforme mais pixel art/sprites forem sendo criadas.?️
    • Por Foxy0
      Estou pensando em criar um ndbo, andei estudando como meche com sources,mapa,programaçao etc mais estou sem sprites queria sprites de ndbo para adicionar em meu servidor!, se alguem poder doar algumas sprites agradeço ( um client esta otimo  so quero algumas vocaçoes )
       
    • Por Anonymus Sprite
      Salve galera vi que tem pessoas vendendo esses programas que pega SPRITES de qualquer servidor sao 2 programas q estrao de graça, vim trazer informações de como usá-los fiz um video com tudo q precisa espero q gostem !!! ?                                                                                                                                                                              
      https://www.youtube.com/watch?v=AjRg2SPteNQ  
×
×
  • Criar Novo...

Informação Importante

Confirmação de Termo