[TUTORIAL] Avançado, Tiles que não funcionam

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Gostou do Tutorial?

33% 33% 
[ 1 ]
33% 33% 
[ 1 ]
33% 33% 
[ 1 ]
 
Total dos votos : 3

Idéia [TUTORIAL] Avançado, Tiles que não funcionam

Mensagem por AlexBosquin em Ter 10 Dez 2013, 16:53

Tiles que não funcionam


Versão do GM: Game Maker Studio ou Game Maker 8
Dificuldade: Intermediário ou Avançado
Link para download da Engine: Does Not Exist
Requer extensões: Não
Requer DLLs: Não
Tags: GMS GM8 tile tileset
Precisa de Photoshop CS5 ou Superior (Devido elas trabalharem melhor com transformação de pixels)

Sabe aquele momento que você esta fazendo seu jogo e chega o momento em que vai fazer os cenários e vai no nosso querido google e procura imagens de tiles mas dai para sua infelicidade quando acha um que gostou ele está desta forma:


Daí você vai importar para o game maker e tenta fuçar nas configurações do tile e nada feito sai aquela doideira

RUIM


Então esse tutorial está aqui para poder te ensinar como transformar qualquer tipo de tile pronto pra ser usado no game maker sem nem mesmo precisar mexer nas configurações de tile. Vou usar a versão CS6 do photoshop , quem não tiver é só procurar a versão portable por ai que acha xD, vou logo dizendo que a maior parte do tutorial é no photoshop então se preparem pois requer paciência e isso nem todos tem, mas o resultado final vale a pena!

1 - Começando abra o photoshop com sua imagem:

Imagem:

2 - Vamos segurar com o ponteiro do mouse na ferramenta crop(Vermelho) e selecionar a Slice (Amarelo)

Imagem:

3 - Vamos dar um Zoom na imagem no local que vamos começar (Zoom - segure Z)

Imagem:

4 - Na barra de cima onde está style vai estar Normal (Laranja) Selecione Fixed Size (Vermelho)

Imagem:

5 - Bom aqui é uma parte importante e dependendo do numero que você colocar aqui você vai precisar decorar para usa-lo futuramente, como todos sabem os tiles funcionam da mesma forma que textura em questão de tamanho -> 4x4,8x8,16x16,32x32,64x64,128x128...
sempre vai depender do tamanho da imagem, por exemplo no meu vou usar 32x32 então colocarei esse valor:

Imagem:

Lembre-se de decorá-lo xD

6 - Feito isso, vamos clicar em um local da tela para aparecer esse quadrado:

Imagem:

7 - você vai adicioná-los e vai arrastando eles até que se encaixem com a imagem mas não redimensionem o quadrado só encaixem junto coma imagem caso o box que você estiver arrastando estiver selecionado pode-se usar as setas do teclado pra move-lo, faça até que fique dessa forma:

Imagem:

8 - Como você pode ver logo abaixo (Vermelho) ficou uma vala satânica ali então temos que corrigir este problema sem danificar nossa imagem:

Imagem:

9 - Para isto selecione a ferramenta selection (vermelho) e selecione a imagem toda só o sprite não todo o box desse jeito:

Imagem:

10 - depois de ter selecionado, aperte CTRL+T, mas ainda não redimensione, para poder não danificar a imagem quando apertar este atalho la no canto superior direito tem essa opção interpolation (vermelho), vai estar Bicubic deixe Nearest (amarelo):

Imagem:

11 - Agora é só redimensionar até ficar do mesmo tamanho dos boxes xD:

Imagem:

12 - Agora só vou repetir o mesmo processo com outra imagem:

Imagem:

14 - a mesma coisa de antes:

Imagem:

15 - Feito isso como todas as imagens vamos partir para a próxima fase que é criar a tileset funcional para o game maker:

Imagem:

16 - Lembra que eu disse que tinha que decorar aqueles numeros? então agora é a hora de usá-los no meu caso 32x32 o nosso novo documento deve ter dimensões múltiplas de 32 cada 32 pixels um quadrado no caso vou usar 20 quadrados para a horizontal e para a vertical ou seja vou multiplicar 32*20 = 640

Imagem:

Imagem:

17 - esse é o nosso novo documento em branco: (Lembrando que é pra manter o outro aberto  bounce )

Imagem:

18 - No canto inferior direito clique para criar uma nova camada transparente:

Imagem:

19 - Com a transparente criada, selecione a branca e depois clique em delete como na imagem:

Imagem:

20 - Esse é o resultado semi-final xD

Imagem:

21 - vamos configurar a grid de nosso documento (Lembrando que tem que marcar a caixa EXTRAS logo acima de Show)

Imagem:

22 - Ele vai te mostrar um Grid, mas agente tem que configurar ele de acordo com o nosso tile:

Imagem:

23 - Deixe as configurações como as da imagem, de novo lembre-se dos números que usamos no meu caso 32x32. Se fosse 64x64 você poria esses números:

Imagem:

24 - Esse é o resultado pronto pra ser usado:

Imagem:

25 - você vai voltar no documento anterior (Vermelho) e selecionar os boxes inteiros o PS te ajuda com uma especie de cola xD só pegar a ferramenta selection e selecionar as que você já preparou:

Imagem:

26 - Voltamos para o documento atual:

Imagem:

27 - e nele colamos o que copiamos:

Imagem:

28 - e depois com a ferramente move (vermelho) você arrasta pra onde você quiser alinhando com a grid 32x32:

Imagem:

29 - repetindo o processo com a pedra:

Imagem:





30 - Lindo que ficou não? Agora vamos salvar:

Imagen:

31 - Salve onde quiser no formato png (ele mantém transparência):

Imagen:

32 - Lá no game maker cria o background:
Imagen:


33 - Carrega a imagem que criamos:

Imagen:

34 - agora marca a caixa tileset e depois em width e height o número que usamos neste caso 32x32:

Imagen:

35 - e como eu disse ele nem precisa ser configurado já sai pronto do forno, olha ai a nossa obra de arte:


Como eu disse muito trabalhoso, mas o resultado final...

É LINDO...


Bom , deu muito trabalho e espero que vocês gostem pq deu muito trabalho mesmo xD
não esqueçam de votar, e comentar pf

comenta ;-;
comenta ;-;
comenta ;-;
comenta ;-;
comenta ;-;

vei serim deu trabalho ;-;

 Rolling Eyes 

deu mermo! uai sô...

amo vucês


Última edição por AlexBosquin em Ter 10 Dez 2013, 20:48, editado 1 vez(es)

AlexBosquin

Ranking : Nota C
Número de Mensagens : 621
Idade : 20
Data de inscrição : 10/07/2012
Notas recebidas : C
Reputação : 35
Insignia 1 x 0 Insignia 2 x 0 Insignia 3 x 0
Prêmios
   : 1
   : 0
   : 0

http://www.craftstudios.com.br

Voltar ao Topo Ir em baixo

Idéia Re: [TUTORIAL] Avançado, Tiles que não funcionam

Mensagem por luizbills em Ter 10 Dez 2013, 17:45

Não gostei muito do seu tutorial pois você pediu para usar photoshop, um software pago. Por que não usar uma ferramenta gratuita como o Gimp? Para tutoriais isso ajuda muito.

luizbills

Número de Mensagens : 29
Data de inscrição : 14/09/2013
Reputação : 1
Insignia 1 x 0 Insignia 2 x 0 Insignia 3 x 0

Voltar ao Topo Ir em baixo

Idéia Re: [TUTORIAL] Avançado, Tiles que não funcionam

Mensagem por AlexBosquin em Ter 10 Dez 2013, 18:52

como assim não gostou pq usa o photoshop, isso não justifica o fato de o tutorial estar bom ou não, alem do mais você pode ir no site da adobe e baixar a versão trial, e ainda mais que da pra baixar full na internet, e sem essa desculpa de pirataria  Cool 

dedicar todo esse tempo e ler um comentário desse, vou chorar...

AlexBosquin

Ranking : Nota C
Número de Mensagens : 621
Idade : 20
Data de inscrição : 10/07/2012
Notas recebidas : C
Reputação : 35
Insignia 1 x 0 Insignia 2 x 0 Insignia 3 x 0
Prêmios
   : 1
   : 0
   : 0

http://www.craftstudios.com.br

Voltar ao Topo Ir em baixo

Idéia Re: [TUTORIAL] Avançado, Tiles que não funcionam

Mensagem por Willy em Ter 10 Dez 2013, 20:35

luizbills escreveu:Não gostei muito do seu tutorial pois você pediu para usar photoshop, um software pago. Por que não usar uma ferramenta gratuita como o Gimp? Para tutoriais isso ajuda muito.
Game Maker também é pago e nem por isso deixamos de postar tutoriais. Sei que não teve a intenção, mas seu comentário provavelmente desestimulou o Alex.

AlexBosquin, gostaria de parabenizar o excelente trabalho que você fez. Seu tutorial ficou com uma riqueza de imagens e detalhes, o que ajuda muitos a compreender com mais facilidade. Entretanto, conforme eu disse na sua enquete, quando se mexe muito em um programa, uma videoaula é mais viável. Se tivesse especificado que o assunto era arte gráfica, creio que muitos concordariam comigo.
Recomendo apenas que coloque as imagens em spoilers.

No mais, parabéns pelo trabalho! Sucesso! blz

___________


Engines, tutoriais e projetos? Clique no banner!



Atenção:
Comporte-se, senão você vai levar a cintada do Willy no meio da bunda! bravo


Willy

Ranking : Nota A
Número de Mensagens : 1812
Idade : 23
Data de inscrição : 08/06/2009
Notas recebidas : C + B + A + A
Reputação : 245
Insignia 1 x 0 Insignia 2 x 0 Insignia 3 x 0
Prêmios
   : 2
   : 1
   : 1

http://willy-gmbr.blogspot.com/

Voltar ao Topo Ir em baixo

Idéia Re: [TUTORIAL] Avançado, Tiles que não funcionam

Mensagem por AlexBosquin em Ter 10 Dez 2013, 20:44

Muito obrigado willy, vou corrigir isso sim, xD vlw mesmo por comentar fiquei bem animado  Happy 

AlexBosquin

Ranking : Nota C
Número de Mensagens : 621
Idade : 20
Data de inscrição : 10/07/2012
Notas recebidas : C
Reputação : 35
Insignia 1 x 0 Insignia 2 x 0 Insignia 3 x 0
Prêmios
   : 1
   : 0
   : 0

http://www.craftstudios.com.br

Voltar ao Topo Ir em baixo

Idéia Re: [TUTORIAL] Avançado, Tiles que não funcionam

Mensagem por luizbills em Ter 10 Dez 2013, 21:32

@AlexBosquin
Me desculpe então, AlexBosquin. Nunca tive a intenção de falar mal do seu tutorial. É que não sou fã de softwares pagos e muito menos da pirataria.

luizbills

Número de Mensagens : 29
Data de inscrição : 14/09/2013
Reputação : 1
Insignia 1 x 0 Insignia 2 x 0 Insignia 3 x 0

Voltar ao Topo Ir em baixo

Idéia Re: [TUTORIAL] Avançado, Tiles que não funcionam

Mensagem por AlexBosquin em Ter 10 Dez 2013, 21:36

hehehe, sinto muito cara, mas fazer oq eu tenho uma teoria que se eu não posso comprar eu consigo o pirata pra mim, mas quando aparece o dinheiro eu compro o original, eu acho mais justo heeheh!

AlexBosquin

Ranking : Nota C
Número de Mensagens : 621
Idade : 20
Data de inscrição : 10/07/2012
Notas recebidas : C
Reputação : 35
Insignia 1 x 0 Insignia 2 x 0 Insignia 3 x 0
Prêmios
   : 1
   : 0
   : 0

http://www.craftstudios.com.br

Voltar ao Topo Ir em baixo

Idéia Re: [TUTORIAL] Avançado, Tiles que não funcionam

Mensagem por fredcobain em Ter 10 Dez 2013, 22:18

Excelente tutorial.
Aprovado com louvor.

Obrigado pela dedicação.

fredcobain

Ranking : Sem avaliações
Número de Mensagens : 691
Idade : 35
Data de inscrição : 14/04/2011
Reputação : 162
Insignia 1 x 0 Insignia 2 x 0 Insignia 3 x 0
Prêmios
   : 0
   : 0
   : 0

Voltar ao Topo Ir em baixo

Idéia Re: [TUTORIAL] Avançado, Tiles que não funcionam

Mensagem por AlexBosquin em Qua 11 Dez 2013, 07:46

eu quem agradeço, e fico muito feliz pela aprovação xDDDDD

AlexBosquin

Ranking : Nota C
Número de Mensagens : 621
Idade : 20
Data de inscrição : 10/07/2012
Notas recebidas : C
Reputação : 35
Insignia 1 x 0 Insignia 2 x 0 Insignia 3 x 0
Prêmios
   : 1
   : 0
   : 0

http://www.craftstudios.com.br

Voltar ao Topo Ir em baixo

Idéia Re: [TUTORIAL] Avançado, Tiles que não funcionam

Mensagem por DonutScore em Qui 19 Dez 2013, 23:33

Ótimo tutorial. Não importa qual software usar, o tutorial serve para a maioria dos programas de designer. É só saber onde fica as ferramentas em cada software. Faço meus trabalhos no Microsoft Expression Design 4. Muito bom também.

DonutScore

Número de Mensagens : 176
Idade : 23
Data de inscrição : 18/12/2013
Reputação : 6
Insignia 1 x 0 Insignia 2 x 0 Insignia 3 x 0
Prêmios
   : 0
   : 0
   : 0

http://donutscore.com

Voltar ao Topo Ir em baixo

Idéia Re: [TUTORIAL] Avançado, Tiles que não funcionam

Mensagem por AlexBosquin em Sex 20 Dez 2013, 11:18

poise xD

AlexBosquin

Ranking : Nota C
Número de Mensagens : 621
Idade : 20
Data de inscrição : 10/07/2012
Notas recebidas : C
Reputação : 35
Insignia 1 x 0 Insignia 2 x 0 Insignia 3 x 0
Prêmios
   : 1
   : 0
   : 0

http://www.craftstudios.com.br

Voltar ao Topo Ir em baixo

Idéia Re: [TUTORIAL] Avançado, Tiles que não funcionam

Mensagem por Iverson em Qui 26 Dez 2013, 16:30

Obrigado cara!
Muito bom o seu tutorial,deu certinho aqui!
 Happy

Iverson

Número de Mensagens : 1
Data de inscrição : 12/08/2013
Reputação : 0
Insignia 1 x 0 Insignia 2 x 0 Insignia 3 x 0

Voltar ao Topo Ir em baixo

Idéia Re: [TUTORIAL] Avançado, Tiles que não funcionam

Mensagem por AlexBosquin em Qui 26 Dez 2013, 17:53

@Iverson Fico muito feliz em poder te ajudar, HAHAHA xD

AlexBosquin

Ranking : Nota C
Número de Mensagens : 621
Idade : 20
Data de inscrição : 10/07/2012
Notas recebidas : C
Reputação : 35
Insignia 1 x 0 Insignia 2 x 0 Insignia 3 x 0
Prêmios
   : 1
   : 0
   : 0

http://www.craftstudios.com.br

Voltar ao Topo Ir em baixo

Idéia Re: [TUTORIAL] Avançado, Tiles que não funcionam

Mensagem por DonutScore em Sex 27 Dez 2013, 11:44

No GameMaker tem como colocar algum filtro de redimensionamento?

Utilizo o emulado do Snes e com vários filtros um melhor que o outro, a imagem fica muito boa.

DonutScore

Número de Mensagens : 176
Idade : 23
Data de inscrição : 18/12/2013
Reputação : 6
Insignia 1 x 0 Insignia 2 x 0 Insignia 3 x 0
Prêmios
   : 0
   : 0
   : 0

http://donutscore.com

Voltar ao Topo Ir em baixo

Idéia Re: [TUTORIAL] Avançado, Tiles que não funcionam

Mensagem por AlexBosquin em Sex 27 Dez 2013, 14:42

eu to ligado o zsnes tem uns filtros bem legais, mas o único filtro do game maker é aquele interpolate colors between pixels que deixa eles uma pouco borrados (blur)

AlexBosquin

Ranking : Nota C
Número de Mensagens : 621
Idade : 20
Data de inscrição : 10/07/2012
Notas recebidas : C
Reputação : 35
Insignia 1 x 0 Insignia 2 x 0 Insignia 3 x 0
Prêmios
   : 1
   : 0
   : 0

http://www.craftstudios.com.br

Voltar ao Topo Ir em baixo

Idéia Re: [TUTORIAL] Avançado, Tiles que não funcionam

Mensagem por Conteúdo patrocinado Hoje à(s) 12:30


Conteúdo patrocinado


Voltar ao Topo Ir em baixo

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

 
Permissão deste fórum:
Você não pode responder aos tópicos neste fórum