Module 2 Formstorming

Weekly Activity Template

Tzu Yu Hwa


Project 2


Module 2

This is all about noticing the little sounds we hear every day but don’t always pay attention to. From the click of a light switch to the pop of a soda can, each sound tells a small story of interaction.
I collected 25 different sounds from daily life to explore how they shape our experiences in subtle ways.

Activity 1

 The soft rustling noise of fingers flipping through pages. The knock knock sound of fingers or fists tapping on a door. The click sound when turning a light switch on or off. A crisp sound made by rubbing and flicking fingers together. The click-clack sound of fingers pressing keyboard keys.  The low humming sound of a microwave operating, or the ding when it's done.s The rushing water sound when flushing a toilet. The splashing noise of water flowing from a showerhead. The pattering noise of raindrops hitting surfaces like windows or the ground. The click sound when pressing a camera shutter button. The sharp sound of two hands slapping together.  The pssst-pop sound when pulling the tab of a soda can. The fizzy bubbling sound when opening or pouring a carbonated drink. The rhythmic sound of a knife cutting food on a chopping board. The snapping sound of a clip opening and closing. The rustling sound when shaking or pouring cereal from the box.  The metallic clinking sound of keys moving or being inserted into a lock. The strong suction and humming noise of a vacuum cleaner. The crinkling noise when handling or squeezing a plastic bag. The click and ignition sound when pressing and lighting a lighter. The clinking noise of glass bottles or cups touching. The soft rustling noise when pulling a tissue from the box. The steady tick-tock beat of a metronome swinging back and forth.  The loud whirring sound of a hairdryer blowing air. The sound of shoes or feet making contact with the floor while walking.

Activity 2

Flowing wave patterns mimic the motion of water flushing, creating a smooth, oscillating effect. Alternating curved lines shift position rhythmically, simulating the movement of footsteps. Layered wave-like shapes represent pages flipping, creating a dynamic turning effect.
      . Undulating waves capture the fizz and movement of a can opening, adding an organic feel.      Circular ripple effects expand outward, mimicking raindrops hitting a surface. Chaotic wavy lines represent the swirling motion of hot air from a hairdryer. Smooth organic curves reflect the bubbling effect of gas in water, adding a natural flow. Sharp, jagged waves burst out suddenly, visualizing the impact of clapping hands. Expanding and contracting layered shapes create the illusion of a door opening and closing. Flowing wavy lines move gently, mimicking the soft motion of pulling out a tissue. Repeating zigzag patterns create a sharp, slicing motion, emphasizing the act of cutting. Repetitive wavy motions mimic falling water, creating a sense of continuous flow. Flickering waves shift dynamically, symbolizing the quick ignition of a lighter. A shifting checkered pattern represents the rattling motion of cereal inside a box.
       Bold twisting lines flow dynamically, capturing the movement of hair accessories. A glowing effect that turns on and off, creating a flickering light effect.  Smooth curved lines moving sharply, mimicking the motion of a finger snap. Quick, random movements representing the shaking and jingling of keys. Wavy patterns shifting continuously, visualizing the low humming sound of a microwave.
      A circular waveform that reacts dynamically, creating a pulsing rhythm. Crinkly, scattered shapes shifting randomly, representing the rustling of plastic. Small dots and lines appearing in a rhythmic sequence, like pressing keyboard keys. Rapid wave-like motion giving the feeling of strong suction, representing a vacuum cleaner. Expanding and contracting geometric shapes imitating a camera shutter opening and closing. Bouncing shapes colliding with each other, visualizing the clinking of glasses in a toast.

Project 2


Final Project 2 Design

P5 Interactive Audio Web Header Portfolio

This project explores how sound can shape motion, using mic input to create a dynamic, breathing-like animation. By integrating sin() for smooth expansion and contraction, I aimed to make the visuals feel more organic and immersive.

Click here to see it working on my server

My project explores the rhythmic connection between sound and motion, transforming audio into a fluid, organic visual experience. Inspired by breathing, waves, and natural rhythms, it captures the ebb and flow of sound, allowing viewers to not just see but feel its presence. Through subtle expansion and contraction, the design creates a sense of calm, immersion, and harmony between auditory and visual perception.

×

Powered by w3.css