Module 2 Formstorming

Weekly Activity Template

Darian Tan - MMB Project 2


Project 2


Module 2

Here is my Project 2 Activity Images

Activity 1

Someone Picking up a backpack. Unlocking or Locking Door. Starting up a car engine. Plugging in a phone. The noise of a crowd of people. Using an Eraser on a notebook. Mouse button clicks. Getting up off a chair/surface. Noise of an electronic device. Moving an office chair to get comfy. Opening A Door. Plugging in a Phone Charger. Someone placing down an object onto a surface. Someone zipping up a jacket. School supplies rattling around. Using the scroll wheel on a mouse. Sharpening a pencil. Sounds on the freeway. Turning a page over in a notebook. Turning the faucet on. Typing on a keyboard. Walking. Writing inside a notebook. Closing a bag. Zipping up a jacket.

Activity 2

Manipulation of the oval shape and change of colour to dark blue and standard blue for the background. Columns take a static position yet still play music in the background. Dark purple lines shoot up according to the audio playing. Audio visual lines have a longer duration when sound is played. Audio lines appear wider in width. Audio lines apear as a medium width with a long duration. Main lines appear large in width with the lower sound lines are dark purple. Upon sound being played the lines appear in an upward graph when played. When audio is played the slider under the start button controls the volume of the audio. Similar to gif 9 it displays a red background when played. Audio plays when clicking start button and the sliders change the volume and speed of the sound. Similar to the sliders, the slim circles control the speed and volume of sound tied to the user mouse movements. Modified the sizes of the circles yet still operate the same and the background colour as a yellow green colour. Light green colour background and operates similar to gif 13 and 12. Circles that modify the sound have been enlarged to a great amount and are able to cross over each other when mouse is moved correctly. Sliding the mouse left to right increases the size of the circle and changes the row of lines. With a blue background a random array of colour squares appear and flash on the screen in a quick succession. Upon start, firework like colours appear and travel randomly and upon user clicking a group of fireworks appear when they clicked. When clicking the middle of the screen it shoots fireworks out according to their colours. When randomly clicking on the screen, differnt sized squares appear and then slowly disapear while moving towards the center of the screen. Random small circles appear on screen and move freely. Upon a short wait the screen freezes and it displays a message of 'Reality Fractured'. Different flashing coloured circles are shaking fast. Upon clicking a circle appears. When clicking in the same area of the circles, others appear and become smaller than the ones before. Clicking on the screen, different squares appear in unique palettes and orientations. A quick colour changing circle improves its size automatically. Upon start, if user clicks another window rapidly opens and when done enough the code/screen freezes automatically stating: 'Universal Collapse, System Overload.'

Project 2


Final Project 2 Design

P5 Interactive Audio Web Header Portfolio

Here is my Final Design that implements concepts used from the Week 7 Tutorial Videos like Sound Speech to Text from Tutorial 5 and Chatbot but instead of an AI talking back to me it responds through the display of animated text and P5 sketches.

Click here to see it working on my server



×

Powered by w3.css