A digital circuit diagram showing an Arduino Uno connected to a breadboard via multiple jumper wires. The breadboard includes four push buttons and four red LEDs, each wired with resistors. Orange wires connect the digital pins (5–13) on the Arduino to the LEDs and buttons, while black and red wires connect to ground and power rails. This setup represents a basic input/output system used for prototyping a stem player interface.

Building a Custom Stem Player with Arduino & p5.js

April 2023
Arduinop5.jsCreative ComputingPhysical ComputingInteractive Design

The project combined Arduino, Johnny-Five, and p5.js, using Firmata to communicate between the hardware and browser-based software.

For my final-year creative computing project, I built a fully functional stem player—a hardware interface that lets users control the volume of different audio stems (vocals, bass, drums, etc.) in real time using physical buttons and reactive LEDs.

The project combined Arduino, Johnny-Five, and p5.js, using Firmata to communicate between the hardware and browser-based software. Each button toggles a track's volume and controls a corresponding LED, which reacts to the music’s amplitude with variable brightness.

The final prototype, built with durable dome buttons and a custom perspex housing, was showcased at our degree show as an interactive installation.

Read Full Strory