En este video, presento un breve tutorial de cinco minutos sobre mi aplicación VJ, desarrollada como parte de una práctica para [nombre de la asignatura]. Durante el tutorial, exploro las funcionalidades clave de la aplicación y explico cómo aprovecharla al máximo. Además, inicio con una breve introducción que detalla el contexto del proyecto, incluyendo el nombre de la asignatura y mi participación.

Para simplificar la integración de la cámara web, he implementado una funcionalidad especial que permite mostrar únicamente la webcam y las escenas de OBS de manera eficiente. La aplicación VJ ya incluye una captura de la cámara web en su interfaz, por lo que decidí no añadir una miniatura adicional para evitar sobrecargar el diseño.

Este proyecto combina creatividad y ofrece una herramienta curiosa para entornos audiovisuales. Espero que disfruten del recorrido y la explicación.

En este videotutorial en directo, enseño la aplicación interactiva de videjockey que hemos desarrollado a lo largo del curso utilizando p5.js y su biblioteca p5.sound. Se trata de una herramienta de interfaz bastante sencilla compuesta por música y vídeo con los que se puede interactuar ofreciendo una experiencia personalizable para cualquier usuario.
Cuenta con unos controles muy intuitivos con los que se podrá ajustar el volumen, la velocidad y la panorámica de la canción que se esté reproduciendo en la aplicación. Otras funciones con las que nos podemos encontrar son la aplicación de efectos de sonido tales como filtros de frecuencia, resonancia y delay.
Además, de los efectos de sonido mencionados, también se pueden aplicar algunos efectos al vídeo reproducido como la inversión de colores, la binarización, la erosión o la posterización. También es posible alternar entre la captura de pantalla de nuestra webcam y un vídeo precargado de nuestro ordenador, así como girar la imagen hacia un lado u otro, sin olvidarnos de mencionar que la imagen del vídeo se ampliará o reducirá en función de la amplitud del sonido de la música.
Desarrollar esta aplicación de videojockey me ha permitido investigar los principios del diseño multimedia, aplicando de este modo tanto conocimientos técnicos como creativos para poder ofrecer un producto funcional y divertido.
Os invito a que veáis el siguiente videotutorial para que os hagáis una idea más clara de en qué consiste la aplicación de VJ.
¡Espero que os guste!

A continuación muestro un video tutorial de una aplicación de videojockey desarrollada en un navegador web utilizando p5.js y su biblioteca p5.sound. La aplicación permite alternar entre la webcam y un vídeo generado por IA presionando la tecla «W». Además, se pueden aplicar transformaciones visuales al vídeo pulsando algunas teclas, como negativo (tecla «1»), binarización (tecla «2»), erosión (tecla «3»), posterización (tecla «4»), detección de contornos (tecla «D») y rotación (teclas «A» y «S»).

La interfaz incluye botones para controlar una canción generada con IA y saltar a posiciones aleatorias en la reproducción. El tamaño del vídeo varía dinámicamente en función de la amplitud del audio, y en un rectángulo inferior se visualiza el espectro de frecuencias del sonido. Varios sliders permiten modificar parámetros como volumen, velocidad y panorámica.

El programa cambia automáticamente los colores de fondo, espectro y un rectángulo inferior cada 15 segundos. En el código, se destacan las funciones preload (carga de recursos), setup (configuración inicial), y draw (bucle principal). Los filtros y transformaciones se aplican en tiempo real, incluyendo detección de contornos mediante una convolución de píxeles.

Comparto con vosotros mi práctica de creación de una aplicación VJ (videojockey) en javascript mediante la biblioteca P5.js.

La aplicación combina la inserción de un audio, generado por inteligencia artificial, al que podemos aplicar filtros y manejar los parámetros mediante distintos sliders, con dos videos que pueden conmutarse: la captura de la webcam y un vídeo también generado por una plataforma de IA que hemos almacenado en nuestro disco duro.

Los sliders de control permiten modificar en el audio los valores de volumen, velocidad, la panorámica, de la frecuencia de corte y resonancia del filtro de paso bajo, de la distorsión y de la reverberación.

Con respecto al vídeo, su tamaño se modifica tomando como referencia la amplitud del audio y podemos variar su ángulo de rotación, en sentido horario y contrahorario, mediante las teclas «a» y «s», respectivamente . Por otra parte, es posible conmutar los vídeos mencionados pulsando la tecla «5». Además, permite la aplicación de filtros de imagen que se aplican mientras se mantienen pulsadas algunas teclas: desde la tecla «1» hasta la «4» aplica los filtros de inversión, binarización, erosión, y posterización. Mientras se mantiene pulsada la tecla «d» se detectarán los bordes del vídeo,

Videotutorial de la aplicación de Proyecto 2. Media.