Presentation of final project

We continued reviewing student final projects, like this student's sound levels project.

The student built a sound intensity visualization tool, that lets a user analyze a sound stream for sound intensity violations according to local laws. One view shows potential violations in red, near violations in yellow, and well under threshold values in green:



Four different artists were chosen for four concerts (two indoors and two outdoors) that were on the more raucous end of the concert experience scale. Analysis is performed for each concert for five different frequency levels (each with its own decibel threshold).

The student created a second interactive view that let the user explore just those sound data records that were over threshold for the three frequencies most often resulting in potential violation:



The user experience is afforded through code that merges Processing.js with HTML5-compliant canvas-focused JavaScript, CSS, and HTML.

Data for all artists is provided in the following format for each timestamp provided in the sound recording:

[1,58.8705638648,54.8887197143,55.1112602135,60.177709697,58.9600719319],

A two-dimensional array creates a collection of the records with one record per second throughout the concert. The six data items per record contain (left to right):

Second ID, maximum 50Hz, maximum 63Hz, maximum 80Hz, maximum 100Hz, and maximum 125Hz

such that the highest value for each frequency of interest within each second of the concert is collected for visualization.

The browser-enabled application requires processing.js and jquery.js libraries in order to be able to run all the JavaScript code that comprises the user experience controller. Cascading Style Sheet use empowers the artist to make rapid changes to the coloring scheme and positional layout of components and communicates with the controller logic through use of ID attributes within each HTML element for which styling is enabled.

The student uses the IFRAME element in HTML code to seamlessly allow the user to change from all to exception only modes. Each mode has its own .PDE processing file that the processing.js library facilitates within the controller logic.

Much of the work performed between the workshop and this final version reinforced good design and artist iterative process facilitated by proper delegation of duties between model (HTML), view (CSS), and controller (JavaScript).