Viaja en el tiempo con Braid | Estructura alámbrica #60

Crea una mecánica de inversión del tiempo sacada directamente del éxito independiente de 2008, Braid. Mark Vanstone tiene el código, directamente de la edición de marzo de la revista Wireframe, disponible ahora.

¿Cuántas veces has jugado un juego y desearías haber hecho el último movimiento de manera diferente? En 2008, Braid respondió gracias a la ingeniosa mecánica de inversión del tiempo del diseñador Jonathan Blow. Si saltaste en el momento equivocado y te caíste por un agujero, podrías retroceder en el tiempo e intentarlo de nuevo.

Los gráficos de Braid fueron creados por el artista David Hellman, quien generosamente puso la obra de arte disponible para descargar desde su sitio web; los hemos usado para recrear la mecánica del tiempo de Braid con Pygame Zero. También hay un video de la Conferencia de desarrolladores de juegos en el que Jonathan Blow describe cómo codificó la parte de inversión del tiempo del juego, por lo que tenemos una buena idea de cómo abordar este desafío. Solo haremos una pequeña sección del juego aquí, pero podría ampliarse fácilmente utilizando materiales proporcionados por los creadores originales.

En Braid, Tim resuelve acertijos y colecciona piezas de rompecabezas para salvar a una princesa, aunque hay más en la trama de lo que parece a primera vista.

Antes de llegar al bit de tiempo de inversión, necesitaremos crear una pantalla de juego de plataformas básica. Braid tiene un fondo de desplazamiento de paralaje con elementos de primer plano de aspecto orgánico. Realmente no podemos crear el entorno del juego a partir de bloques separados, como podríamos hacer en otros juegos de plataformas retro, por lo que solo tendremos una imagen grande para el fondo y otra para las ‘plataformas’ al frente, y esto formará el entorno. en el que corre el protagonista Tim. También necesitamos otra imagen invisible para la detección de colisiones, para probar hacia dónde se mueve Tim y si su camino está bloqueado. En nuestra imagen de colisión, los píxeles blancos se pueden mover, los negros son las plataformas y el área azul representa una escalera de cuerda que Tim puede subir.

Moveremos a Tim de izquierda a derecha con las flechas del teclado. Esto desplaza el entorno junto con el fondo moviéndose a la mitad de la velocidad del primer plano para crear un efecto de paralaje. Hay varios cuadros de animación, tanto hacia la izquierda como hacia la derecha, para Tim corriendo, por lo que los recorremos mientras se presionan las teclas de flecha. Necesitamos verificar si Tim está parado en una plataforma, así que verificamos el píxel debajo de sus pies en la imagen de colisión, y si no es negro, le aplicamos un poco de gravedad. Hay un pequeño cambio en la gravedad para permitir que Tim suba pendientes. Si movemos a Tim un píxel hacia arriba antes de aplicar la gravedad, eso permitirá pendientes poco profundas durante el movimiento. También evitaremos que Tim corra a través de las paredes verificando la dirección en la que se mueve para detectar colisiones. Podemos hacer que Tim salte con la barra espaciadora activando una cuenta regresiva de salto, con Tim moviéndose hacia arriba mientras el contador llega a cero, antes de que el cálculo de la gravedad se active nuevamente.

Nuestro homenaje al clásico juego de trenzas. Presione ‘retroceso’ para activar la mecánica de rebobinado de tiempo.

Ahora podemos tratar con el elemento de cambio de tiempo. Para hacer que el juego se ejecute al revés, haremos una lista de todas las cosas que están cambiando en la pantalla en cada cuadro. En este caso, solo hay unos pocos elementos móviles, pero en el juego original, había muchas cosas que debían recordarse, por lo que habría comenzado a ocupar bastante memoria. Todo lo que necesitamos guardar en nuestra versión es la posición, la dirección y el número de cuadro asociado con Tim, y la posición del fondo y las plataformas. Ponemos todos estos datos en una lista y los seguimos agregando. También podemos poner un recuento de cuántos segundos han pasado (a 60 fotogramas por segundo) en la parte superior de la pantalla.

Al pulsar RETROCESO se activa el rebobinado. Ahora miramos la última entrada en nuestra lista y establecemos los atributos de Tim y la posición del entorno para reflejar esos datos. Luego borramos la última entrada de la lista y retrocedemos el contador de tiempo. De hecho, podemos retroceder dos espacios en la lista de datos y hacer que el rebobinado se produzca el doble de rápido que la velocidad normal del juego. Y eso es todo. El juego original tenía muchos elementos más complejos con los que Tim debía lidiar, pero te dejaremos que intentes agregarlos a este peculiar y fascinante rompecabezas de plataformas.

Aquí está el código de Mark para una mecánica de rebobinado que dobla el tiempo. Para que funcione en su sistema, primero deberá instalar Pygame Zero; las instrucciones completas se pueden encontrar en wfmag.cc/pgzero. Para obtener el código completo, diríjase a nuestro Github.

Obtenga su copia de Wireframe 60

Puede leer más funciones como esta en el número 60 de Wireframe, disponible directamente en Raspberry Pi Press: realizamos envíos en todo el mundo y hay muchas ofertas de suscripción para ahorrar dinero en el precio de un número.

Y si prefieres tus revistas en formato digital, ¡también puedes descargar el número 60 de Wireframe en PDF gratis!