Pixel Paradise
Gostaria de reagir a esta mensagem? Crie uma conta em poucos cliques ou inicie sessão para continuar.



 
InícioPortalProcurarÚltimas imagensRegistarEntrar

 

Tutorial isométrico

Ver o tópico anterior Ver o tópico seguinte Ir para baixo 
Autor Mensagem
Colossal
Andarilho
Andarilho
Colossal

Masculino
Idade : 29 Data de registro : 24/02/2009 Nº de mensagens : 69
Ranking
Nível:
Tutorial isométrico Left_bar_bleue1/100Tutorial isométrico Empty_bar_bleue  (1/100)
Pontos:
Tutorial isométrico Left_bar_bleue1/10Tutorial isométrico Empty_bar_bleue  (1/10)

Tutorial isométrico Vide
MensagemAssunto: Tutorial isométrico   Tutorial isométrico Icon_minitimeSáb Fev 28, 2009 10:54 pm

Nesse tutorial ensinarei o básico da arte do pixel art isométrico.

O que é Pixel Art isométrico?

Pixel Art isométrico nada mais é do que pixel art em uma base "diferente", numa visão " meio de frente meio de cima", como a Big Iso City do Gunstar Red ou o Rewound do Gas 13.

Pixel Art isométrico, é feito numa base de 27º ~ 30º, ficando assim:

1 pixel nas juntas:
Tutorial isométrico Isotuto1o

2 pixels na junta:
Tutorial isométrico Isotuto8

3 pixels na junta:
Tutorial isométrico Isotuto15

As três maneiras estão certas, escolha a que você acha melhor.

Veja, mais precisamente com zoom:

1 pixel na junta:
Tutorial isométrico Isotuto2

2 pixels na junta:
Tutorial isométrico Isotuto9

3 pixels na junta:
Tutorial isométrico Isotuto16

Observe que são:

dois pixel
...............dois pixel

Formando essa base da vista "meio de frente meio de cima".

Botando em pratica:

Bem simples para os iniciantes.
Esse é um quadrado normal:

Tutorial isométrico Isotuto5

Tentaremos tranformá-lo em um cubo:

Primeiro começaremos fazendo a base do cubo:

1 pixel na junta:
Tutorial isométrico Isotuto3

2 pixels na junta:
Tutorial isométrico Isotuto10

3 pixels na junta:
Tutorial isométrico Isotuto17


Obs.: Não precisa fazer a base inteira, se você só for usar a "parte de baixo", só fiz nesse caso, como parte do tutorial

Depois, a base, ou um "cubo":

1 pixel na junta:
Tutorial isométrico Isotuto4

2 pixels na junta:
Tutorial isométrico Isotuto11

3 pixel na junta:
Tutorial isométrico Isotuto18



Como? Fácil, faça linhas retas para fazer de "quinas" do cubo, depois faça outra base para ficar
encima.

Agora a coloração:

Usaremos 3 cores para faze-la:

No final ele ficará assim:

1 pixel na junta:
Tutorial isométrico Isotuto6

2 pixels na junta:
Tutorial isométrico Isotuto12

3 pixels na junta:
Tutorial isométrico Isotuto19

Mas eu vou explicar, na parte de cima do cubo, é aonde está vindo a iluminação dele, por isso, é a parte mais clara.
Na parte da esquerda, é aonde esta mais escuro, então é o lugar sombreado.
A parte da direita, não há nem a iluminação, nem sombreamento, vou cham-la de "parte normal".

É optativo, mas no final, você pode preencher as linhas dentro do cubo, o que o deixará assim:

1 pixel na junta:
Tutorial isométrico Isotuto7

2 pixels na junta:
Tutorial isométrico Isotuto14

3 pixels na junta:
Tutorial isométrico Isotuto20


Fim do tutorial.
-
Creditos ao Alien por ter dado a ideia de fazer uma forma geometrica e ao Nigt por me corrigiir perante aos pixels da junta

-------------------------------------------------
EDIT:
Versão 1.2


Última edição por Colossal em Dom Mar 01, 2009 7:55 pm, editado 3 vez(es)
Ir para o topo Ir para baixo
Nightmare
Moderador
Moderador
Nightmare

Masculino
Idade : 30 Data de registro : 20/02/2009 Nº de mensagens : 558
Ranking
Nível:
Tutorial isométrico Left_bar_bleue2/100Tutorial isométrico Empty_bar_bleue  (2/100)
Pontos:
Tutorial isométrico Left_bar_bleue2/10Tutorial isométrico Empty_bar_bleue  (2/10)

Tutorial isométrico Vide
MensagemAssunto: Re: Tutorial isométrico   Tutorial isométrico Icon_minitimeDom Mar 01, 2009 5:54 pm

Tem uma coisa errada aí, cara. Na junta das duas linhas não é um pixel só, são dois (alguns artistas fazem três).
Mas overall, não tá ruim, eu só acho melhor você arrumar isso.
Ir para o topo Ir para baixo
http://www.pixelparadise.forumeiros.com
Jão
Moderador
Moderador
Jão

Masculino
Idade : Data de registro : 24/02/2009 Nº de mensagens : 162
Ranking
Nível:
Tutorial isométrico Left_bar_bleue1/100Tutorial isométrico Empty_bar_bleue  (1/100)
Pontos:
Tutorial isométrico Left_bar_bleue9/10Tutorial isométrico Empty_bar_bleue  (9/10)

Tutorial isométrico Vide
MensagemAssunto: Re: Tutorial isométrico   Tutorial isométrico Icon_minitimeDom Mar 01, 2009 6:06 pm

Nighty escreveu:
Na junta das duas linhas não é um pixel só, são dois (alguns artistas fazem três).

Do mesmo jeito que tem artistas que usam um também. Na verdade, pixel art nunca é completamente "true" isométrico porque o ângulo correto ficaria muito quebrado (se fossem pixels em outros formatos, talvez desse pra fazer direito). A escolha de se usar dois pixels nessas bordas costuma ser por motivos de tiling, porque tiles precisam ser em múltiplos de 8. O site do Stoven explicava bem legal sobre isso, pena que ele tirou os tutos do ar :/
Ir para o topo Ir para baixo
BlackZero
Nativo
Nativo
BlackZero

Masculino
Idade : 29 Data de registro : 25/02/2009 Nº de mensagens : 327
Ranking
Nível:
Tutorial isométrico Left_bar_bleue3/100Tutorial isométrico Empty_bar_bleue  (3/100)
Pontos:
Tutorial isométrico Left_bar_bleue2/10Tutorial isométrico Empty_bar_bleue  (2/10)

Tutorial isométrico Vide
MensagemAssunto: Re: Tutorial isométrico   Tutorial isométrico Icon_minitimeDom Mar 01, 2009 6:10 pm

Na verdade os "Dois Pixels em Cima de Dois Pixels" formal um angulo de cerca de 27.4°
Ir para o topo Ir para baixo
Colossal
Andarilho
Andarilho
Colossal

Masculino
Idade : 29 Data de registro : 24/02/2009 Nº de mensagens : 69
Ranking
Nível:
Tutorial isométrico Left_bar_bleue1/100Tutorial isométrico Empty_bar_bleue  (1/100)
Pontos:
Tutorial isométrico Left_bar_bleue1/10Tutorial isométrico Empty_bar_bleue  (1/10)

Tutorial isométrico Vide
MensagemAssunto: Re: Tutorial isométrico   Tutorial isométrico Icon_minitimeDom Mar 01, 2009 6:47 pm

Nightmare escreveu:
Tem uma coisa errada aí, cara. Na junta das duas linhas não é um pixel só, são dois (alguns artistas fazem três).
Mas overall, não tá ruim, eu só acho melhor você arrumar isso.

Ali, eu só quis mostrar os dois pixels dois pixels, até porque eu aprendi nesse estilo.
Mas anyway, vou editar o tópico pondo os dois estilos.

EDIT:

Alias, valew Night, esse estilo de 2 pixel é bstante usado em tiselets de RPG pra não deixar quebrado.

EDIT 2:

Tutorial editado ^^
Ir para o topo Ir para baixo
Conteúdo patrocinado





Tutorial isométrico Vide
MensagemAssunto: Re: Tutorial isométrico   Tutorial isométrico Icon_minitime

Ir para o topo Ir para baixo

Tutorial isométrico

Ver o tópico anterior Ver o tópico seguinte Ir para o topo 
Página 1 de 1

Permissões neste sub-fórum Não podes responder a tópicos
Pixel Paradise :: Pixel Art :: Tutoriais -