Module 2 Formstorming

Weekly Activity Template

Arrththi Thavabalanathan

Project 2

Module 2

Fielding 25 noises from Sheridan and other public places and contextualizing and documenting their sounds.

Activity 1

Water sounds from the washroom sink wood from the Bookstore Soda from the vending machine being opened The sounds from the crowded Tim Hortons area around 1pm Learning Commons on a thursday Dropping Items The low audio input from the TV in the Sheridan Wing, it promotes news from the basketball team Ambient noises from the Air Conditioning in B wing Air Conditioning from AA Wing a singular student walking Walking fast, feels very chaotic An audio of me playing league of legends People Conversing in the Hallway walking outside, people with coats on, seasonal audio 3D printer working on a users project Door being opened agressively, feels very scary Tim Hortons Worker calling out an order playing around with merchandise in the bookstore E wing ambient noises A printer in service Ambient noises in an Art Gallery, peope associate silence with Art Bell Phone booth, very clicky very old fashioned Water Bottle in contact with the snow, makes a very airy metal noise House keys dangling making noises per step or movement Ambient car ride, very quiet can hear the engines going

Activity 2 some images have a video

This is a picture of me playing with Tutorial one codes. I used my audio instead of the audio in the files. A working example of the tutorial using my audio from tutorial one, specifically the Water Audio. Coding example using the audios that I made. All of these took some time to work, as I did not understand the code at hand. This also made it pitch higher or lower A Visual reference of seeing my audio working. I made it more visually appealing with working sliders from the examples. Ude See Below <br> <video width='100%' controls> <source src='images/Activity2/picture5.mp4' type='video/mp4'> Your browser does not support the video tag. </video> altering the art gallery video using the steps audio example.Used some ChatGpt help to ensure smoothness. See below. <br> <video width='100%' controls> <source src='images/Activity2/picture6.mp4' type='video/mp4'> Your browser does not support the video tag. </video> Audio Visualizer with better graphics. Using the previous codes and tweaking it with a bit of css and js from prior coding experience. See below <br> <video width='100%' controls> <source src='images/Activity2/video7.mp4' type='video/mp4'> Your browser does not support the video tag. </video> This example takes my voice and turns it into an visualzing experience. See below Audio is very low. <br> <video width='100%' controls> <source src='images/Activity2/video8.mp4' type='video/mp4'> Your browser does not support the video tag. </video> A different visulizer, tweaking the previous code to draw some blobs on the screen. Two different colour for two different sequence. See Below <br> <video width='100%' controls> <source src='images/Activity2/video9.mp4' type='video/mp4'> Your browser does not support the video tag. </video> Another visulizer, this time when I peak in my volume it radiates a bigger circle This is an text to speech visulizer. I made it pink and it will say my name. See below <br> <video width='100%' controls> <source src='images/Activity2/video11.mp4' type='video/mp4'> Your browser does not support the video tag. </video> another visual, this one is more wonky as it doesn't work with the text to speech voice well. see below <br> <video width='100%' controls> <source src='images/Activity2/video12.mp4' type='video/mp4'> Your browser does not support the video tag. </video> This is me trying out my voice to see if it works. After setting up the correct microphone it started working. Made a better visualizer of my voice. It works very well and showcases my design skill with the text. This is me trying out the example where the colour changes the background based on the colour name in the css. I made an small array of words toUpperCase where it will display the colour based on the vegetable! See below. <br> <video width='100%' controls> <source src='images/Activity2/vegetables.mp4' type='video/mp4'> Your browser does not support the video tag. </video> This is the example of the square that moves in the direction in which the person is saying. I made it so it has a glowy moving effect without tracing. Using the Learning model to understand my voice the code working correctly to the sound of my voice the code working correctly to the sound of my voice after reiterating the same learning model. First one was barely working This learning model now takes my voice to play my audio, however the learning model is like tweaking out a bit for no reason due to the background. See below <br> <video width='100%' controls> <source src='images/Activity2/audiobasedoncommand.mp4' type='video/mp4'> Your browser does not support the video tag. </video> A better visualizer based on previous css js coding I exlpore multiple different ways to visualize touch designer. https://youtu.be/ATLhkFcQZN0?si=cDBCCeGFjcuXxsyT Another visualizer I created with a youtube tutorial https://www.youtube.com/watch?v=LDUwIHXTX8Y&t=9s Another audio reactive visualizer from youtube https://www.youtube.com/watch?v=Mt2hwb5cngA&t=983s

Project 2

Final Project 2 Design

P5 Interactive Audio using TouchDesigner

In this final design, I decided to use TouchDesigner to create an interactive audio visual. I have done both audio visual with some same audio from activity one and I also made it as well with voice activation.


the render of my visual design in TouchDesigner.

Video below



×

Powered by w3.css