Tutorial by Victinh0

[Victinh0 0]

Bem-vindos ao meu tutorial para spriters iniciantes.

Creditos:80% Victinh0 por fazer o tutorial & 20% Andre (Galiant) por me dar dicas e explicações que em algumas partes do tutorial as usei.

 

Se ouver algum erro, sugestao ou duvida comente no topico.

Ultima Atualização: 06/09/2010

Lembrando que se gostou Click em

 

#Começando#

 

Outline: É o formato do seu sprite

1-

2-

 

 

Tamanho: O tamanho dos spriters varia de 32x32, 64x64, 96x96. Os itens tem tamanho maximo de 32x32 como armors, legs, backpacks, etc.(os itens de slot)

 

1-

2-

3-

 

Formato da imagem:

Existem diversos formatos os mais conhecidos sao:

 

[spoiler=Formatos].PNG: Png é o melhor formato para sprites, ele é mais leve que o .BMP e tem a mesma qualidade sem contar que é otimo para fazer animações.

 

.JPG/.JPEG:

Formato muito usado e muito popular, ele é muito leve mas faz os arquivos perderem qualidade o que é pessimo para o spriter entao nao use esse formato.

 

.BMP:

Formato que armazena pixel por pixel, fazendo o arquivo nao perder qualidade, porem o tamanho do arquivo fica extremamente grande.

 

.Gif: Gifs sao normalmente usadas para fazer uma animação um bom exemplo sao os emotions.

 

 

 

Fundos: Fundos diferentes sao muito usados para uma melhor visualização do sprite.

Os que eu jah usei/uso:

Branco: Uso muito quando começo a criação do sprite.

Preto:Uso raramente quando preciso melhorar o AA, é muito bom jah que o outline some e vc visualiza bem o AA.

Azul e Verde: Sao otimos, eu os uso bastante sao otimos pra visualização do AA.

Rosa: Nao uso na criação do sprite, normalmente coloco ele quando termino, pra ja esta pronto pra 'entrar' em servidores.

#Coloração#

 

Saturação: É o quao 'forte' a cor é. Quanto menos saturação mais cinza ela fica.

 

1-

2-

 

Iluminação: É a luz existente num determinado espaço, no caso a luz solar reflete no material que você fizer tornando partes mais claras e algumas mais escuras dependendo do material.

Veja imagens em sites de buscas o seu material e veja como o material reflete a luz.

1-

 

 

Anti-Aliasing (AA) AA é um 'efeito' que diminui o serrilhado, deixando os pixels aparentemente mais aredondados.

1-

Sem AA a esquerda e com AA a direita.

PS:Cores com baixa saturação sao melhores para fazer AA.

 

#Laminas#

 

Agora botamos em pratica tudo que aprendemos anteriormente.

Peguei 1 outline que mostrei antes.

 

1-

 

Agora vamos ver como se faz 1 lamina:

 

2-

 

Azul: Pixels do AA com o Outline. Deve ser cada vez mais escuros conforme for chegando na ponta da lamina.

Verde: Lado onde bate mais luz. Os pixels devem perder Luminosidade conforme chegam mais perto do cabo.

Vermelho: Pixels do corte. Devem começar escuros na parte mais proxima do cabo e irem clareando até a parte mais clara da ponta.

Amarelo: Lado menos claro que a parte verde. Os pixels devem perder luminosidade conforme chegam mais perto do cabo, mas devem ter cores mais escuras do que os pixels do outro lado da lamina.

 

Entendo melhor:

[spoiler=Spoil -1]

 

[spoiler=Spoil -2]

 

 

#Video#

O Video mostra basicamente o que eu falei acima, fiz o formato identico ao de uma espada antiga minha.

 

Part - 1:

Part - 2:

 

Os videos nao tem audio, até pq nao sei editar (riariaria)

Nao reparem na "bagunça" que eu faço enquanto faço os sprites

 

Resultado do Video-Tutorial

[spoiler=Coment]No video nao termina bem assim só dei uma editada e uns retokes, mas eu fiz meio que na pressa no video até pq fico 5min cada video +/- imagine se eu fosse "lento" iria demorar uns 30min+ os dois

 

 

 

#Aprimorando o AA#

 

A seguir irei mostrar alguns erros, e algumas soluções.

Eu mesmo fiz essa logica, nao vi em outro lugar, e ninguem nunca me falou isso, eu aprendi assim talvez vendo sprites de spriters mais experientes.

Analizando:

Temos 1 sprite serrilhado (sem AA)

[spoiler=1]

 

Abaixo vemos a minha aplicação da minha logica.

[spoiler=2]

 

#Perspectiva#

Perspectiva "tibiana" é a perspectiva 45º, ou seja é como se você estivese vendo o sprite Inclinado para a esquerda.

 

#Humanoides#

Em contrução

 

Editado 19 Setembro, 2010 por Victinh0

[victorroxes20 0]

Nossa , adorei o tutorial , vai me ajudar muito em meus sprites

obrigado

[Bloxe 0]

caramba, bem melhor que os tutoriais que tem aqui, e a proposito, o tamanho MINIMO é 32x32, tu pois que é o maximo :X

[tigerx2 1]

wow, pra mim que to aprendendo um pouco,

ajudou bastante, ta muito bem explicadoo

parabens

[Falkon 0]

Muito bom tutorial

"Os itens tem tamanho maximo de 32x32."

Os itens tem tamanho maximo, e não os spriter em geral...

[Bloxe 0]

errei, D:

li na pressa e entendi sprites D:

[GM Devir 0]

Mtoo bom VictinhO, corrigindo um detalhe que vi:

 

"Os itens tem tamanho maximo de 32x32 ou seja nao pode passar disso."

Se você estava falando dos itens como equips que vão parar em 1 slot quando colocados na backpack por exemplo, tenta especificar, pois existem tbm de 4 sqms(box) e que são itens.

 

E esse Andre eu estava lendo o perspective 45 e realmente, ele ajuda muito. O Otbr e o fórum dele se complementam bem.

[Brad Pitt 0]

Legal seu tutorial parabéns (Y)

[ShufflezOr 0]

Meu primeiro tuto que estou lendo de sprite. õ/

Por sinal um ótimo tuto, parabens, tomare que me ajude a evoluir.

[Victinh0 0]

Adicionei 2 partes:

Duas partes novas:

Fundos e Aprimorando o AA

e reorganização do topico, logo, logo colocarei novos exemplos pra galera entender melhor.

E tentarei sempre atualizar o topico com tudo que eu souber explicar +/-

[CrimAngel 1]

Caso alguem venha perguntar para ele,aqui esta a resposta,SIM,eu deixei usar minhas sprites ridiculas(soh tenho ridiculas) aheuaheua...

[Victinh0 0]

Mais 1 atualização, parte "Entendo melhor" na area de laminas, e Botei 1 parte sobre formatos de arquivos pra galera que le o tutorial nunca mais salvar .jpg ¬_¬

Dicas?Erros no tutorial?Comente.

[Kreuusot 2]

Belo tutorial, parabens

[Freddkruguer 0]

Mto bom tutorial, so q eu gostaria de te pedir pra por um pedaço sobre AA em laminas de Swords, pq eu erro mto nisso, vou postar umas espadas q fiz, igual vc fez sobre o axe gostaria q vc fisseze um de lamina =D

 

 

e ja li bastante os tutoriais principalmente o do Galiant

[Victinh0 0]

Mto bom tutorial, so q eu gostaria de te pedir pra por um pedaço sobre AA em laminas de Swords, pq eu erro mto nisso, vou postar umas espadas q fiz, igual vc fez sobre o axe gostaria q vc fisseze um de lamina =D

 

 

e ja li bastante os tutoriais principalmente o do Galiant

Jah tem essa parte, na area "#Laminas#".

O AA na lamina (no outline) como eu falei no tutorial, começa Escuro (ponta) e termina claro quando termina a lamina (vai pra guarda)

"Pq começa escuro?"

Pois com isso da um efeito de diminuição visualmente, fazendo a lamina parecer mais afiada quando chega perto da ponta.

Lembrando que o "termina claro" é um claro comparado a parte escura mas nao fica muito claro.

Se tiver mais duvidas pode enviar seu MSN via PM que eu posso ajudar vc

 

Edit: Hj (04/09) atualizei o tutorial, adicionei 1 video (part 1 e 2) mostrando como fazer 1 espada, espero que vejam o video-tutorial e entendam, flw.

Lembrando que se gostou do tutorial click em

Editado 4 Setembro, 2010 por Victinh0

[Freddkruguer 0]

Fico mto bom o Video Tutorial, vai me ajudar bastante 8D

 

tpw akelas cores vc faz na hora ou vc tem uma tabela?!

 

se tiver vc pode postar ela?! tenho um pouco de dificuldade com orbs, mais se nao poder postar tudo bem.

[Victinh0 0]

Nao gosto de postar tabela.

É bom vc mesmo treinar pra conseguir fazer suas proprias, eu nao gosto de usar orbs odeio na verd mas isso vai de pessoa pra pessoa.

Pra espadas de metal o bom sao cores de baixa saturação (perto do cinza), as que eu uso pra espadas normalmente sao cinzas (saturação 0) e algumas cinzas-azuladas (saturação 30~35 normalmente).

[Freddkruguer 0]

a só. eu nao sei mexer mto bem com isso de saturaçao e talz eu sei so pra q q server luminosidade pokasopkasopkasko mais agora eu ja sei e vo treinar mais pra ficar melhor. obrigado 8D

[Siegrain 0]

Mto bom, agora consigo entender melhor as cores XD, sempre fazia um lado bem mais escuro q o outro u.u

[Victinh0 0]

Atualizando.

Dei uma editada em umas imagens, e criei 1 nova area a area "Bonus" onde esta a sessao (=O) de treino, com 1 outline e 1 tabela de cores prontinha pra vcs pintarem