How to Read This Web Thesis

Rationale

This thesis has been created as an interactive web page, containing elements that allow one to directly engage with audio, video and other forms of media while reading the text. I reasoned that this format would be the optimal way to discuss my work, and to unite the various aspects of my practice within a single document. This includes code, interactive demos of technological and compositional processes, as well as traditional audio and video playback. Hohman et al. (2020) served as a significant source of inspiration in my vision for structuring and implementing this format.

I hope that in addition to the contribution to knowledge that this thesis makes, it might serve as a model for others who desire to make their own interactive documents and presentations of research.

The source code for this thesis is hosted at GitHub: https://github.com/jamesb93/harnessing

Compatibility

This thesis supports a number of web browsers. It has been tested on:

• Firefox +88.0
• Safari +14.1
• Chromium Browser +90 (and thus should support Chrome, Edge, Vivaldi, Brave etc…)

If for any reason something is not working or fails to load, please first try viewing the thesis in another type of browser.

Navigation

This thesis is divided into six sections. To navigate to sections of this thesis, use the left-hand navigation panel. The right-hand navigation panel allows one to move between parts of a single section more conveniently. If the window of the browser is too small to display these two navigation panels, they will be hidden to preserve the presentation of the text. In this situation, the navigation on the left side can be expanded by clicking the “hamburger” menu in the top left corner.

Interactive Elements in This Thesis

There are many interactive elements throughout this thesis, such as annotated waveforms, code, videos, images and demos. There are also numerous hyperlinks that link to different parts of the thesis as well as external websites and pages. These hyperlinks also function as tools for navigation, allowing one to move directly to the relevant interactive elements within this thesis. For example, clicking IMAGE 1 will shift the focus of the window to that element. I encourage the reader to follow these links to see how these integral digital resources feed into my work and support the research. Five archetypes of interactive elements will now be introduced.

Waveform or Album

This is the waveform widget. It shows a single sound file with an overview and zoom waveform view. One can zoom in by clicking the +/- buttons and stop and start the audio with the audio element beneath the waveform. One can also scrub through the sound file with a click and drag manoeuvre on any of these two views. Some waveform widgets widgets also are annotated, in which case, a list of these will be displayed below the waveform views in a table. One can click the appropriate annotation to seek directly to that time in the audio file.

All audio samples in this document are in a compressed format in order to make the document fast and usable over the web. However, links to lossless WAV files can be found embedded into the audio playback widgets. Look for the Download Lossless Version text to navigate to these links. This can be found on the bottom left-hand corner of the waveform widget, and in the list of individual album items in the album widget.

There is also the album widget, which groups together various files. One can select different files from the album by clicking them in the list and then clicking “Play”.

Image

This is the image widget. It displays images. They can be maximised if they are too small by clicking the image. This will load the raw file in the browser.

IMAGE 1: A visual depiction of the interconnected Fourses oscillators. Though the picture is unlabelled it depicts the boundaries of each Fourse oscillator "ricocheting" off another Fourse. Taken from http://www.ciat-lonbarde.net/fyrall/paperz/fourses/index.html.

Video

The video widget is used to play videos. Click the video to start playback.

Code

The code widget displays examples of code in a collapsible text box. One can collapse the text by clicking anywhere in the title bar of the widget.

thing_i_do = 'computer-aided composition'
qualifier = 'is the best'
print(thing_i_do, ' ', qualifier)
>> computer-aided composition is the best

In this text, code is referred to inline using this widget, and if it is a part of the software outputs a relative path from the root of the submitted materials will be provided. One can click the link to directly observe the code hosted on GitHub or read the path to find it in a local copy. For example, /Projects/Reconstruction Error/Supporting Code/python_scripts/scraping/scrape_files.py refers to the script named scrape_files.py, which can be found in the [4.4 Reconstruction Error] directory, which is inside the “pieces” top-level directory.

Demo

There are several demos throughout this thesis. Each one of these is interactive in its own way and offers its own kind of interface. For example, DEMO 1 below is interacted with through a slider type control, in order to update what is presented.