Module 3 Formstorming

Weekly Activity Template

Quang Minh Vo


Project 3


Module 3

Module 3 focuses on creating an integrated interactive system using a 5-button Makey Makey device and P5.js sketches to explore sound and hearing. The goal is to prototype and test different interactions, emphasizing the seamless connection between physical input and digital output.

Activity 1

Concept 1 is an interactive emotion visualizer that uses keyboard inputs to express five different moods: Anger, Calm, Sadness, Happiness, and Surprise through animated shapes, colors, and motion in a P5.js sketch. Concept 2 is an expressive mood painting tool that lets users draw across the canvas with different shapes and colors representing five moods: Anger, Calm, Sadness, Happiness, and Surprise using keyboard inputs in a P5.js environment. Concept 3 is a mood bubble generator that visualizes emotions like Anger, Calm, Sadness, Happiness, and Surprise as animated, color-coded bubbles with unique motion behaviors based on keyboard input in a P5.js environment. Concept 4 is a fading echo visualizer that generates expanding and disappearing shapes in response to five moods—Anger, Calm, Sadness, Happiness, and Surprise—using unique motion, color, and fading effects triggered by keyboard input in a P5.js environment. Concept 5 is a mood tracking bar chart that visually increases the height of colored bars representing Anger, Calm, Sadness, Happiness, and Surprise each time their corresponding keyboard input is pressed in a P5.js environment Concept 6 is a fading memory visualizer that lets users leave colorful shapes, each linked to a specific key input, floating and slowly disappearing on the canvas to symbolize passing emotions or moments in a P5.js environment. Concept 7 is a mood maze where users navigate a circle through obstacles toward a goal while triggering mood-based color changes in different zones using keyboard input. Concept 8 is a reactive mood trail where users move a circle across the canvas and trigger expanding emotional bursts in different shapes and colors based on keyboard input. Concept 9 is a mood-catching game where users control a circle to collect falling emotion orbs, each changing the character’s color and displayed mood based on the type of shape caught. Concept 10 is an emotion collecting game where users move a basket to catch falling mood balls that change its color and update the score and current mood. Concept 11 is a 3D shape spinner that lets users interactively rotate, recolor, and switch between geometric forms using keyboard controls. Concept 12 is an interactive 3D shape spinner enhanced with ambient sound and a color-shifting background where users can rotate, recolor, and change shapes while triggering different tones using keyboard and mouse input. Concept 13 is a harmonic sculptor that blends rotating 3D shapes, ghost trails, ambient pink noise, and shape scaling to create a meditative visual and auditory experience controlled by keyboard and mouse input. Concept 14 is a harmonic sculptor that lets users interact with floating 3D shapes surrounded by ghost trails and ambient pink noise, using keyboard and mouse input to control form, color, size, and movemen. Concept 15 is a shape synthesizer that lets users drop rotating 3D shapes into space with soft ambient tones, using keyboard and mouse input. Concept 16 is an interactive sound bloom where users trigger soft musical notes and colorful growing blooms from the center of the screen using keyboard input, enhanced by ambient delay and reverb effects in a P5.js environment. Concept 17 is a symphonic garden where users generate orbiting, glowing blooms and ambient musical tones using keyboard input. Concept 18 is a celestial orchestra where users create orbiting musical blooms that emit ambient tones with volume based on distance. Concept 19 is a sound river where musical blooms drift across the screen and play soft ambient tones, with users able to trigger them manually or enable auto mode to create a flowing, ever-changing audio-visual stream. Concept 20 is an echo river where floating sound blooms ripple across the screen with gentle motion and ambient tones. Concept 21 is a color tone grid where users press keys to trigger glowing pads that play soft musical notes. Concept 22 is an ambient orb field where users spawn floating sound orbs using keyboard input and trigger musical notes by hovering or clicking. Concept 23 is a sonic reactor where users trigger animated 3D shapes and ambient tones through keyboard input. Concept 24 is a visual portal that transforms into different animated states such as ripples, spirals, rays, blooms, and pulses based on keyboard input. Concept 25 is a string garden where vertical lines sway and animate in various wave-like patterns.

Activity 2

Set up Makey Makey with laptop to connect with P5.JS Using left to connect to Earth on Makey Makey control panel Testing out the interaction and visual feedback Developing concept and trying new things with P5.JS Developing concept and trying new things with P5.JS Trying new concept and movement with geometric shapes Trying new concept and movement with geometric shapes Trying new concept and movement with geometric shapes Trying new concept and movement with geometric shapess Trying new concept and movement with geometric shapes Trying new concept and movement with smiley faces Trying new concept and movement with smiley faces Trying new concept and movement with smiley faces Trying new concept and movement with smiley faces Trying new concept and movement with smiley faces Trying new concept and movement with Slime molds from Pat Virra Trying new concept and movement with Slime molds from Pat Virra Trying new concept and movement with Slime molds from Pat Virra Trying new concept and movement with Slime molds from Pat Virra Trying new concept and movement with Slime molds from Pat Virra Trying new concept and movement with bubbles Trying new concept and movement with bubbles Trying new concept and movement with bubbles Trying new concept and movement with bubbless Trying new concept and movement with bubbles

Project 3


Final Project 3 Design

My creation of Hypnotic Flowers is an interactive experience that turns physical touch into digital sound and visuals. Using the Makey Makey and P5.js, I created a system where each touch plays a note from the Major Pentatonic scale and generates a unique flower on screen. The visuals respond to the audio in real time. Each flower rotates, pulses, and fades with sound amplitude, while soft particles scatter around them. Over time, the screen becomes filled with colorful, layered patterns that feel alive and expressive.

The goal of this project was to explore how touch can be used not just as a control input but as a meaningful and creative interaction. I was inspired by the idea that touch carries emotion and intent. Concepts from our class, like active touch and prehension, helped me think about the body not just reacting but anticipating and shaping an experience. I wanted each touch to feel like planting a seed and watching it bloom into something beautiful and unexpected.

This project involved a lot of experimentation. I tested different petal shapes, sound effects, colors, and timing to find a balance between randomness and structure. Some iterations were messy or did not work well. What I ended up with is something that feels calming, joyful, and reactive to the user’s presence.

Hypnotic Flowers is an interactive experience that turns physical touch into digital sound and visuals.
×

Powered by w3.css