Tutorial Avançado de Sprites
Bom galera, depois do meu primeiro tutorial acho que muitas pessoas conseguiram aprender algumas coisinhas novas e muitos me falaram que gostaram bastante do tutorial, isso me levou a querer fazer um segundo, dessa vez mais avançado.
[ÍNDICE]
- Artigo 1: Realidade do Sprite
1 - Proporção
2 - Coerência
3 - Pintura avançada
4 - Sombreamento
- Artigo 2: Efeitos de Aparência
- Cromagem
- Petrificação
- Elemental do Fogo
- Elemental do Gelo
- Brilho externo
- Corrente ( Chain armors...etc )
- Artigo 3: Tópicos especiais de Pixel Art
Swords
- Swords
- Broadswords
- Laminas retorcidas
Clubs
- Em 90 graus
- Em 45 graus
Axes
- Laminas
- Cabos
Armors
- Ombreiras
- Peitoral
Legs
- Desenho
- Sombreamento simples
- Artigo 4: Perspectiva
- Paredes
- Mesas
- Humanoides
- Quadrúpedes
- Grama
- Plantas de Decoração
- Árvores
- Pedras
Citação:
POR FAVOR! NÃO COMENTEM ATÉ QUE TODOS OS TÓPICOS DO TUTORIAL TENHAM SIDO FEITOS
Apêndice I: Smooth Techniques(Técnicas de suavização)
Apêndice I: Smooth Techniques(Técnicas de suavização)
Certo, resolvi criar um tutorial porque essa é uma técnica bastante difícil até para os melhores artistas que conheço...de fato acho que apenas eu e mais 4 artistas comtemporâneos conseguimos dominar bem essa técnica e espero que depois desse tutorial esse número e multiplique, já que é uma técnica muito importante para a apresentação de um sprite.
Vamos lá então...
Como é de costume de todos, sempre ficamos impressionados com sprites maravilhosos dos novos e esforçados artistas que vem surgindo ( graças a Deus ) e principalmente dos nossos veteranos mais antigos que estão sempre buscando se atualizar...
Pois eu digo que muitos deles podem melhorar...mesmo os mais belos.
Vejamos como:
A técnica de smooth pode ser separada em 3 técnicas menores já que o efeito de Smooth só é alcançado quando há uma união perfeita (ou quase perfeita) destas 3 ténicas. São elas:
- Outline(formato, contorno do sprite)
O outline, ou simplesmente "contorno" é uma peça fundamental para o sprite...seja ele preto ou não...mas o mais importante é assumir um formato que defina perfeitamente os detalhes que queremos para nosso sprite.
Vejamos um exemplo simples:
http://img201.imageshack.us/img201/2829/axescq5.png
Obviamente o exemplo 2 tem um outline bem melhor do que o exemplo 1, certo?! Vejam como está mais bem arredondado em comparação com o a superfície reta da lamina do primeiro!
Citação:
E acreditem! Ainda se ve muitos sprites do exemplo 1
Mas claro...o exemplo um não está errado, na verdade é por isso que muitas pessoas fazem assim! haha vejam só:
http://img201.imageshack.us/img201/2724/axe2ae9.png
Uma combinação de AA com o outline já é capaz de fazer o efeito de curvatura, MESMO QUE O OUTLINE NÃO SEJA CURVO
Uma coisa que poucas pessoas sabem é que o antialiasing não é uma técnica de suavização útil somente pra pixels da mesma cor (em diferentes luminosidades) mas também para pixels de cores diferentes.
Todos devem se lembrar da escola, quando se misturava cores primárias( azul, amarelo e vermelho ) e se conseguiam cores secundárias( verde, roxo, laranja, marrom etc )
Assim também funciona em nossos pixels, um pixel que ligue um pixel amarelo com um azul, deve ser verde...assim a borda ira assumir uma suave consistência. Feito isso, se vale das técnicas de contraste para dar uma amarencia mais enrigessida à superfície que vc estava previamente suavizando.
Em resumo: SUAVIZAR AS DIFERENÇAS COM AA e tornar a superfície ENRIGESSIDA(DURA) COM CONTRASTE.
Aqui vão alguns exemplos:
Armor 1
http://img408.imageshack.us/img408/2582/armorsr3.png
Aqui temos um exemplo de uma armadura muito bem desenhada e com boas cores...a princípio ninguém jamais diria que existe algo errado com ela, mas de fato, há vários erros nos detalhes como veremos a frente...
http://img408.imageshack.us/img408/9056/armorre3.png
Na ombreira à nossa direita temos uma curvatura bastante pixelizada(apesar de n parecer)
Na esquerda temos uma curvatura pixelizada da parte prateada da ombreira...
O centro tem AA em azul, quando deveria ser em uma cor que mesclasse com as bordas: amarelo ou marrom claro.
As bordas laterais do cinturão não seguem até o fim da armadura...
E a parte central ( adorno ) não está simétrico...
A seguir veremos as mudanças:
Essa é mais ou menos a versão que traduz como eu editei essa armadura:
http://img517.imageshack.us/img517/6...rrectedsl4.png
Comparem:
http://img408.imageshack.us/img408/2538/smoothitpe4.gif