ImpactJS - Motor de videojuegos JavaScript/HTML5

Jastro

¿Qué es Impactjs?

Impact JS es un motor de JavaScript específico para crear videojuegos. Usando la API de este motor te despreocuparás del navegador que vaya a funcionar, ya que está preparado para que ande en todos los navegadores, incluso en los de los móviles. Además cuenta con un editor de niveles y un depurador para que el desarrollo de tu videojuego sea mucho más fácil y sencillo. Ademas añade la posibilidad de crear plugins y aplicarlos de forma sencilla. Tambien viene incluido "Ejecta" un framework para hacer que nuestro juegos creados en impactjs se publiquen de forma sencilla a la AppStore.

Weltmeister

Ejecta

Precio

Este motor cuesta actualmente unos 99$, unos 70€ al cambio mas o menos. Puedes comprarlo aqui

Libros

Hay varios libros que te pueden facilitar a aprender a usar impactjs y no solo eso, ideas para ayudarte a hacer una pequeña base. IA basica, sistema de muerte, sistema de cambio de armas, etc.

HTML5 Game development with ImpactJS

Building HTML5 Games with ImpactJS: An Introduction On HTML5 Game Development (Recomendado)

Videos

Crear un juego desde el principio(Pong)

Usando el Weltmeister(Editor de niveles)

Plugins

Voy a poner algunos plugins interesantes:

Generacion random de mapa en Weltmeister

Pathfinding(A*)

Shake Screen

Juegos Creados con impactjs

Gods will be watching

Cross code

Super Paper Monster Smasher (Post LD25)

Programas o Engines que complementan Impactjs

Three.js(Libreria 3D javascript) [Demo]

Box2D(Fisicas) [Demo]

Aportes interesantes

Añadire las dudas y preguntas interesantes que vea.

6
ratontm

Jastro for president! A favs.

Una duda va, para hacer mapas continuos que sean aleatorios, se podría hacer con impact?

Por ejemplo, al estilo canabalt, vas corriendo sin parar y el mapa cada vez que empiezas tiene unos obstáculos y en teoría puedes seguir hasta el infinito.

Más info: http://en.wikipedia.org/wiki/Endless_running#Endless_running_games

1 respuesta
GreyShock

#2 Como por ejemplo...

FIRE NANO?

http://firenano.clay.io/

1 respuesta
ratontm

#3 Exacto. Jajajaja, mira que he pensado: Qué juego tenía GreyShock que utilizaba esta dinámica, y he pensado en el Dimitri, pero creo ese no sigue un endless running tal cual, ya que tiene fin.
El que recordaba era Fire Nano, sí. Podrías comentar algo sobre el funcionamiento de éste?

#5 Y eso, en vez de hacerlo con el Weltmeister, lo haces directamente en el código del mapa?

1 respuesta
GreyShock

#4 Claro :D

Yo creo que el hecho de poder hacer mapas aleatorios infinitos no depende del motor, cualquier entorno de programación te permite hacer cosas así.

Simplemente tienes que pensar qué variedad de cosas quieres que aparezcan y con qué frecuencia.

En el caso de Fire Nano fue:

  • Suelo que se puede pisar o agujero.
  • Si es suelo, la altura del terreno se determina de forma aleatoria.
    (conforme avanza el juego esta variación es más agresiva para hacer el terreno más escarpado y aumentar gradualmente la dificultad, pero eso ya son detalles)
  • Si es suelo, hay posibilidad de que encima haya:
    • Un ciervo, un cubo de agua, un fuego.
  • Cada x tiempo hay una ligera posibilidad de que aparezca un pájaro.

Todo esto tiene contadores para vigilar que no haya obstáculos imposibles, como infinitos fuegos juntos, más de 3 agujeros seguidos, etc...

Después, sólo te queda traducir eso a código xD

#4 Sip, de hecho no hay mapeado tal cual lo plantea ImpactJS. El personaje no está avanzando hacia la derecha, es el mundo lo que se mueve, en un plano fijo. El terreno se va creando por la derecha, y destruyéndose por la izquierda, son entidades programadas para ofrecer una colisión fija, desplazándose hacia la izquierda a una velocidad uniforme entre ellas.

1 2 respuestas
elkaoD

¿Y se sabe algo de cuándo va a salir Impact2? De original hay cosillas que no me gustan (sobre todo el soporte para multiplayer) pero por lo que leí del 2 tiene mejor pinta en esos temas.

Si compras Impact... ¿te sale más barato Impact2 o algo así?

Esto me recuerda que #5 nos debe un postmortem del multiplayer de Sugar Loco Wrestling.

1 respuesta
Jastro

Hay poca info sobre Impact 2, estoy ansioso de que salga. Pero actualmente en los foros oficiales donde puede acceder los que tienen comprado impactjs, solo dice que esta haciendolo, pero que no hay fecha de salida aun, desde que sepa algo avisare.

Actualmente no se sabe, si sera un motor aparte para comprar, si es una update. No hay mucha info, espero que de señales pronto, ya que yo tambien quiero darle caña al multiplayer

GreyShock

#6 mierda... esperaba que hubiera pasado de fecha ya.... xDDD cuando preescriben las promesas? xD

Lo he tenido mucho tiempo apuntado en mi listad de quehaceres (En astrid.com, un gestor sencillito de tareas que recomiendo, vinculable con tu cuenta de google), pero... ahora con GWBW de por medio y todo el curro q tengo con él... queda pospuesto de forma indefinida.

autlos

Buuuuhh! yo pensaba que este era el hilo en el que jastro y grey iban a rular giveaways de impact.
:f5:

Jastro

¿A alguien mas le pasa que va haciendo "tics" la pantalla? A veces pareceria que no carga correctamente mientras avanza.

1 respuesta
GreyShock

#10 Échale un vistazo a la performance con el debugger de ImpactJS. Me huele a que esos tirones los ocasiona el pathfinding, iluminación dinámica, o algún otro de los plugins que estás violando xD

1 respuesta
Jastro

#11 Probablemente sea la de luz dinamica, es el unico que tengo, y hace cosas raras, a veces va a 60 fps, a veces 10, segun le da xD

1 respuesta
elkaoD

#12 probablemente no, seguro.

La luz dinámica es un auténtico orto sin aceleración.

1 respuesta
Jastro

#13 estoy usando un plugin, que en su dia la gente se quejaba porque iba a 10 fps, el tio lo mejoro y actualmente en chrome VA perfecto, en firefox a la ultima version funciona tambien, pero a veces baja el rendimiento, echale un pruebe si quieres.

www.pixelfan.org/games/prueba

1 respuesta
Baltar

Me lo apunto :)

ratontm

Acabo de descubrir: http://asmallgame.com/labsopen/webgl_impact/

Vaya curro..

#17 Yo ni lo he mirado, tengo que estudiar y si me meto ahí no sé cuando saldré. xDD Habría que hacer una buena recopilación de plugins en #1!

2 2 respuestas
Jastro

#16 ah si olvide añadirlo al post. Eso era una demo usando la tecnologia Three.js con el impactjs. Me parece sencillamente increible y me puse a indagar un poco por encima y la verdad, no entendia una mierda xD. Espero algun dia darle mas caña y probarlo bien.

1 1 respuesta
elkaoD

#14 la mayor parte del tiempo (69%) tu script lo pasa en impact.js (linea 18):

Number.prototype.limit = function(min, max) {
    return Math.min(max, Math.max(min, this));
}; 

Ahora busca desde dónde se llama.

EDIT: corrijo, en el slowdown se va a drawShadowMap de light.js.

1 respuesta
Jastro

#16 ya cree un apartado, luego cuando me acuerde, voy agregando mas
#18 gracias Kaod, cuando llegue a casa lo miro y te digo :)

El Drawshadomap, es lo que se haga "oscuro" la zona, chupa un huevo de recursos, pero no se si es el plugin que esta mal programado o que la forma de trabajar es asi :/

3 meses después
GreyShock

Actualización de ImpactJS a la versión 1.23, ahora trae un sistema de pooling para optimizar recursos con aquellas entidades que sean de uso masivo, como balas o enemigos.

http://impactjs.com/documentation/entity-pooling

1
2 meses después
ratontm

Hola señores. Como alguno sabéis estoy liado con un proyecto para la universidad trabajando con Node y Impact. El tema es el siguiente, se trata de un juego que se controla desde el móvil utilizando Node y Socket.IO.
Realmente el control con el móvil es para presentarlo, ya que queremos mediante un proyector ponerlo en una pared de la universidad y que la gente que pase pueda jugar un rato.

El juego en sí es un endless runner, aún no hemos definido un motivo exacto. De momento sólo tenemos un mapa muy básico que se repite una vez tras otra mediante un plugin al que le pasas unos mapas y te los encadena uno detrás de otro de forma aleatoria. Aún no nos hemos metido con el tema de la aleatoriedad.

Y me surgen unas cuantas dudas, para empezar, ¿alguna forma de que no haya tanto lag? Lo tenemos actualmente en Heroku. http://impactnode.herokuapp.com/ Por si queréis probarlo, ya digo, que no tiene nada aún. Pilláis el código QR con el móvil y os llevara a una página donde hay un botón. Simple.
Cómo soy un noob del tema no sé si es la forma más eficiente de hacerlo:

Utilizando socket en impact declaro una variable global, si se pulsa el botón manda un mensaje y cambia el valor de la variable a true, si se suelta el botón false. Con esa variable controlo que la entidad si es true salte y si es false pues no.

Main:

socket.on('send_up', function() {
	        console.log('recibido');
			ig.game.up = true;
	  	});
  		socket.on('send_stop', function() {
  			ig.game.up = false;
  	    });

Entidad:

if( this.standing && ig.game.up==true ) {
			this.vel.y = -this.jump;
		}

Por otro lado también quería saber, como implementar un sistema de leaderboards. Los que he visto se guardan en la caché del navegador, pero quiero algo que se guarde en una base de datos o algo así, ¿alguna forma para hacerlo?

Saludos!

3 respuestas
GreyShock

#21 Para los leaderboards globales, que yo sepa, necesitarás una BDD. Eso sí, prepárate a que te la peten en lo que dura un suspiro, ya que ninguno de los leaderboards web que he montado han quedado libres de abuso xD

Sobre el lag... es inevitable. Y encima has elegido un género en el que el timing es vital. Estás jodido xD Precisamente también monté algo con ImpactJS, Node y Heroku (Sugar Loco Wrestling); y luchar contra el lag fue más bien una cuestión de game design que de otra cosa (a parte de las básicas predicciones de movimiento y correcciones de posición que programé).

Así que si ya es demasiado tarde para cambiar el género del juego, te recomiendo que intentes llegar a una solución "creativa", como que el prota camina sobre suelo pegajoso y tienes que darle múltiples taps cada vez que quieres saltar - y en ese espacio se disimula el lag - o alguna cosa por el estilo...

1 2 respuestas
ratontm

#22 Jajaja pues fracaso en ambas preguntas. xD

Conocía el Sugar Loco, y sabía que lo habías montado con Node y los problemas que te dio, pero como esto no es multiplayer pensaba que habría una solución más fácil. Pero no. xD

Y lo de los leaderboards, pff. Imaginaba que habría problemas con eso, sobretodo siendo yo un novato de BDD, seguridad nula.

A ver como lo montamos al final, y a ver si puedo ir poniendo progresos. Gracias grey!

1 1 respuesta
B

#22 Qué tal al experiencia con Heroku? Mucha clavada? de verdad te gusta?

1 respuesta
GreyShock

#23 de nada :D también se me ha ocurrido que podría ser una robotito con propulsor y le cuesta despegar... no sé, digo ideas absurdas para ver si te salta alguna chispa xD

#24 No he pagado nada en heroku, hasta que no pasas de ciertos requisitos para el server es gratuito. Estoy contento con heroku y sus servicios considerando que es gratis, no he encontrado ninguna alternativa gratuita.

B

#21 estás guardando la posición del jugador en el servidor node y te lagea?, en ese caso mirate este artículo:

http://onedayitwillmake.com/blog/2011/08/creating-realtime-multiplayer-games-using-node-js/

B

#21: Creo que Heroku no se lleva/llevaba muy bien con websockets, al menos el "Cellar stack"? creo que era.

#28: Y no dará más lag el polling?

1 respuesta
ratontm

#27 Ya, por eso hay que utilizar xhr-polling.. Aunque ahora que lo dices creo que hace poco habilitaron WebSockets.

Bueno, de hecho no lo creo, lo confirmo: https://devcenter.heroku.com/articles/node-websockets

A ver si en un rato intento cambiar la app para ver si tiene menos lag, que tampoco sé que método es mejor.

#27 Supongo que sí, por eso el motivo de cambiarlo. Es que justo cuando has dicho lo de websockets he caído en la cuenta de que Heroku ya permite utilizarlo.

1 1 respuesta
20 días después
ratontm

Sabéis alguna forma para hacer que un personaje salte más o menos según el tiempo que pulsa el botón? He pensado con timers, pero no se me ocurre cómo.

#30 Gracias Grey! Luego lo pruebo y digo a ver que tal.

1 respuesta
GreyShock

#29 Diría que es algo así:

if( pressed.jump and puede saltar){
	saltando = true;
	puede saltar = false;
	limitesalto = pj.pos.y - potencia de salto;
	pj.velocidad hacia arriba = - velocidad de salto;
}

if( mantener apretado.jump and saltando == true){
	pj.velocidad hacia arriba = - velocidad de salto;
}

if( released.jump or pj.pos.y <= limitesalto){
	pj.velocidad hacia arriba = 0;
	saltando = false;
}

if( personaje toca el suelo ){
	saltando = false;
	puede saltar = true;
}
1 1 respuesta
Tema cerrado