I expanded my film RAIN and made an interactive device for the audience to play with, providing them an artsy and relaxing experience of the inner emotions behind the film. The power of rain that lightens up a girl’s almost-depressing life and awakens her musical dream and inspirations. So the rain, lights and music are an essential part of the idea - they are representing one another. Rain brings her light and light generates music. My goal is to use a potentiometer and a button to interact with my coded visuals (ocean, rain, stars, day and night) in p5.js. At the same time, I included LED lights and music sounds with close interconnection to enhance the experience.


The Usage of Breadboard and Arduino
- Potentiometer (knob): Lights up the LEDs one by one, plus the transition between day and night. When users turn it, music plays.
- Button: lights up all LEDs, triggers the raindrops and the sound of rain.
- Arduino code: potentiometer and button as 2 inputs and the LED lights as outputs.



Analog (potentiometer) input and LED outputs code in Arduino


Digital (button) input and LED outputs code in Arduino
Prototyping Progress #1: getting Arduino breadboard part done
Afterwards, I coded the animation of ocean waves, stars, rain, day & night - using mouse as the input first. And then I replaced "mouse move" & "mouse click" with Arduino inputs (potentiometer and button). All animation & interactivity was done in p5.js


Animation and Arduino connection code in p5.js
Prototyping Progress #2: connection successful; visuals complete, need to add audios next
Final Prototype
Changed all LEDs to blue lights, added audio interactions (music & rain sounds), and gave my breadboard a housing: a boat!
Thoughts:
1. better experience if displayed on a bigger screen
2. make the knob and button bigger for easier use