La idea principal del proyecto es deconstruir una imagen mediante círculos que tendrán los mismos colores de los pixeles de la imagen, cada píxel explota en un círculo de 15 x 15 píxeles y se van sumando aleatoriamente en el área de trabajo, en conjunto con la generación de sonidos interactivos.
En este caso, usaremos una fotografía de las Catedrales de Mármol, un Santuario de la Naturaleza ubicado a las orillas del Lago General Carrera en la región de Aysén, elegí esta imagen ya que es un lugar al que quiero en el futuro.
A medida que el usuario mueve el mouse, se produce un sonido “Marrón” o “Brown” que varía según la dirección en la que se desplaza por la imagen. Cuando se desplaza hacia arriba, se crea un sonido fuerte que refleja el ruido del viento, y cuando se va acercando al agua, se produce un sonido bajo o nulo que representa lo que se escucha bajo del mar, en conjunto al movimiento del mouse también se crea una “estela” de círculos con distintos colores de los píxeles de la misma imagen. Cuando el mouse permanece quieto, se reproduce mediante cualquier tecla del teclado un relajante sonido de mar, entregando una experiencia que combina visualización y sonido.
-Referencias de dónde me inspiré para hacer el proyecto:
-Investigación en librerías de sonido de processing https://processing.org/reference/libraries/sound/index.html
-Investigación de imagenes y como tratarlas en https://processing.org/reference/image_.html
-Referencia de efecto principal de círculos en la imagen sacada de “Happy coding” efecto “Setting Pixels”. https://happycoding.io/tutorials/processing/images
-Referencia de como agregar sonido https://www.youtube.com/watch?v=_4FLlS9TzZw
Dato para que se puedan almacenar y cargar las imágenes en processing.
//Librería de sonido de processing. Esto es para que funcione cargar un sonido en el proyecto.
Objeto de la librería que se llamará “sonido” (se puede poner cualquier nombre, es sólo para identificarlo más adelante).
Ruido “Marrón llamado “noise”, el ruido marrón se puede sacar de la biblioteca de processing de: Ejemplos en Java de processing: Sound- Noise-Brown https://processing.org/reference/libraries/sound/BrownNoise.html
Área de trabajo de 1000 x 600 píxeles. El área de trabajo es del tamaño de la imagen de Catedrales de Mármol.
Cargué una imagen a processing de Catedrales de Mármol. La imagen es sacada de internet proveniente de una página de servicios de tour al sur de Chile, esta imagen es llamada “marmol.jpg”. https://www.servituroffi.com/producto/capilla-de-marmol/
La imagen se encuentra en medio del área de trabajo, permite que todos los círculos que estan encima de la imagen se sumen mientras pasa el tiempo. La imagen en 0, 0 (image, 0, 0, width, height) es para ajustarla en el medio del área de trabajo.
Objeto que se llama “sonido” es igual a SoundFile que permite cargar el sonido “ocean.mp3”. El sonido fue descargado de una página de internet. : https://pixabay.com/es/sound-effects/search/mar/
Biblioteca que se encuentra en processing que permite la reproducción de ruido marrón.
Color c es para obtener el color de la posición donde se encuentre el mouse.
Relleno (color) del círculo 30 x 30 que sigue al mouse. La (c) es para que el círculo se rellene con el color de cada pixel que toca.
Dibujar un círculo, mide 30 x 30 píxeles. Este círculo deja una “estela” de círculos por toda la imagen por donde pasa el mouse. Esta función hace que se pueda dibujar con los círculos.
Variable de número donde “x” es la parte del ancho de la imagen, la “y” es la altura de la imagen y es para que funcione color más adelante.
Color del trazo de los círculos que apareceran de uno a uno de 15 x 15 píxeles. Stroke es el trazo, NoStroke significa que el círculo no tiene trazo alrededor.
Color del círculo de 15 x 15 que aparecen aleatoriamente en la imagen, los círculos van explotando cada vez que pasan por un color de píxel de la imagen.
Círculo que aparecen y se suman en la pantalla de porte 15 x 15 píxeles.
Se asigna el ancho del sonido que va desde izquierda a derecha MouseX de 1 a 1.0. Cuando la flecha se va a la derecha tiene una frecuencia de 1 y cuando se va a la derecha tiene una frecuencia de 1, 1.0. Es un sonido muy similar. Referencia biblioteca de processing: https://processing.org/reference/libraries/sound/BrownNoise.html
Se asigna la amplitud del sonido. MouseY de 1 a 0 para amplitud. Cuando la flecha del mouse va hacia arriba en la imagen, en las rocas de marmol se puede escuchar un ruido mucho más fuerte reflejando al viento y cuando la flecha va hacia abajo cerca del mar no se escucha ni un sonido reflejando lo que se escuha abajo del mar. Referencia biblioteca de processing: https://processing.org/reference/libraries/sound/BrownNoise.html
KeyPressed permite presionar una tecla aleotoria para reproducir un sonido, en este caso sonido “ocean.mp3”. Sonido.loop es para que sonido = ocean.mp3 suene en loop. Al apretar cuanlquier tecla se reproduce “ocean.mp3” un sonido del mar relajante sacado de internet. https://pixabay.com/es/sound-effects/search/mar/