Tutorial Parallax Map - RM 2k3

[Kwerten]

Venho hoje aqui disponibilizar um tutorial sobre Parallax Map, esse tutorial foi feito com base no RPG Maker 2003, mas o princípio básico é o mesmo para as outras engines. Gostaria de ressaltar que o tutorial não foi feito por mim, eu apenas traduzi e trouxe para cá. Para os curiosos, sim, eu pedi a permissão ao autor do tutorial e ela me foi concedida (senão eu não iria postar né..)
Peço que me perdoem pelos erros de concordância no texto, meu inglês é bem básico e algumas vezes recorri ao google tradutor. Caso vejam algum erro, podem me relatar que logo irei consertar. Espero que esse tutorial desperte a curiosidade e a vontade de utilizar o RM 2k3, vejam que mesmo sendo antiga e ultrapassada essa engine pode ser muito útil e produzir bons trabalhos tanto quanto as novas engines.

Meiscool's Guide To Parallax Mapping
Primeiro: O que é Parallax Map? Basicamente, é usar um background como o mapa, substituindo pelo chipset comum. A parte de movimentação e eventos pode ainda ser mapeada com o chipset dependendo da versão do RPG Maker usada, mas seus gráficos não.

Parallax Map é usado especialmente para deixar de lado as limitações do chipset. Um exemplo onde o Parallax Map poderia ser aplicado seria uma loja. Desse modo permitiria a adição de mais itens,objetos,armaduras,espadas, etc para serem colocados em cima de cadeiras, estantes, etc. Teríamos então mais possibilidade de customização do que se mapeado do método comum. Fornece também um ótimo modo de iluminar, sombrear e dar outros efeitos que não poderiam ser feitos normalmente.

Nesse tutorial eu vou criar um Parallax Map para o meu próprio jogo. Como exemplo aqui irei usar o RPG Maker 2003. Devo esclarecer as coisas, por favor, não utilize nenhum dos gráficos que eu postar aqui como exemplo para por nos seus jogos, eles foram editados originalmente para o MEU projeto. Se você quiser saber
de onde eles foram ripados eu irei dizer, então você poderá ter os seus próprios gráficos originais.

1) Comece fazendo um mapa com o chipset normal. Você não precisa detalhar esse mapa, use somente os chipsets comuns para criar um esboço do mapa que você irá trabalhar. Quando terminar de fazer o mapa, tire um print dele. Tenha certeza que o print tirado tenha as mesmas dimensões da tela do jogo. As dimensões do
RPG Maker 2003 são 320x240 pixels. O meu mapa ficou desse jeito:

Nesse ponto, não importa muito quão bom o mapa está, porque você poderá consertar tudo depois! Salve sua imagem e vamos para o próximo passo.

2) Abra seu mapa em um programa de edição de imagem. Eu usei o Photoshop pois o recurso das Layers são muito úteis para isso, mas muitos outros programas são aceitáveis (inclusive o Paint).

3) Junte alguns dos gráficos que você quer usar no seu mapa. Você já deve tê-los disponíveis no próprio chipset ou em qualquer outro lugar. Continuando, alguns dos gráficos que eu usarei para esse mapa:



4) Use os gráficos que você tem e as ferramentas no programa de edição para finalizar o mapa. Eu fiz isso em múltiplos estágios, e irei mostrá-los à vocês para que possam ter uma melhor ideia de como se faz.
      4.1) Primeiro, eu queria estabelecer a linha das árvores, colocando-as pelo lado de fora do mapa e cobrindo as partes de marrom da melhor forma possível, dessa forma eu pude deixá-las similar a uma floresta.



Pessoalmente eu não estou totalmente satisfeito com o resultado. Não dá o sentimento de uma floresta densa e o marrom não está totalmente coberto. Usando as ferramentas do meu programa, eu mudei a parte marrom que sobrou para um verde escuro. Depois disso, eu sombreei as árvores de baixo com o mesmo verde escuro para dar um toque mais desvanecido (dissipado, desfeito, apagado, desbotado).



      4.2) Em seguida eu quis adicionar algumas sombras no chão. Não vou dizer que sou bom em fazer sombras, mas com o Parallax Map é tão fácil sombrear que difícil seria esquecer de fazer isso. Pegue a ferramenta e escureça as áreas que você queira impor o sombreamento.



Nesse mapa eu fiz sombras em todas as saídas, pode ser difícil de reparar, mas será fácil de ver quando você adicionar mais coisas ao mapa.
      4.3) Todo o restante é simples, mas é provavelmente a parte que leva mais tempo. Adicionar objetos ao mapa. Já que estamos falando de Parallax Map, você pode colocar o que você quiser, onde você quiser, simplesmente copie um gráfico que esteja usando para o seu jogo e tire a cor de fundo. Faça isso o quanto precisar até você ter tudo que quiser na imagem. Eu gosto de preencher todo o espaço que sei que meu personagem não poderá andar, também tento não usar o mesmo gráfico mais que duas vezes em um mapa. Quando é necessário fazer isso eu espelho o gráfico para parecer diferente (esperto o muleque hein kkkk)
Veja como ficou com todos os objetos adicionados à imagem:



5) Agora sim temos nosso background feito. Contudo, algumas coisas não devem ser parte do background, eles precisam aparecer ACIMA do seu personagem. Sim, isso também pode ser feito (creio que é uma dúvida de muitos, eu pelo menos estava pensando nisso desde o começo). Se você estiver usando algum tipo de programa com layers (camadas), simplesmente tire uma dessas layers que deveria aparecer abaixo do seu personagem. É possível que você precise de alguns pequenos ajustes em algumas das layers para ter certeza que se enquadre direito, mas isso varia de mapa para mapa, por isso não posso demonstrar. Aqui está a imagem da minha layer superior:



No RPG Maker 2003, você pode colocar essa imagem como Picture, assim terá ela por cima do mapa. Se as dimensões do mapa forem 320x240 e o arquivo de Picture for do mesmo tamanho e largura basta por a Picture em 160x 120y e pronto, ela estará centralizada. Se sua imagem ou mapa for maior, basta trocar os respectivos valores.

6) O próximo passo é criar o mapa in-game. Mesmo sendo um Parallax Map, você ainda precisa determinar onde andar, o que pode ser sobreposto e tal. Isso pode ser feito de várias formas, mas a maneira mais fácil é através dos chipsets do RM 2003, é isso que irei mostrar.



Isso que aparece no mapa é um chip em branco. Para mapas por Parallax você vai querer seu chip branco se possível. Isso é porque você ainda pode determinar valores de terreno e passar/não passar para os chips do chipset em branco, enquanto ainda é permitido mostrar o background completamente. Todas as caixinhas em preto são eventos que cada mapa meu tem. Os circulados em vermelho são eventos variáveis com base no mapa em que você está, depois irei explicá-los melhor. (parece bem confuso, mas garanto que vai entender quando terminar de ler tudo)

O que eu faço aqui é pegar um chipset ''suporte'', eu tenho que saber que existe um chip em branco em algum lugar. Eu ponho todo o mapa com esse chip em branco. A partir daí eu uso outros chips desse chipset para preencher os lugares que eu não quero que o meu personagem ande. No meu jogo, eu também tenho chips em que inimigos voadores não podem passar e que minhas adagas não possam atravessar (ele está falando do jogo dele, lembre). Eu também tenho chips para fazer certas coisas visuais, então eu determino cada um desses chips com um valor de terreno e passagem diferente, quando necessário. (Realmente é confuso, tem que pegar o jeito da coisa até se acostumar).
Depois de preencher o mapa com os chips apropriados ficou assim:



A área preta/azul é onde pode andar. A área marrom é onde o personagem (herói) não pode andar. Os ''matinhos'' verdes contornando a parte marrom é onde as adagas e os inimigos voadores não podem se mover, e os matos amarelos são para objetivos visuais (lembre, isso é do jogo DELE) e também não se pode andar. Agora eu tenho o mapa todo mapeado pelos chips, e agora também eu posso mudar para o chipset em branco. Tenha certeza que o chipset em branco tenha os mesmos valores que o chipset ''suporte'' usado para passagem e terreno.

7) Depois de fazer os eventos necessários para mostrar a imagem sobreposta e outros enfeites eu acabei o mapa in-game:



''Os circulados em vermelho são eventos variáveis com base no mapa em que você está, depois irei explicá-los melhor.''

Pois bem, lembra dessa passagem? Vou explicar. Esses eventos circulados são efeitos visuais para o meu mapa, e eles realmente aparecem. Apesar de não ter muito haver com Parallax Map eles ainda são uma parte de mapeamento, então vou deixar para explicá-los mais detalhadamente em outro post (VOU PROCURAR ESSE POST PARA POSTAR AQUI NA CRM). Para os que ficaram curiosos, aqui está um vídeo rápido e simples que mostra o que os quatro eventos do canto fazem, e também como o mapa ficou in-game.

O vídeo demonstra os eventos, colisão de chips, e o propósito de criar múltiplos chips que não podem ser sobrepostos pelo personagem (herói) mas que podem ser sobrepostos por outras coisas. Se você não viu, os 4 eventos do canto eram folhas caindo. Tente assistir novamente se não percebeu da primeira vez ;).

Esse é o fim do tutorial, se você tiver alguma pergunta, então pergunte. Estou disposto a ajudar quando necessário. (FAÇO DAS PALAVRAS DELE, AS MINHAS)

Créditos devem ser dados ao Meiscool por ter feito o tutorial. Eu Kwerten apenas traduzi.

Link para o tópico original: http://www.charas-project.net/forum/index.php?topic=28837.0

[bziperan]

Olha que interessante, RM2K, apesar de usar os atuais curto bastante essa engine, muito bom o tuto, vou até favoritar, pois tenho planos para o RM2K, obrigado pelo ótimo material!

[Avenger_B7]

Eita! Quem diria... Primeiro, diziam que o rm2k era limitado quanto à programação. Depois disseram que era limitado devido aos recursos gráficos. Falta mais oq?! hahahaha'

Obrigado por compartilhar, de verdade. Se um dia eu montar uma equipe o designer vai ter que ver este tópico, melhor favoritá-lo. kkk'

O cálculo das variáveis deve ser da posição do herói. Ele deve verificar as coordenadas para não deixar que o herói se mova além da conta.

Eu também não pude deixar de notar o ABS, esse cara é sinistro. A pirueta que a cocota dá ali é da hora. kkkk' Sem contar que eu acredito que ele tenha colocado uma movimentação por pixels. Não sei se vi demais, fazer oq.

Grato, + Ouro!

[SimonMuran]

Você me deu mais um ótimo motivo pra voltar pro rm2k3 sério! kkk comecei nele e só fui pro XP
pelas "limitações" que ele tinha, agora com isso ... *-* ótimo tuto ÓTIMO TRABALHO!

[Kwerten]

~bziperan: espero que faça bom uso, eu mesmo estou lendo todo dia e tentando por em prática, boa sorte com os planos.

~Avenger_B7: Pois é, cuspir no prato depois de comer é fácil, quero ver cuspir enquanto come kkkk. Man, esse cara Meiscool é tipo um mito lá na comunidade dele, to procurando o projeto dele pra testar, deve ser muito foda. vlw flw

~SimonMuran: fico feliz em ler isso, de verdade, na minha opinião o XP é a pior engine, sério mesmo, nunca me habituei naquilo, mas fazer o que né, vlw cara, espero que realmente considere em voltar a utilizar o 2k3, precisamos de mais pessoas nesse meio.

[mercia]

O resultado do mapa do tutorial é mesmo muito bonito, muito obrigada por traduzir esse tutorial e trazer para cá! Em breve tentarei fazer algo com ele.
Eu só tenho dificuldade em deixar uma picture estática no mapa em mapas maiores que o minimo. x_x