Primer tutorial: Tappy Plane

Vamos a aprender a como hacer un juego en Game Maker Studio. Será un juego muy básico, para empezar a conocer como funciona el programa y las posibilidades que nos da. Si os gusta más aprender el programa con ejemplos que leeros todas las funcionalidades que hemos puesto, podéis acceder directamente aquí, ya que lo haremos paso por paso.

Es posible que os acordéis de un juego que se hizo muy famoso llamado Flappy Bird, un juego con una mecánica muy sencilla y con una dificultad endiablada. El juego fue número uno en descargas en las tiendas de la Apple Store y Google Play, y el propio autor lo retiró sin dar explicaciones (está claro que murió de éxito).

Este tutorial será un juego muy parecido a este juego. Utilizaremos la misma mecánica, que consiste en evitar los obstáculos, pulsando con el ratón para hacer que suba el jugador y teniendo en cuenta la gravedad.

Primer paso: añadimos las imágenes necesarias

Iniciamos la aplicación, y en la ventana inicial vamos a la pestaña new. Elegimos una ruta donde guardaremos nuestro proyecto y en Project Name pondremos Tappy Plane. Se abrirá una ventana parecida a ésta:

Así vemos el entorno del programa al añadir un proyecto nuevo vació

Utilizaremos imágenes con licencia Creative Commons. En la dirección http://opengameart.org/content/tappy-plane podemos coger las imágenes de Kenney. Así que ¡vamos a descargarlas!
Ahora crearemos los primeros sprites. Iremos al menú Resources – Create Sprite. Le damos al botón Load Sprite y buscaremos la carpeta de Tappy Plane, en la ruta PNG – Planes. Elegiremos 3 imágenes de un color (elegid el color que queráis). Aseguraros que en el Nombre archivo aparecen los 3 ficheros seleccionados.

De esta manera podemos cargar varios ficheros dentro de un sprite

Le damos al botón Abrir y nos cargará las imágenes. ahora le damos un nombre al sprite, por ejemplo spr_plane.

Ya tenemos el sprite principal del juego

Ahora haremos los mismos pasos con el fichero rockdown.png que hay en la carpeta PNG. El nombre del sprite será spr_rock.

Sprite que usaremos como obstáculo para nuestro juego

Este sprite tendrá una máscara precisa, es decir, su máscara será igual que el dibujo que vemos.
Hacemos click en Modify Mask y marcamos la opción Shape – Precise. Quedará de la siguiente manera:

Al pulsar Precise vemos como cambia la máscara que afectará a las colisiones

Ahora añadimos una imagen como fondo del juego. Vamos a la opción de menú Resources – Create Background y seguimos los mismos pasos que hasta ahora para elegir el fichero backgroung.png.

Vemos el fondo que elegiremos para nuestro proyecto

Guardamos todos los cambios que hemos añadido al proyecto Para eso, vamos al menú File – Save o al botón correspondiente de la barra de herramientas .

Crear los diferentes objetos

Vamos a crear los objetos necesarios para el juego, añadiendo toda la programación que haga falta. Empezamos por el más sencillo.

Objeto roca

Vamos a Resources – Create Object. En la ventana que vemos, en Name pondremos obj_rock_down.
Elegimos su sprite. Vamos a la casilla de elección de sprite, justo debajo de nombre, y le damos al botón que hay al lado de dónde pone . Nos saldrá una lista y elegiremos spr_rock.

Le damos al botón de Add Event y de la ventana que aparece elegimos la primera opción Create.

La ventana que aparece para añadir eventos a un objeto

Una vez añadido el evento, añadiremos su acción relacionada. Nos aseguramos que estamos en la pestaña move (derecha del formulario de objetos) y arrastramos el primer botón de la zona de Actions. Pulsamos la flecha de la izquierda y en Speed le damos valor de 4.

Le damos OK y se añadirá la acción elegida. Ya podemos dar por finalizado todas las acciones del objeto, asi que también podemos darle OK a la ventana de propiedades del objeto.

Copia del mismo objeto

Crearemos el mismo objeto con las mismas características, pero con alguna ligera diferencia, que llamaremos obj_rock_up.
Una vez hemos añadido el mismo sprite, el mismo evento y la misma acción de movimiento, añadiremos una acción nueva. Iremos a la pestaña main1 y haciendo Drag&Drop del botón de Transform sprite. Aparecerá una ventana y elegimos la opción de mirror flip vertically.

También añadiremos una acción nueva, en la pestaña move, arrastramos Jump Position.  En y ponemos 480 y marcamos la casilla Relative.

Objeto controlador

Es muy típico en muchos juegos crear un objeto que no tenga ningún sprite, y que sólo se dedique a pintar cosas globales (por ejemplo la puntuación global) o a generar objetos y/o enemigos. Vamos a hacer algo muy parecido para este proyecto.
Creamos un objeto nuevo, lo llamamos obj_controller. Añadimos un evento Create, y en la pestaña main2 arrastramos el botón de Alarm. Le daremos un número de steps de 60.

Creamos un evento nuevo. Le damos a Add Event y le damos al botón Alarm. Saldrá una lista y elegimos Alarm 0.
Una vez añadido el evento Alarm 0, añadiremos dos acciones. Primero vamos a la pestaña main1 y arrastramos el botón Create random, En object1 pondremos obj_rock_down, y en object2 pondremos obj_rock_up. En x pondremos 850. Quedará así

Por último, añadimos otra vez la acción Alarm de la pestaña main2, y su valor de 60. El objeto obj_controller ya está acabado.

Testear lo que hemos probado

Con lo que tenemos hecho, podemos probar si los objetos que hemos programado son correctos.

Creamos la room

Iremos a Resources – Create room, se abrirá una ventana que es el editor de rooms. Iremos a la pestaña que pone Settings y pondremos en name room_main. En Width pondremos 800 y en Height 480.

Añadimos el fondo

En la pestaña backgrounds marcamos la casilla Visible when room starts, elegimos el único que tenemos (si no hemos cambiado el nombre se llamará background0). En la casilla Hor. speed pondremos -1, para que se mueva ligeramente el fondo.

Vemos que en la derecha de la room gris se ha añadido el fondo.

Ahora añadiremos los objetos

Vamos a la pestaña de Objects y elegimos el objeto obj_controller.

Cuando esté seleccionado, haremos click en la room de la derecha. Se añadirá el objeto con un símbolo “?” (significa que no tiene un sprite asociado).

Ejecutamos el juego

Para ejecutar y probar el juego, vamos al menú Run – run normally y vemos el resultado.

Añadimos más objetos: el jugador

Hemos visto como se mueven los objetos, pero nos falta que interactue el jugador.
Creamos el objeto obj_plane, y asociamos el sprite spr_plane. Añadimos el evento Step y añadimos la acción gravity. Le damos los valores de direction 270 y gravity 1.

Añadimos el evento Mouse – Global Mouse – Global Left Released. Añadimos la acción Vertical Speed de valor -10.
Ahora añadimos el evento Collision y elegimos el objeto obj_rock_down. La acción que añadimos es Display message y pondremos en el texto GAME OVER. Luego añadimos la acción Restart Game.
Haremos las mismas acciones con otro evento Collision, pero con el objeto obj_rock_up.
También lo haremos con otro evento pero esta vez duplicaremos un evento colisión, haciendo click con el botón derecho y eligiendo Duplicate event. Aparecerá la ventana para elegir eventos, que elegiremos Other – Intersect boundary. Le damos OK a la ventana de propiedades del objeto para acabar todas las opciones. Ahora lo añadiremos a nuestra ventana de juego.

Añadir objeto a la room

Vamos a la ventana de edición de rooms. Añadimos nuestro objeto obj_plane en la room que hemos creado, intentando que quede más o menos en la mitad de la room.

Podemos ejecutar el juego. Ya hemos creado nuestro primer juego.

Final

¿Qué os ha parecido? ¿Habéis seguido todas las indicaciones? Os dejo el proyecto importado aquí:
Tutorial Tappy Plane
Espero que el tutorial sea suficientemente claro, no obstante, no dudes en poner vuestra opinión en los comentarios.