Tecnología Multimedia 1

Introducción

A lo largo de la cursada fuimos aprendiendo y desarrollando diversas funciones en processing con las cuales desarrollamos el trabajo final, con la implementación de condicionales (if), ciclos y arreglos (for & array), la utilización de librerías para sonido, grillas, entre otros. A continuación, se explicará cómo se desarrolló la aventura gráfica.

Estructura de cada pantalla

if (contador == 1) { background(75); textAlign(CENTER, TOP); textSize(width*0.04); fill(255, 80, 80); image(fotos[2], width/2, height/2, width, height); text("Te vas un fin de semana de vacaciones al \n monte tan solo con una mochila y tu carpa.", width/2, height/13); boton(width*0.875, height*0.916, width/8, height*0.083, 2);

Funcionamiento de la aventura

En mi aventura gráfica, Campamento en el bosque, utilicé una variable que al posicionarse en X número había un if que tras detectar ese valor devolvía el contenido, a modo de ejemplo: el programa inicia con el contador en 0, pero al apretar una tecla se establece cómo 1, lo que muestra la primera pantalla y el botón que lleva a la pantalla 2, y así sucesivamente.

En las intersecciones, donde el usuario debía elegir que camino elegir, este número optaba un segundo valor, por ejemplo, si en la pantalla 3 el usuario tiene la disyuntiva de elegir, puede elegir entre el 3.1 o 3.2 (31 o 32 respectivamente), y así con las subdivisiones de cada camino.

A su vez cuando se utiliza un botón para clickear sobre otro es necesario esperar un tiempo de espera (cooldown), funciona con un contador que al presionar un botón se reestablece a 0 y empieza a crecer, al ser superar a X valor los botones se pueden accionar.

El recorrido del usuario

Acerca del juego

El juego se desarrolla dentro de un arbusto en el que hay que recoger unas bayas dulces, las cuales son necesarias para sobrevivir y a su vez para continuar la aventura gráfica. El objetivo es conseguir las bayas evitando que los insectos que se encuentran en el arbusto acaben con tu mano.

Objetos

Utilizando una clase principal se articularon 5 objetos: El personaje (la mano), la baya (los objetivos a conseguir), un enemigo (los bichos). A su vez en entorno y el ataque son dos objetos complementarios que permiten poner una imagen de fondo y los límites del mapa, y el ataque que se complementa con el objeto del personaje.

• Mano y Ataque
• Objetivos
• Enemigos
• Entorno

Para crear el personaje utilicé una imagen que con las arrows se modifica su px y py, logrando que se mueva a la hora de colisionar con otros objetos, en la clase principal del juego, cuando la cercanía de las posiciones de los objetos era menor a su tamaño ocurría algo. Por ejemplo, sumar un puntaje o perder una vida

El personaje está acompañado por otro objeto, que es el ataque, una animación de un puño que avanza y puede matar a los enemigos. La mecánica que se utilizó para lograr este efecto consta de llamar a la clase, empieza a decrecer su py, solo ataca hacia adelante, y cuando está lo suficientemente lejos del personaje (que es una mano) la clase atacar se vuelve false y la mano volvía a su tamaño original, anteriormente la mano era resizeada a 0 para no romper con la lógica del juego (de lo contrario la palma de una mano arrojaba un puño por sus dedos, un efecto que no se buscaba, aunque era bastante gracioso de ver)

Cómo objetivo a conseguir elegí una baya dulce (fruta) que la mano debía tocar para conseguirla, una vea creado el objeto, al llamarlo en la clase principal del juego podía determinar con un array cuantas frutas deseaba y al estar articulado directamente esa variable con la cantidad que eran necesarias para ganar configurar la cantidad de objetivos para alcanzar es bastante fácil.

Al igual que las bayas dulces, los enemigos son un solo objeto que mediante un array se puede replicar y posicionar dentro de un rango determinado para que aparezcan. A su vez, se les suman la posibilidad de moverse y al llegar a los límites del mapa utilizan otra imagen del mismo insecto dado vuelta, así da la impresión de que giran

En el entorno cómo ya se mencionó anteriormente se determinan los límites para que la mano y los insectos no abandonen el área donde se realiza el juego. Sin embargo, los objetos una vez que el personaje entra en contacto con ellos se reposicionan fuera del mapa.

Adaptación de la aventura

Para desarrollar el trabajo final debimos adaptar la aventura gráfica a objetos, por lo que, primero realicé un "módulo" el cual repliqué para rehacer las pantallas de la aventura en la clase principal, junto a los botones, estos modificando un contador (al igual que en el tp de la aventura gráfica) permitían que el usuario avance entre las pantallas.

Para adaptar el juego a la aventura gráfica, este mismo fue cargado al .pde en el que venía trabajando y posteriormente modificados ciertas rutas a las que acceden esas clases para poder articular el juego de manera correcta con la aventura. A su vez le agregé sonidos tanto a la aventrua en general cómo al juego, efectos al golpear y al ganar.

Desde comienzo de año venimos aprendiendo diferentes funciones y cómo aplicarlas de manera lógica, uno de mis favoritos es la de dibujar con lapiz y se puede hacer con muy pocas líneas de codigo:

Dibujar coqmo lapiz:

Utilizando el fondo estático (escrito en el setup) se sobre escriben los contenidos en la pantalla ya que no se actualiza constantemente lo que genera el efecto de que la linea sigue al mousee cuando es presionado

El código:

void setup (){ size(400,400); } void draw (){ } void mouseDragged() line(pmouseX,pmouseY,mouseX,mouseY); }

Hacer objetos resizeables

Realizar tanto objetos cómo programas en general con la capacidad de tener un tamaño adaptable es muy util ya que permite al programa amoldarse a cualquier tipo de pantalla, para lograrlo hay que escribir el código de manera tal que el contenido del programa se adapte al ancho y alto de la pantalla (size). Utilizando width y height (dividiendo o multiplicandolos) se consigue el tamaño al que equivale el contenido del programa, segun cuanto ocupe su size.

Hacer objetos relativos

A su vez la posibilidad de mover objetos que utilizan más de una función (por ejemplo, un auto hecho con funciones de circulos y cuadrados) deben ser realizados utilizando una variable cómo px o py, para que una vez esta variable se incremente todo el objeto se mueva en su conjunto, de lo contrario, este empezaría a deformarse. En base a este principio se realizó el tp2, donde debíamos realizar los créditos de una película utilizando el concepto de la imagen relativa.

Con la implementación de las variables booleanas pudimos desarrollar diversas mecánicas, tales cómo los rebotes. Utilizando un boolean y algunos ifs al detectar los límites de la pantalla se invierte el sentido en el que crece o decrece el movimiento de la esfera.