Maquetación Web Dinámica / Del canvas al motor: videojuegos con Phaser

Reto: migra tu juego del módulo 13 a Phaser

Reto95 min100 XP

El reto más revelador del módulo: tomar el juego que programaste A MANO en el módulo 13 — Pong, Snake o Breakout — y reconstruirlo en Phaser. No es repetir trabajo: es SENTIR, línea por línea, cuánto te resuelve un motor. Al terminar tendrás el mismo juego en dos versiones y una intuición clarísima de cuándo vale la pena cada enfoque.

Reto

El mismo juego, ahora en Phaser

Difícil90 min100 XP(×2 sin mirar la solución)

Qué debes construir

Reconstruye en Phaser tu juego del módulo 13. La solución de referencia migra Pong (el proyecto de la lección 10 del módulo 13). Tu misión: lograr el mismo juego, apoyándote en la física, los colliders y el input del motor en vez de programarlos a mano.

Requisitos:

Misma jugabilidad que tu versión a mano: si migras Pong, dos paletas, bola que acelera, marcador y victoria.
Usa lo que el motor da: la física arcade para la bola (setBounce, colliders con las paletas) en vez de tu vy *= -1 manual; el puntero o los cursores para el control.
Marcador y fin de partida (primero a 5), con reinicio.
Al entregar, escribe en un comentario 2-3 diferencias que notaste entre tu código a mano y el de Phaser (qué desapareció, qué se volvió declarativo).

Reglas

Phaser + la física arcade. La bola NO debe llevar tu integración manual de velocidad: deja que el motor la mueva y rebote.
Reutiliza los patrones del módulo: colliders (lección 4), input (lección 5), y opcionalmente escenas (lección 8).
Texturas generadas por código (sin assets externos), como en todo el módulo.

90:00

Cuando estés listo, arranca el reloj.

El razonamiento — lo revelador de esta migración es lo que DESAPARECE:

La integración manual de física se esfuma. En el módulo 13 escribiste bola.x += bola.vx, la detección de suelo/paredes y el vy *= -1 de cada rebote. En Phaser: setVelocity una vez, setBounce una vez, y colliders. El motor integra el movimiento y resuelve los choques — desaparecen ~20 líneas de física.
Las colisiones se vuelven declarativas. Tu chequeo manual "¿la bola está en la franja de la paleta?" se convierte en this.physics.add.collider(bola, paleta). Declaras la RELACIÓN, no el cálculo.
Lo que NO cambia: el diseño. El "efecto" del golpe, la IA con tope, la condición de victoria — esa es tu lógica de juego, y sigue siendo tuya. El motor te quitó la fontanería, no las decisiones. Esa es exactamente la línea entre lo que un motor resuelve y lo que sigue siendo diseño.

Pong en Phaser, jugable (mueve el mouse; primero a 5 gana):

Autoevaluación: ¿tu bola se mueve y rebota con física del MOTOR (no con tu integración manual)? ¿Los colliders reemplazaron tus if de colisión? ¿Escribiste las 2-3 diferencias que notaste? Cuenta cuántas líneas de física del módulo 13 ya no existen — ese número es lo que un motor te regala.

Nota honesta: no todo mejora. Para un juego DIMINUTO (un Pong de 100 líneas), Phaser puede sentirse "de más" — cargas una librería grande para algo que el canvas resolvía. El motor gana claramente cuando el juego CRECE: muchas escenas, física compleja, assets, animaciones. Saber cuándo el canvas a mano basta y cuándo el motor paga su peso es, otra vez, criterio de ingeniero.

Qué sigue

Migraste un juego y sentiste el poder del motor. El proyecto FINAL del módulo lo aprovecha a fondo: un plataformero 2D completo — correr, saltar, enemigos, monedas y dos niveles — el tipo de juego que sería una pesadilla a mano y que Phaser vuelve alcanzable. El examen mayor de todo el arco de videojuegos.