Desarrollo de videojuegos con PICO-8

Antes de nada…

Este tutorial o quizá, mejor dicho, serie de apuntes, están basados y se han hecho siguiendo el fantástico proyecto de Lazy Devs sobre cómo crear un juego estilo Breakout. Por lo que todo el crédito de lo que aquí trataremos se lo debemos a esa serie de vídeos. Para mi un método de estudio para asentar conocimientos siempre ha sido ir tomando apuntes, por lo que, ya que iba a hacerlo he pensado en tomarlos en un formato publicable y de esta forma compartirlos, por un lado, para que estén en castellano, ya que la serie de tutoriales son en inglés y por el otro porque muchas veces un formato escrito es más claro y al final más fácil de consultar qué información que se encuentra en formato de vídeo. Por lo que espero que los disfruteis y os sea de gran utilidad. Estos posts van a recorrer desde los conceptos más básicos y generales de la programación, hasta metodologías concretas de desarrollo de videojuegos para PICO-8.

Y sin más dilación, vamos a empezar nuestro viaje...

¿Qué es PICO-8?

El proyecto de PICO-8  surge como la idea, bastante curiosa, de recrear una consola que en realidad nunca ha existido. Sus características y capacidades son similares a la Nintendo NES y, de hecho, puedes probar la consola en itchi.io y jugar a un montón de juegos de forma totalmente gratuita. Pero lo que me resulta más interesante es el hecho que ofrece un entorno no solo para jugar, sino también para diseñar y desarrollar  un juego en todos los aspectos. Permite por un lado crear scripts  en el lenguaje de programación LUA, diseñar tilesets y animaciones, crear sonidos y música así como una serie de funcionalidades para poder publicar tus proyectos una vez estén listos.  

Personalmente lo más atractivo e interesante de todo esto son las limitaciones en sí a las que nos enfrentamos. PICO-8 no es un entorno de desarrollo para crear grandes juegos, de hecho parte de limitaciones importantes en todos los aspectos anteriormente mencionados, hay un límite de memoria que nos impide crear más de un determinado número de estructuras de programación. Hay limitaciones gráficas y la música debe ser de 8-bits. Parece en realidad algo malo, pero si lo piensas esto nos ayuda a mantener los pies en el suelo para nuestra ideas y por otro lado a simplificar el proceso de desarrollar un juego.

En este sentido, no solo supone una gran forma de aprender a programar, sino que nos ayuda a limitar la ambición de nuestros juegos y mantenerlos simples, aprender realmente desde los fundamentos, sin assets, bibliotecas y otras locuras en las que es fácil perderse en entornos de desarrollo más complejos como podría ser Unity. PICO-8 tiene esta magia de encontrarse todo integrado en un solo y ligero programa y de obligarnos a una metodología simple y algo cruda de desarrollo.

Hello World

Vamos a empezar ya en matería, vamos a crear nuestro primer programa en PICO-8. Para empezar a escribir nuestro primer programa, una vez tengas el programa PICO-8 descargado y abierto, pulsa la tecla ESC para entrar directamente en su IDE de programación. Deberías ver la siguiente pantalla:

Tenemos que entender un programa como una lista de tareas, que escritas en un lenguaje entendible por la máquina o por un compilador van a ser ejecutadas para desarrollar una determinada función, esto puede ser, resolver algún problema, darnos algún dato o en este caso en concreto escribir un mensaje por la pantalla.

print()

Para imprimir cualquier cosa por pantalla en LUA se usa la palabra PRINT seguido de la apertura de paréntesis y cierre de parentesis. El mensaje de texto en sí que queramos mostrar siempre va a ir entre comillas, por lo que el comando consta como se muestra en la imagen:

No quiero enredarte mucho aún con estos conceptos, pero para mí me parece relevante mencionar que PRINT es lo que en programación se conoce como un método. Un método es un conjunto de líneas de código que desarrollan una función concreta. En este caso tras la palabra PRINT se esconden en las bibliotecas de pico-8 o LUA una serie de líneas de código que no vemos pero que son llamadas en el momento en que escribimos PRINT y que son las que realmente hacen que se escriba un mensaje por pantalla.

Todos los métodos y funciones van seguidos de los paréntesis (), esto nos permite pasar valores, como en este caso es la cadena de caracteres “Hello World” a dicho método. No todos los métodos necesitan de valores pasados por parámetro para funcionar, sin embargo es habitual que acepten dichos valores y hagan algo con ellos. En este caso si usamos print y no le damos ningún valor por parámetro no va a escribir nada.

Si algo de lo que he dicho te ha confundido más, ni caso, quédate que PRINT sirve para mostrar por pantalla información. Ahora pues, nuestro programa está finalizado. Pulsamos ESC una vez más y introducimos el comando  RUN en el terminal de PICO-8 para ejecutar nuestro proyecto:

¡Felicidades has hecho tu primer programa!

CLS()

Vamos a añadir este método a nuestro programa. CLS es otra palabra reservada, que seguida de ( ), nos permite limpiar todo lo que haya en pantalla cuando PICO-8 ejecute dicho método. Por ello, si lo ponemos como la primera línea  de código de nuestro programa y hacemos RUN observaras que todo el texto de la pantalla se limpia y el mensaje de Hello World aparece arriba del todo:

Ahora vuelve al terminal y escribe RUN, deberías ver lo siguiente en pantalla:

En este punto es importante entender que esta forma de programar es lo que se conoce como secuencial. Ahora mismo tenemos 2 líneas de código o dos comandos en nuestro programa. Cuando escribimos RUN en la consola, se ejecuta la 1era línea y luego la segunda. Para que esto se entienda, mira el siguiente programa, en el que hemos añadido unos cuantos comandos más de PRINT para escribir la letra de una canción, que espero reconozcas ;) 

Y lo que sucede al ejecutar dicho código es que se ejecutan secuencialmente desde la primera línea que limpia la pantalla hasta el HERE WE GO!

Posición en la pantalla y color

Hasta ahora todo el texto que hemos sacado por pantalla se ha escrito partiendo del punto superior de esta. Es la posición por defecto en la que la función PRINT muestra cualquier cosa por pantalla. Sin embargo, en un juego puede ser que necesitemos imprimir un mensaje en otro punto. Ahora es un buen momento para volver a la explicación anterior sobre los métodos o funciones. Ya que a la función de PRINT() vamos a añadirle otros valores más allá del texto, otros parámetros, que en realidad funcionan como coordenadas en la pantalla.

De hecho vamos a imprimir un corazón por pantalla en una localización concreta y con un color. Para ello empezamos con nuestro método PRINT(“ ”). Dentro de los paréntesis vamos a escribir en vez de una cadena de texto nuestro corazón. PICO-8 no distingue entre letras minúsculas y mayúsculas (cosa que simplifica mucho la programación ya que hay muchos lenguajes que si juegan con dicha diferencia) por lo que cuando apretamos shift y alguna letra veremos pequeños símbolos en pantalla. Para hacer un corazón solo tienes que presionar SHIFT + H. Además del corazón, vamos a escribir una coma y los siguientes números 30, 30 y 8.

• El primer 30 es la posición en el eje de las X o sea desde la izquierda de la pantalla hacia la derecha. Este valor se expresa en píxeles, por lo que estamos diciendo que muestre el corazón 30 píxeles hacia la izquierda.

• El segundo 30 es la posición del eje Y, o sea desde la parte superior de la pantalla hacia abajo.

Ten en cuenta que en PICO-8 la pantalla tiene un cuadrado de 128x128 pixeles, por lo tanto el extremo superior izquierdo tendrá la coordenada 0,0 y el extremo inferior derecho se corresponde con 127x127.

• El 8 es el color del texto. PICO-8 tiene una paleta de colores y cada uno de estos se corresponde con un número.

Prueba a jugar con las coordenadas y ejecuta el programa para ver donde se imprime el corazón.