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

Aula Mapeamento # 1 Intermediário / Interior

Iniciado por Makers, 04/03/2015 às 18:52



[box2 class=titlebg title=Introdução]Bem vindos a primeira aula, da segunda parte de aulas de mapeamento. Hoje, iremos entrar no intermediário. Aprendendo um pouco mais sobre a arte de enfeitar seus mapas usando programas de edição. Começando com o trabalho em cima de um mapa interior, mais exatamente, uma taverna.[/box2]

[box2 class=titlebg title= Etapa #1]Nessa primeira etapa, irei mostrar o mapa que estou utilizando pra ser a base. Fiz ele rapidinho, bem simples. Nem é necessário explicar como foi feito. Enfim, ai ele:

[hs width=320 height=240]http://i.cubeupload.com/oEa97A.png[/hs]

Como podem ver, não tem nada de especial. O que realmente é bom, pois iremos colocar o "especial" que seria os detalhes, no programa de edição. Que por sinal irei usar o Gimp. Muito simples e compacto. Com as mesmas funcionalidades do Photoshop. Baixe ele aqui, totalmente grátis.[/box2]

[box2 class=titlebg title=Etapa #2]Agora vamos começar a por a mão na massa. Primeiro iremos colocar o mapa no programa. Pode-se usar um script que tira o print do mapa todo, ou como no meu caso onde o mapa é pequeno, podemos bater um print do mapa no próprio editor. Dai então, abra o Gimp e de um Ctrl+V. Ficando assim (não liguem pra versão do meu gimp, meu pc só roda essa):

[hs width=320 height=240]http://i.cubeupload.com/4o1AR0.png[/hs]

Agora, basta selecionar a ferramenta Seleção Retangular. E apenas pegue a parte do mapa. Ou seja, todo o contorno do preto, deixando o exterior de lado. Fazendo isso, basta dar um Ctrl+C e depois colar com Ctrl+V em uma folha nova, mas que esteja sem nenhum tamanho, onde a foto que está no Ctrl+C se tornará a seleção.[/box2]

[box2 class=titlebg title=Etapa #3]Agora, com nosso mapa pronto no editor, vamos começar a trabalhar. Nessa parte irei ensinar um pouco até mesmo de como funciona o programa, mas bem pouco mesmo pois essa não é a intenção da aula. Pois bem, vamos agora pegar os tiles que iremos usar. Apenas fazendo assim:

[hs width=320 height=240]http://i.cubeupload.com/1SGCs4.png[/hs]

Após abrir os tiles que deseja usar no mapa, devemos voltar pro mesmo, e criar uma nova camada. Pra fazer isso, basta clicar em Segundo botão do mouse - e Nova Camada, que deve ser transparente.

Continuando. Pra facilitar mais ainda nosso trabalho, vá em Imagem lá em cima, junto da régua das laterais. Clicando lá, vá em Configurar Grade e então escolha 32x32. Dai então, vá em Visualizar e escolha Exibir Grade. Ficando assim:

[hs width=320 height=240]http://i.cubeupload.com/UGtwck.png[/hs][/box2]

[box2 class=titlebg title=Etapa #4]Agora vamos pegar os tiles que estão abertos no editor. Pra facilitar, faça o mesmo processo de abrir a grade. Pois com ela facilita o recorte dos tiles, devido ao RPG Maker ter este formato de tiles.
Sendo assim, vamos começar a por os detalhes. No meu caso eu vou primeiro pensar onde devo começar. Irei pelo mais fácil e divertido. As mesas. Vamos decora-las, colocando alguns objetos que estariam ali.

Ah claro, abaixo vocês podem pegar os tiles que usei. Assim podem fazer igualzinho a aula. Sim, são do RTP. Mas do RTP do Vx ( mesma coisa ).

Tiles usados na aula - RTP Vx

Pra começar a decoração, vamos colocar algumas garrafas na mesa. Eu comecei selecionando a garrafa vermelha de vinho. Depois eu apenas peguei os copos que estão perto do prato com um peixe. Ficando assim.

[hs width=320 height=240]http://i.cubeupload.com/fpA8lH.png[/hs]

Pra ficar bacana, basta você colocar o mais natural possível. Evitando sempre colocar os objetos muito nas bordas, parecendo que estão caindo. Sabendo disso enfeite as outras mesas. No final ficou assim:

[hs width=320 height=240]http://i.cubeupload.com/b85IWp.png[/hs]

Desse mesma maneira nós podemos pegar e colocar algumas garrafas e copos em cima da estante. Apenas não exagere ou coloque de forma que elas estejam caindo.[/box2]

[box2 class=titlebg title=#Etapa 5]Agora, depois de colocar uns objetos e tiles vamos brincar com iluminação. Não irei me aprofundar muito pra não deixar a aula extensa e cansativa. Vamos aprender a fazer uma iluminação básica.

Primeiro criei uma nova camada transparente. Nela, você deve usar o Pincel com o tamanho máximo ( ou um que de pra passar no mapa todo sem ter que passar várias vezes ), e com sua opacidade em 40%. Ah, o ícone do gráfico do pincel deve ser um com as bordas em borradas, assim como abaixo:



Depois de passar o pincel, mude a opacidade da camada que criamos para 90% assim não fica tão escuro. Seu mapa deve ficar mais o menos assim:

[hs width=320 height=240]http://i.cubeupload.com/Mgn2fm.png[/hs][/box2]

[box2 class=titlebg title=Etapa #6]Agora vamos colocar os pontos de luz. Como irei fazer de um método bem simples, ele não irá seguir muitas regras avançadas de iluminação, até por que eu mesmo não conheço todas.

Pois bem. Pegue a Borracha, estando com a opacidade em 70% e com o gráfico igual o do pincel. Escolha um tamanho menor, que de pra ficar pelo menos do tamanho da janela. No meu caso, eu coloquei um tamanho de 5,83.

Passe a borracha da janela pra baixo, e criei um efeito de cone. Ficando assim:

[hs width=320 height=240]http://i.cubeupload.com/SpqkHd.png[/hs]

Repita esse progresso na outra janela. E faça o mesmo, na parede da direita, dando a impressão que tem uma janela ali com um feixe de luz entrando. No final acabamos que temos o mapa assim:

[hs width=320 height=240]http://i.cubeupload.com/Bl7x2K.png[/hs]

Importante:Você agora deve apagar a camada que possuí o mapa, que é a primeira que colamos, e deixar apenas a camada da iluminação e a dos objetos. Ficando assim:

[hs width=320 height=240]http://i.cubeupload.com/8OCVQT.png[/hs]

Combine as camadas, clicando em Segundo botão do mouse e clica em Combinar Abaixo. Assim suas camadas irão se tornar uma só. Estando a de iluminação primeiro, e a dos objetos por último ( por baixo ).[/box2]

[box2 class=titlebg title=Etapa Final]Agora nós estamos no final. A última coisa a se fazer. Onde nós teremos que usar de um script. Mas é apenas um pequeno script que faz com que as imagens fiquem fixas no mapa, e não andem com você.

Script by Seer UK & OriginalWij

Spoiler
#==============================================================================
# Fixed Pictures
#==============================================================================
# Author : Seer UK & OriginalWij
# Version : 1.2
#
# Credit: Seer UK
#		 OriginalWij (Original RGSS2 Script)
#==============================================================================

#==============================================================================
# To use:
#   put the tag [FIXED] in the affected picture's filename
#==============================================================================

#==============================================================================
# What this does:
#   fixes tagged pictures to the map (scrolls with the map)
#==============================================================================

#==============================================================================
# Sprite_Picture
#==============================================================================

class Sprite_Picture < Sprite
  #----------------------------------------------------------------------------
  # Update															  [ MOD ]
  #----------------------------------------------------------------------------
  def update
	update_bitmap
	update_origin
	if @picture.name.include?("[FIXED]")
	  self.x = 0 - $game_map.display_x * 32
	  self.y = 0 - $game_map.display_y * 32
	else
	  update_position
	end
	update_zoom
	update_other
  end
end
[close]

Após a introdução do script no seu jogo. Nós vamos até o Gimp e salvamos a imagem em formato PNG pra poder ser lido no RM.

Pra salvar, basta clicar em Arquivo - Salvar como - depois disso vai abrir uma janelinha onde tem a opção Tipo de Arquivo, dai basta escolher o Imagem PNG.

Pronto, salve a imagem com o a tag antes do nome
[FIXED]
onde o script irá reconhecer e fixar sua imagem. Dai, basta criar um evento no mapa que fizemos no editor, em processo paralelo mostrando a imagem. Ah, e claro, coloque um evento pra apagar a imagem quando mudar de mapa, pra ela não aparecer nos outros mapas.

Pronto é isso :blink:[/box2]

[box2 class=titlebg title=Créditos]Makers, pela aula. Enterbrain pelo RM e o RTP. E o Gimp, pelo seu editor de imagens.[/box2]
Prazer, Terror dos Modinha

Boa aula Makers, uma explicação muito boa também, vai ajudar bastante gente que ainda tem dúvidas com essa técnica.

A parte da iluminação também ficou legal, só acho que você poderia acrescentar alguns efeitos de luz com o pincel por exemplo, após escurecer o mapa e apagar com a borracha, colocar os efeitos de luz também, creio que isso também seria parte de um nível intermediário e daria um efeito mais agradável no mapa.

Mas no geral ficou muito boa a aula cara, espero que tire as dúvidas do pessoal.  :ok:

Abraços

Fazer mapas é uma arte, faça como se fosse o seu último.




Citação de: Lycanimus online 04/03/2015 às 19:21
Boa aula Makers, uma explicação muito boa também, vai ajudar bastante gente que ainda tem dúvidas com essa técnica.

A parte da iluminação também ficou legal, só acho que você poderia acrescentar alguns efeitos de luz com o pincel por exemplo, após escurecer o mapa e apagar com a borracha, colocar os efeitos de luz também, creio que isso também seria parte de um nível intermediário e daria um efeito mais agradável no mapa.

Mas no geral ficou muito boa a aula cara, espero que tire as dúvidas do pessoal.  :ok:

Abraços



Poxa, valeu ae grande Lyca :ok:

Eu pensei em dar uma melhorada, mas posso confessar uma coisa. Eu mesmo ainda tenho muito a aprender com iluminação. E pra não ficar feio, eu ensinei uma iluminação que não é amadora, mas também não é profissional.

Valeu cara, muito obrigado!
Prazer, Terror dos Modinha

Aula boa,  simples objetiva e rápida.

Eu gostei da iluminação, apesar de ser um método pouco usado é bom ver novas maneiras de utilização da luz.
muitas pessoas insistem em ir a técnica mais avançada, mas para alguns (os novatos principalmente) é necessário um passo de cada vez.

:.x.: Saudações Azulinas.

Citação de: SimonMuran online 04/03/2015 às 19:43
Aula boa,  simples objetiva e rápida.

Eu gostei da iluminação, apesar de ser um método pouco usado é bom ver novas maneiras de utilização da luz.
muitas pessoas insistem em ir a técnica mais avançada, mas para alguns (os novatos principalmente) é necessário um passo de cada vez.

:.x.: Saudações Azulinas.


Valeu tio. Eu tentei se bem objetivo mesmo. :ok:
Prazer, Terror dos Modinha


Muito obrigado hsznet! Espero ter ajudado algo  :ok:
Prazer, Terror dos Modinha

Olha só! Que aula boa cara, como já disseram ali, simples e objetiva. Muito legal, parabéns, vai ajudar muita gente que ta começando a praticar a iluminação.


Citação de: Skyloftian online 05/03/2015 às 23:34
Olha só! Que aula boa cara, como já disseram ali, simples e objetiva. Muito legal, parabéns, vai ajudar muita gente que ta começando a praticar a iluminação.


Muito obrigado tio Sky! Eu fico feliz que tenha gostado. Me sinto que fiz o meu objetivo na aula :XD:
Prazer, Terror dos Modinha

I blame my internet por não ter carregado esse tópico.
Sério, isso vai ajudar pra caramba os negos que não fazem a mínima ideia de como adicionar detalhes nos mapas.
Tem gente que também tem dificuldades em criar efeitos de iluminação, e na verdade esse efeito de iluminação é intermediário mesmo xD Parabéns, está tudo muito bem explicado e claro para todos.
só falta eu desempacar minha aula de panomapeamento que ainda tá na metade D:

Ótima aula [user]Makers[/user]!
Obrigado por compartilhar conosco man!
Até!

Citação de: Alisson online 06/03/2015 às 19:52
I blame my internet por não ter carregado esse tópico.
Sério, isso vai ajudar pra caramba os negos que não fazem a mínima ideia de como adicionar detalhes nos mapas.
Tem gente que também tem dificuldades em criar efeitos de iluminação, e na verdade esse efeito de iluminação é intermediário mesmo xD Parabéns, está tudo muito bem explicado e claro para todos.
só falta eu desempacar minha aula de panomapeamento que ainda tá na metade D:

Sei que suas aulas irão sair, e vão ser bem fodas.  :XD:

Muito obrigado tio. Eu realmente espero que essa aula ajude o pessoal mais intermediário que está tentando se aperfeiçoar na arte do mapeamento.

Em breve irei trazer a Aula Mapeamento #2 Intermediário / Exterior. Valeu denovo!

Citação de: Arck! online 06/03/2015 às 19:56
Ótima aula [user]Makers[/user]!
Obrigado por compartilhar conosco man!
Até!

Haha, muito obrigado cara. Seu comentário me motiva mais :ok:
Prazer, Terror dos Modinha