Module 2 Formstorming

Weekly Activity Template

Celine Heidie Hermanto

Project 2

Module 2

PLACEHOLDER TEXT, put a description here or you will lose grades

Activity 1

The sound of opening and closing the fridge door The sound of opening and closing the kitchen drawers The sound of the salt being shaked The sound of slippers waslking around The sound of using a knife slicing on a cutting board The atmosphere at the Marquee in Sheridan College in the Trafalgar Campus The sound of door opening and closing This is the sound of pincers This is the sound of me clicking a pen The sound of opening and closing a lipstick case The sound of dragging a chair out to sit on it The sound of my fingers tapping The sound of opening and closing a zipper The sound of mouse clicking The sound of my glasses case opening and closing The sound of the go train approaching The sound of the dryer on the tumble dry setting The sound of a tennis ball bouncing on the ground Sound of sweeping Sound of cards shuffling Sound of poker chips hitting the table Sound of cards being distributed when playing card games Sound of water gushing Sound of book flipping The sound of pouring out rice

Activity 2

The audio spectrum wave was created by watching a youtube tutorial https://www.youtube.com/watch?v=8vdBrWE9V2I, through it I learned how to use FFT to extract the amplitude and shape the effect, in this case using a sin function to create this looping shape. This is what the wave looks like normally when the sound isn't being played This is what the wave looks like when the music has a strong base, experimented with the epiphany music file. Further experimentation by taking out all the colors in the wave, creating a dark black outline that resembles a cloud Also discovered a way to lower the opacity by lowering certain parameters. By manipulating the opacity and the vibrancy of the wave I was able to create a softer version of the wave. By increating the value of the wave I was able to create a lighter pastel look, leading to potential for more modern or minimalist graphics. By manipulating the values of the color spectrum I was able to limit the wavelength the code picked up and create this interesting neon effect. Again, by manipulating the light and the opacity of the wave I was able to soften the earlier iteration. Manipulating the wavelength values again allowed me to limit the colour range to largely 3 colours. Experimenting by changing the colors in the provided Experimenting with FFT again making sure the amplitude values are captured in the console Creating a sound visualzer similar to voice-memos, based on this youtube video: https://www.youtube.com/watch?v=8O5aCwdopLo&t=708s Created a graph based on the time domain of the sound, using the epiphany music file given What the time domain graph looks like when drums or base/larger pitch is detected. Adding a frequency domain graph based on the youtube video, one change I made was by adding a button based on the previous code provided to make experimentation clearer, additionally I discovered my browser wouldn't play sounds outimatically without the button/changing values in the code so this was a workaround. THis is what the frequency domain graph looks like when the freqyency is higher and the music is more turbulent. Experimenting by changing the position of the frequency domain graph. Experimenting with these graphics and layering the made me realize I could create interesting patterns by creating a gric and only activating certain cells as they synthesize and reach to the sounds. U added another layer to fill the grid and make the pattern more visible I attempted to input a song with a stronger base to trigger larger amplitudes and it creates an almost swirling effect. I attempted to activate cells to make a C shape for my initials I once again experimented with different sound effects to trigger different shapes. I made sure the cells would resize when you adjust browser width instead of move to the next line to preserve the intended design despite the rectangle grids. Creatng my initials by triggering more cells, my next idea is to make the cross diagonal as the design is starting to remind me of cros-stiching and has the potential to create an interesting header image.

Project 2

Final Project 2 Design

P5 Interactive Audio Web Header Portfolio

PLACEHOLDER TEXT, put a description here or you will lose grades

Click here to see it working on my server

test2Lorem ipsum dolor sit amet, consectetur adipiscing elit

×

Powered by w3.css