Entrar
Últimos assuntos
» Alguém aqui já ganha dinheiro com seus games?por theguitarmester Ter 30 Abr 2024, 11:43
» Colisões não funcionando
por theguitarmester Ter 30 Abr 2024, 10:16
» Como ajustar velocidade de cada frame da animação no game maker
por pequetux Sex 26 Abr 2024, 16:45
» Preciso de ajuda
por AftonDuGrau Dom 21 Abr 2024, 20:18
» Como faz o evento drawn GUI, não se repetir?
por aminaro Sex 19 Abr 2024, 20:30
» PROBLEMAS COM FÍSICAS DE ÁGUA
por aminaro Ter 16 Abr 2024, 10:07
» Retorno da GMBR!!!
por Ralphed Sex 12 Abr 2024, 22:45
» JOGADOR PARANDO NO AR QUANDO ATACA
por aminaro Qua 10 Abr 2024, 13:51
» Problemas com texto interativo
por Kaaru72 Dom 07 Abr 2024, 11:31
» Erro escondido e indecifrável
por dev_gabize.azv Qui 04 Abr 2024, 10:11
» Mudar cor de apenas uma palavra
por Ralphed Sáb 30 Mar 2024, 00:39
» Procuro Programador de game maker
por Wou Sex 15 Mar 2024, 10:27
» Mod APK
por gamerainha Qua 13 Mar 2024, 06:30
» Aceito pedidos de sprites (Com exemplos meus)
por Sevilha Qua 28 Fev 2024, 12:17
» Inventário simples
por Isquilo_Roedor Qui 22 Fev 2024, 15:18
» Problemas na programaçnao de inimigo [jogo DOOM LIKE]
por Black Mirror Dom 11 Fev 2024, 13:34
» ANDROID MULTI TOUCH
por DiegoBr Dom 04 Fev 2024, 12:13
» Servidor de Discord do fórum?
por Lighter Sáb 27 Jan 2024, 17:18
» Save e Load Json
por Klinton Rodrigues Qui 25 Jan 2024, 11:12
» Colisão com mais de um objeto
por aminaro Seg 22 Jan 2024, 15:02
» Oi sou novo aqui
por Thiago Silveira Alexandre Sáb 20 Jan 2024, 20:55
» Como acessar conteudo comprado no marketplace
por macmilam Sex 19 Jan 2024, 07:42
» Devlogs em vídeos do Block Room
por Joton Seg 15 Jan 2024, 16:56
» ACERVO GMBR MAGAZINE
por Joton Qui 11 Jan 2024, 19:21
» como aumentar o obj sem aumentar a colisão??
por GabrielXavier Qua 10 Jan 2024, 07:21
Crie jogos em HTML5 + javascript
+14
Super Games
luiz_eldorado
CRP-Max
ManiacoBranco
Denbs
JV Justino
Joton
Mr. Kaleb
psycon
primz
WillianAssis
Livsk
Tedi Ripper
PedroX
18 participantes
Página 1 de 3
Página 1 de 3 • 1, 2, 3
Crie jogos em HTML5 + javascript
Introdução
A criação de jogos de navegador é muito comum, mas nem tanto para os usuários do Game Maker. Agora que existe o Game Maker HTML5, isso pode mudar. Só que há um problema: nem todos podemos comprar a nova versão. Então, como fazer de forma gratuita, sem baixar nenhum programa? Você deve saber a resposta: Bloco de Notas.
Esse artigo vai mostrar como criar um jogo usando um software e duas linguagens, sendo uma não tão necessária no momento. Vamos precisar saber JavaScript.
Começando a fazer o primeiro jogo
Tudo o que precisaremos para iniciar é criar um arquivo de texto no bloco de notas. Vamos usar somente esse arquivo por enquanto.
Vamos começar. Primeiro, precisamos começar escrevendo:
O que isso faz? Diz que vamos começar a escrever em Javascript dentro da página html (você irá salvar como 'nome.html').
Depois, vamos adicionar nas linhas de baixo:
O que isso faz? Cria as variaveis. É o mesmo esquema do Game Maker.
Agora vamos checar se pressionamos as setas, temos que colocar o código delas (uma tabela será fornecida em breve).
Agora vamos dizer que se soltarmos a tecla, então as variaveis respectivas serão falsas:
Agora vamos desenhar o jogo, seria como criar a função Draw no game maker:
Context é um 'pacote' de funções que usamos no jogo. As funções de imagem são dele.
Também checamos se as variaveis eram veradeiras e movimentamos.
As três ultimas linhas: apaga tudo o que está desenhado, desenha o player, escreve nossa posição.
Vamos adicionar os códigos que avisam as funções de teclado quando houver alguma tecla pressionada ou solta:
A ultima linha faz a função drawgame se repetir a cada 30 milissecundos.
Estamos acabando com:
Canvas serve para criar a tela do jogo. É com ele que desenhamos tudo.
Código completo:
Ou então: http://freetexthost.com/wfrg02r4d1
Com isso, salve com extensão .html, clique no arquivo para abrir no navegador.
Mova-se com as teclas. Depois vamos fazer um jogo de plataforma.
Até mais!
Última edição por Pedro Henrique em Dom 16 Out 2011, 12:07, editado 5 vez(es)
Leia o Manual do Iniciante e a Lista de Tutoriais, para aprender bastante sobre o GM.
Recomendo o Manual completo das colisões, bem útil.
O exemplo Criar um chat (banir, kickar, etc) é interessante.
Para seu jogo ficar rápido e legal, aprenda a Aumentar o desempenho do seu jogo.
Aprenda a calcular a velocidade de suas animações
Entre para o Clube do Inglês:
Re: Crie jogos em HTML5 + javascript
cara, nao aparece um monte de codigos pra mim =/
tenta de outro jeito.
flw
tenta de outro jeito.
flw
Tedi Ripper- Games Ranking :
Data de inscrição : 21/11/2010
Reputação : 25
Número de Mensagens : 777
Prêmios :
x 0 x 0 x 0
x 0 x 0 x 0
x 0 x 0 x 0
Re: Crie jogos em HTML5 + javascript
Veja se está melhor agora.
Até mais!
Até mais!
Leia o Manual do Iniciante e a Lista de Tutoriais, para aprender bastante sobre o GM.
Recomendo o Manual completo das colisões, bem útil.
O exemplo Criar um chat (banir, kickar, etc) é interessante.
Para seu jogo ficar rápido e legal, aprenda a Aumentar o desempenho do seu jogo.
Aprenda a calcular a velocidade de suas animações
Entre para o Clube do Inglês:
Re: Crie jogos em HTML5 + javascript
vlw, agora, deu.
cara, ja ja vo testa o script, mas, da pra faze jogos java em bloco de notas o.o
vo estuda mais o javascript, vc conhece uns sites de aula bons?
---edit----
precisa de algum programa especifico pra abri?
eu abri com o IE e nao funfo =/
cara, ja ja vo testa o script, mas, da pra faze jogos java em bloco de notas o.o
vo estuda mais o javascript, vc conhece uns sites de aula bons?
---edit----
precisa de algum programa especifico pra abri?
eu abri com o IE e nao funfo =/
Tedi Ripper- Games Ranking :
Data de inscrição : 21/11/2010
Reputação : 25
Número de Mensagens : 777
Prêmios :
x 0 x 0 x 0
x 0 x 0 x 0
x 0 x 0 x 0
Re: Crie jogos em HTML5 + javascript
Viu pedro, não ta funfando.
Aparece:
//finaliza a escrita de javascript //fecha a tag //inicia o corpo //cria a tela do jogo na pagina
Como se fosse abrir um documento de texto.
Flws!
Aparece:
//finaliza a escrita de javascript //fecha a tag //inicia o corpo //cria a tela do jogo na pagina
Como se fosse abrir um documento de texto.
Flws!
Livsk- Games Ranking :
Notas recebidas : C + C + D + D + D + D + B + B + A + C + B
Data de inscrição : 02/06/2011
Reputação : 13
Número de Mensagens : 365
Prêmios :
x 0 x 0 x 0
x 1 x 0 x 1
x 0 x 0 x 0
Re: Crie jogos em HTML5 + javascript
Eu desativei o html nessa mensagem, agora está funcionando?
Até mais!
Até mais!
Leia o Manual do Iniciante e a Lista de Tutoriais, para aprender bastante sobre o GM.
Recomendo o Manual completo das colisões, bem útil.
O exemplo Criar um chat (banir, kickar, etc) é interessante.
Para seu jogo ficar rápido e legal, aprenda a Aumentar o desempenho do seu jogo.
Aprenda a calcular a velocidade de suas animações
Entre para o Clube do Inglês:
Re: Crie jogos em HTML5 + javascript
nao, não é isso, os codigos aparecem tranquilamente, mas quando abrimos, nao aparece a tela do javascript...
é algum erro nos scripts, tenta revisa, flw
é algum erro nos scripts, tenta revisa, flw
Tedi Ripper- Games Ranking :
Data de inscrição : 21/11/2010
Reputação : 25
Número de Mensagens : 777
Prêmios :
x 0 x 0 x 0
x 0 x 0 x 0
x 0 x 0 x 0
Re: Crie jogos em HTML5 + javascript
nao, não é isso, os codigos aparecem tranquilamente, mas quando abrimos, nao aparece a tela do javascript...
é algum erro nos scripts, tenta revisa, flw
Nem todos os navagadores dão suporte ao canvas.
Vamos fazer um teste, na onde está:
- Código:
<canvas id="game_area" width="480" height="320"></canvas>
- Código:
<canvas id="game_area" width="480" height="320">Não suporta</canvas>
Assim saberemos se suporta ou não.
Se não tiver suporte, testem no Mozilla (recomendado) ou Chrome. Ou então tentem achar algum plugin (algo do tipo) para rodar no IE.
Até mais!
Leia o Manual do Iniciante e a Lista de Tutoriais, para aprender bastante sobre o GM.
Recomendo o Manual completo das colisões, bem útil.
O exemplo Criar um chat (banir, kickar, etc) é interessante.
Para seu jogo ficar rápido e legal, aprenda a Aumentar o desempenho do seu jogo.
Aprenda a calcular a velocidade de suas animações
Entre para o Clube do Inglês:
Re: Crie jogos em HTML5 + javascript
Como faz para colocar um background ou player ( Se movendo )?
WillianAssis- Games Ranking :
Notas recebidas : C - D
Data de inscrição : 23/06/2011
Reputação : 1
Número de Mensagens : 43
Prêmios :
x 0 x 0 x 0
x 0 x 0 x 0
x 0 x 0 x 0
Re: Crie jogos em HTML5 + javascript
Eu coloquei comentários errados no final. Eu usei //, mas esse é só para javascript. Agora está melhor.nao consigo aparece assim
Até mais!
Leia o Manual do Iniciante e a Lista de Tutoriais, para aprender bastante sobre o GM.
Recomendo o Manual completo das colisões, bem útil.
O exemplo Criar um chat (banir, kickar, etc) é interessante.
Para seu jogo ficar rápido e legal, aprenda a Aumentar o desempenho do seu jogo.
Aprenda a calcular a velocidade de suas animações
Entre para o Clube do Inglês:
Re: Crie jogos em HTML5 + javascript
tudo em branco aqui
psycon- Games Ranking :
Notas recebidas : B-A
Data de inscrição : 13/01/2010
Reputação : 1
Número de Mensagens : 170
Prêmios :
x 0 x 0 x 0
x 0 x 1 x 0
x 0 x 0 x 0
Re: Crie jogos em HTML5 + javascript
Aqui também só fica a tela branca :?
Mr. Kaleb- Games Ranking :
Notas recebidas : C
Data de inscrição : 07/09/2010
Reputação : 21
Número de Mensagens : 1400
Prêmios :
x 0 x 0 x 0
x 0 x 0 x 0
x 0 x 0 x 0
Re: Crie jogos em HTML5 + javascript
Fizeram o que eu disse? Nem todos os navagadores dão suporte ao canvas. Coloquem um texto qualquer entre as tags do canvas (ultimo codigo). Se aparecer, é porque seu browser não suporta o jogo.
Se não tiver suporte, testem no Mozilla (recomendado) ou Chrome. Para rodar no IE explorercanvas é uma opção.
---------------- Se ainda quiser tentar ------------------
Copiem o código hospedado aqui e colem no bloco de notas e salvem como .html:
http://freetexthost.com/wfrg02r4d1
Até mais!
Se não tiver suporte, testem no Mozilla (recomendado) ou Chrome. Para rodar no IE explorercanvas é uma opção.
---------------- Se ainda quiser tentar ------------------
Copiem o código hospedado aqui e colem no bloco de notas e salvem como .html:
http://freetexthost.com/wfrg02r4d1
Até mais!
Leia o Manual do Iniciante e a Lista de Tutoriais, para aprender bastante sobre o GM.
Recomendo o Manual completo das colisões, bem útil.
O exemplo Criar um chat (banir, kickar, etc) é interessante.
Para seu jogo ficar rápido e legal, aprenda a Aumentar o desempenho do seu jogo.
Aprenda a calcular a velocidade de suas animações
Entre para o Clube do Inglês:
Re: Crie jogos em HTML5 + javascript
SHOOOOOW aqui deu certo
Dá pra mover um quadrado preto na tela, javascript é igual ou semelhante a java?
Tô estudando java e quero saber se aprender posso reaproveitar o conhecimento no javascript!!!!!!!
Dá pra mover um quadrado preto na tela, javascript é igual ou semelhante a java?
Tô estudando java e quero saber se aprender posso reaproveitar o conhecimento no javascript!!!!!!!
Re: Crie jogos em HTML5 + javascript
Só consegui jogar depois que você mandou o link com os códigos completos.
Deve ser alguma coisa errada nos códigos do tópico.
Deve ser alguma coisa errada nos códigos do tópico.
JV Justino- Games Ranking :
Notas recebidas : A+A
Data de inscrição : 07/12/2010
Reputação : 20
Número de Mensagens : 619
Prêmios :
x 0 x 13 x 0
x 0 x 0 x 0
x 0 x 0 x 0
Re: Crie jogos em HTML5 + javascript
SHOOOOOW aqui deu certo
Dá pra mover um quadrado preto na tela, javascript é igual ou semelhante a java?
Tô estudando java e quero saber se aprender posso reaproveitar o conhecimento no javascript!!!!!!!
Javascript não tem relação com o java. Pode ser que algo seja parecido, mas não tem relação forte.
Alguém sabe o que poderia ser?Só consegui jogar depois que você mandou o link com os códigos completos.
Deve ser alguma coisa errada nos códigos do tópico.
Até mais!
Leia o Manual do Iniciante e a Lista de Tutoriais, para aprender bastante sobre o GM.
Recomendo o Manual completo das colisões, bem útil.
O exemplo Criar um chat (banir, kickar, etc) é interessante.
Para seu jogo ficar rápido e legal, aprenda a Aumentar o desempenho do seu jogo.
Aprenda a calcular a velocidade de suas animações
Entre para o Clube do Inglês:
Re: Crie jogos em HTML5 + javascript
Não faço a mínima ideia.Pedro Henrique escreveu:Alguém sabe o que poderia ser?
Até mais!
Comparei os códigos do link com os do tópico e não vi erro algum.
Que estranho!
JV Justino- Games Ranking :
Notas recebidas : A+A
Data de inscrição : 07/12/2010
Reputação : 20
Número de Mensagens : 619
Prêmios :
x 0 x 13 x 0
x 0 x 0 x 0
x 0 x 0 x 0
Re: Crie jogos em HTML5 + javascript
Eu retirei os comentários e coloquei eles fora do código.
Era a única diferença. No meu pc, roda normal.
Mas vai saber o que poderia ser.
Até mais!
Era a única diferença. No meu pc, roda normal.
Mas vai saber o que poderia ser.
Até mais!
Leia o Manual do Iniciante e a Lista de Tutoriais, para aprender bastante sobre o GM.
Recomendo o Manual completo das colisões, bem útil.
O exemplo Criar um chat (banir, kickar, etc) é interessante.
Para seu jogo ficar rápido e legal, aprenda a Aumentar o desempenho do seu jogo.
Aprenda a calcular a velocidade de suas animações
Entre para o Clube do Inglês:
Página 1 de 3 • 1, 2, 3
Tópicos semelhantes
» [Tutorial] Variáveis em HTML5 + Javascript
» [Tutorial] Desenvolvendo Jogos em Javascript!
» Crie jogos para psp
» CURSO: Crie Jogos do Zero no Construct 2
» SmartEngine - BRASIL - Crie jogos você também!
» [Tutorial] Desenvolvendo Jogos em Javascript!
» Crie jogos para psp
» CURSO: Crie Jogos do Zero no Construct 2
» SmartEngine - BRASIL - Crie jogos você também!
Página 1 de 3
Permissões neste sub-fórum
Não podes responder a tópicos
|
|