ResoFlow is an interactive p5.js project that uses body motion capture and sound synthesis to shape a responsive audiovisual environment. PoseNet tracks the body in real time, mapping limb positions to changes in frequency, pitch, and volume. Movement also drives a Perlin noise flow field and a rainbow color system that shifts the user’s silhouette from red toward magenta as they move across the canvas. The goal was to use the body as the controller and create the feeling of bending a digital space around yourself.
Photobooth
This photobooth combines Processing and Arduino to create a physical digital imaging experience. A button snaps photos, and a potentiometer lets users scroll through live filters like black and white, invert, blur, and threshold. Captured images are arranged into a printable photo strip. It strengthened my understanding of physical computing, real-time image processing, and designing intuitive hardware–software interaction. (Watch the video)
SiMUSTREAM
SiMUStream is a p5.js livestream simulation inspired by NPC streamers and audience-driven performance. Using PoseNet, the program checks whether users complete gestures requested by an auto-generated chat, and their accuracy influences the simulated viewer count, likes, and comments in real time. Motion capture, generative text, and simple UI components come together to explore online presence and the pressure to perform for an audience.
EcoGauge
EcoGauge is a p5.js tool that visualizes the environmental footprint of AI prompts. It analyzes token length and model size to estimate energy consumption, compute load, and CO₂ output. The interface presents this information clearly to encourage more mindful use of AI systems. Building it improved my skills in data modeling, interface clarity, and simplifying complex information into an accessible format.
Audio Visualizer
This p5.js visualizer transforms microphone input into dynamic motion and color. The program uses live mic levels to drive a twisting gradient background, an expanding central circle, and a set of bouncing circles whose speed adjusts with volume. Each element reacts to audio input through mapped values that control size, movement, and color intensity. It became an exploration of how simple shapes and motion logic can create an immersive, sound-responsive environment.
Salon 27
Salon 27 is a p5.js drawing tool that lets users paint freely using a color palette, adjustable brush sizes, and simple UI controls. The program includes a side panel of selectable colors, an eraser tool, and keyboard shortcuts for changing brush thickness. Drawing only occurs on the right side of the canvas, and users can save or clear their artwork through built-in buttons.
Kalliergo
Kalliergó is a p5.js arcade game where two players race to collect falling carrots and grow the largest total. The game uses classes for rabbits and carrots, collision detection to register scores, keyboard input for player movement, and a sixty second timer controlled by different game states. Sound cues alert players during the final seconds and when time expires. The combination of sprite animation, scoring logic, and responsive controls helped me understand game loops, timing, and feedback-driven design.
Frogger
This is a p5.js recreation of the classic Frogger game. Players move across lanes of moving obstacles and try to reach the safe zone without colliding. Rebuilding the game from scratch helped me understand object behavior, timing loops, and clean interactive structure. It was a simple but effective way to practice real-time gameplay logic.