annotate docs/Instructions/Instructions.tex @ 1088:3705f68a38b7

The version I use and works, addresses issues #1622, #1616, partially #1620
author Giulio Moro <giuliomoro@yahoo.it>
date Mon, 22 Feb 2016 04:17:19 +0000
parents
children c0022a09c4f6
rev   line source
giuliomoro@1088 1 \documentclass[11pt, oneside]{article} % use "amsart" instead of "article" for AMSLaTeX format
giuliomoro@1088 2 \usepackage{geometry} % See geometry.pdf to learn the layout options. There are lots.
giuliomoro@1088 3 \geometry{letterpaper} % ... or a4paper or a5paper or ...
giuliomoro@1088 4 %\geometry{landscape} % Activate for rotated page geometry
giuliomoro@1088 5 \usepackage[parfill]{parskip} % Activate to begin paragraphs with an empty line rather than an indent
giuliomoro@1088 6 \usepackage{graphicx} % Use pdf, png, jpg, or eps§ with pdflatex; use eps in DVI mode
giuliomoro@1088 7 % TeX will automatically convert eps --> pdf in pdflatex
giuliomoro@1088 8
giuliomoro@1088 9 \usepackage{listings} % Source code
giuliomoro@1088 10 \usepackage{xcolor} % colour (source code for instance)
giuliomoro@1088 11 \definecolor{grey}{rgb}{0.1,0.1,0.1}
giuliomoro@1088 12 \definecolor{darkblue}{rgb}{0.0,0.0,0.6}
giuliomoro@1088 13 \definecolor{cyan}{rgb}{0.0,0.6,0.6}
giuliomoro@1088 14
giuliomoro@1088 15 \usepackage{amssymb}
giuliomoro@1088 16 \usepackage{cite}
giuliomoro@1088 17 \usepackage{hyperref} % Hyperlinks
giuliomoro@1088 18 \usepackage[nottoc,numbib]{tocbibind} % 'References' in TOC
giuliomoro@1088 19
giuliomoro@1088 20 \graphicspath{{img/}} % Relative path where the images are stored.
giuliomoro@1088 21
giuliomoro@1088 22 \title{Instructions for \\ Web Audio Evaluation Tool}
giuliomoro@1088 23 \author{Nicholas Jillings, Brecht De Man and David Moffat}
giuliomoro@1088 24 \date{7 December 2015} % Activate to display a given date or no date
giuliomoro@1088 25
giuliomoro@1088 26 \begin{document}
giuliomoro@1088 27 \maketitle
giuliomoro@1088 28
giuliomoro@1088 29 These instructions are about use of the Web Audio Evaluation Tool on Windows and Mac OS X platforms.
giuliomoro@1088 30
giuliomoro@1088 31 We request that you acknowledge the authors and cite our work when using it \cite{waet}, see also CITING.txt.
giuliomoro@1088 32
giuliomoro@1088 33 The tool is available in its entirety including source code on \url{https://code.soundsoftware.ac.uk/projects/webaudioevaluationtool/}, under the GNU General Public License v3.0 (\url{http://choosealicense.com/licenses/gpl-3.0/}), see also LICENSE.txt.
giuliomoro@1088 34
giuliomoro@1088 35 % TO DO: Linux (Android, iOS)
giuliomoro@1088 36
giuliomoro@1088 37 \tableofcontents
giuliomoro@1088 38
giuliomoro@1088 39 \clearpage
giuliomoro@1088 40
giuliomoro@1088 41 \section{Installation}
giuliomoro@1088 42 Download the folder (\url{https://code.soundsoftware.ac.uk/hg/webaudioevaluationtool/archive/tip.zip}) and unzip in a location of your choice, or pull the source code from \url{https://code.soundsoftware.ac.uk/hg/webaudioevaluationtool} (Mercurial).
giuliomoro@1088 43
giuliomoro@1088 44 \subsection{Contents}
giuliomoro@1088 45 The folder should contain the following elements: \\
giuliomoro@1088 46
giuliomoro@1088 47 \textbf{Main folder:}
giuliomoro@1088 48 \begin{itemize}
giuliomoro@1088 49 \item \texttt{analyse.html}: analysis and diagnostics of a set of result XML files
giuliomoro@1088 50 \item \texttt{core.css, graphics.css, structure.css}: core style files (edit to change appearance)
giuliomoro@1088 51 \item \texttt{CITING.txt, LICENSE.txt, README.txt}: text files with, respectively, the citation which we ask to include in any work where this tool or any portion thereof is used, modified or otherwise; the license under which the software is shared; and a general readme file referring to these instructions.
giuliomoro@1088 52 \item \texttt{core.js}: JavaScript file with core functionality
giuliomoro@1088 53 \item \texttt{index.html}: webpage where interface should appear (includes link to test configuration XML)
giuliomoro@1088 54 \item \texttt{jquery-2.1.4.js}: jQuery JavaScript Library
giuliomoro@1088 55 \item \texttt{loudness.js}: Allows for automatic calculation of loudness of Web Audio API Buffer objects, return gain values to correct for a target loudness or match loudness between multiple objects
giuliomoro@1088 56 \item \texttt{pythonServer.py}: webserver for running tests locally
giuliomoro@1088 57 \item \texttt{pythonServer-legacy.py}: webserver with limited functionality (no automatic storing of output XML files)
giuliomoro@1088 58 \item \texttt{save.php}: PHP script to store result XML files to web server\\
giuliomoro@1088 59 \end{itemize}
giuliomoro@1088 60 \textbf{Documentation (./docs/)}
giuliomoro@1088 61 \begin{itemize}
giuliomoro@1088 62 \item \href{http://c4dm.eecs.qmul.ac.uk/dmrn/events/dmrnp10/#posters}{DMRN+10}: PDF and \LaTeX source of poster for 10\textsuperscript{th} Digital Music Research Network One-Day workshop (``soft launch'')
giuliomoro@1088 63 \item Instructions: PDF and \LaTeX source of these instructions
giuliomoro@1088 64 \item Project Specification Document (\LaTeX/PDF)
giuliomoro@1088 65 \item Results Specification Document (\LaTeX/PDF)
giuliomoro@1088 66 \item SMC15: PDF and \LaTeX source of 12th Sound and Music Computing Conference paper \cite{waet}
giuliomoro@1088 67 \item WAC2016: PDF and \LaTeX source of 2nd Web Audio Conference paper\\
giuliomoro@1088 68 \end{itemize}
giuliomoro@1088 69 \textbf{Example project (./example\_eval/)}
giuliomoro@1088 70 \begin{itemize}
giuliomoro@1088 71 \item An example of what the set up XML should look like, with example audio files 0.wav-10.wav which are short recordings at 44.1kHz, 16bit of a woman saying the corresponding number (useful for testing randomisation and general familiarisation with the interface).\\
giuliomoro@1088 72 \end{itemize}
giuliomoro@1088 73 \textbf{Interface files (./interfaces/}
giuliomoro@1088 74 \begin{itemize}
giuliomoro@1088 75 \item Each interface class has a JavaScript file and an optional CSS style file. These are loaded as needed.
giuliomoro@1088 76 \end{itemize}
giuliomoro@1088 77
giuliomoro@1088 78 \textbf{Output files (./saves/)}
giuliomoro@1088 79 \begin{itemize}
giuliomoro@1088 80 \item The output XML files of tests will be stored here by default by the \texttt{pythonServer.py} script.\\
giuliomoro@1088 81 \end{itemize}
giuliomoro@1088 82 \textbf{Auxiliary scripts (./scripts/)}
giuliomoro@1088 83 \begin{itemize}
giuliomoro@1088 84 \item Helpful Python scripts for extraction and visualisation of data.\\
giuliomoro@1088 85 \end{itemize}
giuliomoro@1088 86 \textbf{Test creation tool (./test\_create/)}
giuliomoro@1088 87 \begin{itemize}
giuliomoro@1088 88 \item Webpage for easily setting up your own test without having to delve into the XML.\\
giuliomoro@1088 89 \end{itemize}
giuliomoro@1088 90
giuliomoro@1088 91 \subsection{Compatibility}
giuliomoro@1088 92 As Microsoft Internet Explorer doesn't support the Web Audio API\footnote{\url{http://caniuse.com/\#feat=audio-api}}, you will need another browser like Google Chrome, Safari or Firefox (all three are tested and confirmed to work).
giuliomoro@1088 93
giuliomoro@1088 94 Firefox does not currently support other bit depths than 8 or 16 bit for PCM wave files. In the future, this will throw a warning message to tell the user that their content is being quantised automatically. %Nick? Right? To be removed if and when actually implemented
giuliomoro@1088 95
giuliomoro@1088 96 The tool is platform-independent and works in any browser that supports the Web Audio API. It does not require any specific, proprietary software. However, in case the tool is hosted locally (i.e. you are not hosting it on an actual webserver) you will need Python (2.7), which is a free programming language - see the next paragraph.
giuliomoro@1088 97
giuliomoro@1088 98 \clearpage
giuliomoro@1088 99
giuliomoro@1088 100
giuliomoro@1088 101 \section{Test setup}
giuliomoro@1088 102
giuliomoro@1088 103 \subsection{Sample rate}
giuliomoro@1088 104 Depending on how the experiment is set up, audio is resampled automatically (the Web Audio default) or the sample rate is enforced. In the latter case, you will need to make sure that the sample rate of the system is equal to the sample rate of these audio files. For this reason, all audio files in the experiment will have to have the same sample rate.
giuliomoro@1088 105
giuliomoro@1088 106 Always make sure that all other digital equipment in the playback chain (clock, audio interface, digital-to-analog converter, ...) is set to this same sample rate.
giuliomoro@1088 107
giuliomoro@1088 108 Note that upon changing the sampling rate, the browser will have to be restarted for the change to take effect.
giuliomoro@1088 109
giuliomoro@1088 110 \subsubsection{Mac OS X}
giuliomoro@1088 111 To change the sample rate in Mac OS X, go to \textbf{Applications/Utilities/Audio MIDI Setup} or find this application with Spotlight (see Figure \ref{fig:audiomidisetup}). Then select the output of the audio interface you are using and change the `Format' to the appropriate number. Also make sure the bit depth and channel count are as desired.
giuliomoro@1088 112 If you are using an external audio interface, you may have to go to the preference pane of that device to change the sample rate.
giuliomoro@1088 113
giuliomoro@1088 114 Also make sure left and right channel gains are equal, as some applications alter this without changing it back, leading to a predominantly louder left or right channel. See Figure \ref{fig:audiomidisetup} for an example where the channel gains are different.
giuliomoro@1088 115
giuliomoro@1088 116 \begin{figure}[tb]
giuliomoro@1088 117 \centering
giuliomoro@1088 118 \includegraphics[width=.65\textwidth]{img/audiomidisetup.png}
giuliomoro@1088 119 \caption{The Audio MIDI Setup window in Mac OS X}
giuliomoro@1088 120 \label{fig:audiomidisetup}
giuliomoro@1088 121 \end{figure}
giuliomoro@1088 122
giuliomoro@1088 123 \subsubsection{Windows}
giuliomoro@1088 124 To change the sample rate in Windows, right-click on the speaker icon in the lower-right corner of your desktop and choose `Playback devices'. Right-click the appropriate playback device and click `Properties'. Click the `Advanced' tab and verify or change the sample rate under `Default Format'. % NEEDS CONFIRMATION
giuliomoro@1088 125 If you are using an external audio interface, you may have to go to the preference pane of that device to change the sample rate.
giuliomoro@1088 126
giuliomoro@1088 127 \subsection{Local test}
giuliomoro@1088 128 If the test is hosted locally, you will need to run the local webserver provided with this tool.
giuliomoro@1088 129
giuliomoro@1088 130 \subsubsection{Mac OS X \& Linux}
giuliomoro@1088 131
giuliomoro@1088 132 On Mac OS X, Python comes preinstalled, as with most Unix/Linux distributions.
giuliomoro@1088 133
giuliomoro@1088 134 Open the Terminal (find it in \textbf{Applications/Terminal} or via Spotlight), and go to the folder you downloaded. To do this, type \texttt{cd [folder]}, where \texttt{[folder]} is the folder where to find the \texttt{pythonServer.py} script you downloaded. For instance, if the location is \texttt{/Users/John/Documents/test/}, then type
giuliomoro@1088 135
giuliomoro@1088 136 \texttt{cd /Users/John/Documents/test/}
giuliomoro@1088 137
giuliomoro@1088 138 Then hit enter and run the Python script by typing
giuliomoro@1088 139
giuliomoro@1088 140 \texttt{python pythonServer.py}
giuliomoro@1088 141
giuliomoro@1088 142 and hit enter again. See also Figure \ref{fig:terminal}.
giuliomoro@1088 143
giuliomoro@1088 144 \begin{figure}[htbp]
giuliomoro@1088 145 \begin{center}
giuliomoro@1088 146 \includegraphics[width=.75\textwidth]{pythonServer.png}
giuliomoro@1088 147 \caption{Mac OS X: The Terminal window after going to the right folder (\texttt{cd [folder\_path]}) and running \texttt{pythonServer.py}.}
giuliomoro@1088 148 \label{fig:terminal}
giuliomoro@1088 149 \end{center}
giuliomoro@1088 150 \end{figure}
giuliomoro@1088 151
giuliomoro@1088 152 Alternatively, you can simply type \texttt{python} (follwed by a space) and drag the file into the Terminal window from Finder. % DOESN'T WORK YET
giuliomoro@1088 153
giuliomoro@1088 154 You can leave this running throughout the different experiments (i.e. leave the Terminal open). Once running the terminal will report the current URL to type into your browser to initiate the test, usually this is http://localhost:8000/.
giuliomoro@1088 155
giuliomoro@1088 156 To start the test, open the browser and type
giuliomoro@1088 157
giuliomoro@1088 158 \texttt{localhost:8000}
giuliomoro@1088 159
giuliomoro@1088 160 and hit enter. The test should start (see Figure \ref{fig:test}).
giuliomoro@1088 161
giuliomoro@1088 162 To quit the server, either close the terminal window or press Ctrl+C on your keyboard to forcibly shut the server.
giuliomoro@1088 163
giuliomoro@1088 164 \subsubsection{Windows}
giuliomoro@1088 165
giuliomoro@1088 166 On Windows, Python 2.7 is not generally preinstalled and therefore has to be downloaded\footnote{\url{https://www.python.org/downloads/windows/}} and installed to be able to run scripts such as the local webserver, necessary if the tool is hosted locally.
giuliomoro@1088 167
giuliomoro@1088 168 Simply double click the Python script \texttt{pythonServer.py} in the folder you downloaded.
giuliomoro@1088 169
giuliomoro@1088 170 You may see a warning like the one in Figure \ref{fig:warning}. Click `Allow access'.
giuliomoro@1088 171
giuliomoro@1088 172 \begin{figure}[htbp]
giuliomoro@1088 173 \begin{center}
giuliomoro@1088 174 \includegraphics[width=.6\textwidth]{warning.png}
giuliomoro@1088 175 \caption{Windows: Potential warning message when executing \texttt{pythonServer.py}.}
giuliomoro@1088 176 \label{fig:warning}
giuliomoro@1088 177 \end{center}
giuliomoro@1088 178 \end{figure}
giuliomoro@1088 179
giuliomoro@1088 180 The process should now start, in the Command prompt that opens - see Figure \ref{fig:python}.
giuliomoro@1088 181
giuliomoro@1088 182 \begin{figure}[htbp]
giuliomoro@1088 183 \begin{center}
giuliomoro@1088 184 \includegraphics[width=.75\textwidth]{python.png}
giuliomoro@1088 185 \caption{Windows: The Command Prompt after running \texttt{pythonServer.py} and opening the corresponding website.}
giuliomoro@1088 186 \label{fig:python}
giuliomoro@1088 187 \end{center}
giuliomoro@1088 188 \end{figure}
giuliomoro@1088 189
giuliomoro@1088 190 You can leave this running throughout the different experiments (i.e. leave the Command Prompt open).
giuliomoro@1088 191
giuliomoro@1088 192 To start the test, open the browser and type
giuliomoro@1088 193
giuliomoro@1088 194 \texttt{localhost:8000}
giuliomoro@1088 195
giuliomoro@1088 196 and hit enter. The test should start (see Figure \ref{fig:test}).
giuliomoro@1088 197
giuliomoro@1088 198 \begin{figure}[htb]
giuliomoro@1088 199 \begin{center}
giuliomoro@1088 200 \includegraphics[width=.8\textwidth]{test.png}
giuliomoro@1088 201 \caption{The start of the test in Google Chrome on Windows 7.}
giuliomoro@1088 202 \label{fig:test}
giuliomoro@1088 203 \end{center}
giuliomoro@1088 204 \end{figure}
giuliomoro@1088 205
giuliomoro@1088 206 If at any point in the test the participant reports weird behaviour or an error of some kind, or the test needs to be interrupted, please notify the experimenter and/or refer to Section \ref{sec:troubleshooting}.
giuliomoro@1088 207
giuliomoro@1088 208 When the test is over (the subject should see a message to that effect, and click `Submit' one last time), the output XML file containing all collected data should have appeared in `saves/'. The names of these files are `test-0.xml', `test-1.xml', etc., in ascending order. The Terminal or Command prompt running the local web server will display the following file name. If such a file did not appear, please again refer to Section \ref{sec:troubleshooting}.
giuliomoro@1088 209
giuliomoro@1088 210 It is advised that you back up these results as often as possible, as a loss of this data means that the time and effort spent by the subject(s) has been in vain. Save the results to an external or network drive, and/or send them to the experimenter regularly.
giuliomoro@1088 211
giuliomoro@1088 212 To start the test again for a new participant, you do not need to close the browser or shut down the Terminal or Command Prompt. Simply refresh the page or go to \texttt{localhost:8000} again.
giuliomoro@1088 213
giuliomoro@1088 214
giuliomoro@1088 215 \subsection{Remote test}
giuliomoro@1088 216 Put all files on a web server which supports PHP. This allows the `save.php' script to store the XML result files in the `saves/' folder. If the web server is not able to store the XML file there at the end of the test, it will present the XML file locally to the user, as a `Save file' link.
giuliomoro@1088 217
giuliomoro@1088 218 Make sure the \texttt{projectReturn} attribute of the \texttt{setup} node is set to the \texttt{save.php} script.
giuliomoro@1088 219
giuliomoro@1088 220 Then, just go to the URL of the corresponding HTML file, e.g. \texttt{http://server.com/path/to/WAET/index.html?url=test/my-test.xml}. If storing on the server doesn't work at submission (e.g. if the \texttt{projectReturn} attribute isn't properly set), the result XML file will be presented to the subject on the client side, as a `Save file' link.
giuliomoro@1088 221
giuliomoro@1088 222 \subsection{Load a test / Multiple test documents}
giuliomoro@1088 223 By default the index page will load a demo page of tests. To automatically load a test document, you need to append the location in the URL. If your URL is normally http://localhost:8000/index.html you would append the following: \texttt{?url=/path/to/your/test.xml}. Replace the fields with your actual path, the path is local to the running directory, so if you have your test in the directory \texttt{example\_eval} called \texttt{project.xml} you would append \texttt{?url=/example\_eval/project.xml}.
giuliomoro@1088 224
giuliomoro@1088 225 \clearpage
giuliomoro@1088 226
giuliomoro@1088 227 \section{Interfaces}
giuliomoro@1088 228
giuliomoro@1088 229 The Web Audio Evaluation Tool comes with a number of interface styles, each of which can be customised extensively, either by configuring them differently using the many optional features, or by modifying the JavaScript files.
giuliomoro@1088 230
giuliomoro@1088 231 To set the interface style for the whole test, set the attribute of the \texttt{setup} node to \texttt{interface="APE"}, where \texttt{"APE"} is one of the interface names below.
giuliomoro@1088 232
giuliomoro@1088 233 \subsection{APE}
giuliomoro@1088 234 The APE interface is based on \cite{ape}, and consists of one or more axes, each corresponding with an attribute to be rated, on which markers are placed. As such, it is a multiple stimulus interface where (for each dimension or attribute) all elements are on one axis so that they can be maximally compared against each other, as opposed to rated individually or with regards to a single reference.
giuliomoro@1088 235 It also contains an optional text box for each element, to allow for clarification by the subject, tagging, and so on.
giuliomoro@1088 236
giuliomoro@1088 237 \subsection{MUSHRA}
giuliomoro@1088 238 This is a straightforward implementation of \cite{mushra}, especially common for the rating of audio quality, for instance for the evaluation of audio codecs. This can also operate any vertical slider style test and does not necessarily have to match the MUSHRA specification.
giuliomoro@1088 239
giuliomoro@1088 240 \subsection{AB}
giuliomoro@1088 241 Performs a pairwise comparison, but supports ABX and n-way comparison (in the example we demonstrate it performing a 7-way comparison).
giuliomoro@1088 242
giuliomoro@1088 243 \subsection{discrete/Likert}
giuliomoro@1088 244 Each audio element is given a discrete set of values based on the number of slider options specified. For instance, Likert specifies 5 values and therefore each audio element must be one of those 5 values.
giuliomoro@1088 245
giuliomoro@1088 246 \subsection{ACR/CCR/DCR/horizontal}
giuliomoro@1088 247 Creates the same interfaces as MUSHRA except the sliders are horizontal, not vertical.
giuliomoro@1088 248
giuliomoro@1088 249
giuliomoro@1088 250 \clearpage
giuliomoro@1088 251
giuliomoro@1088 252 \section{Project XML}
giuliomoro@1088 253
giuliomoro@1088 254 Each test is defined by its project XML file, examples of these can be seen in the ./example\_eval/ directory.
giuliomoro@1088 255
giuliomoro@1088 256 In the XML there are several nodes which must be defined:
giuliomoro@1088 257 \begin{itemize}
giuliomoro@1088 258 \item \texttt{<waet>}: The root node.
giuliomoro@1088 259 \item \texttt{<setup>}: The first child node, defines whole-test parameters
giuliomoro@1088 260 \item \texttt{<page>}: Specifies a test page, attached \emph{after} the \texttt{<setup>}.
giuliomoro@1088 261 \item \texttt{<audioelement>}: Specifies an audio element.
giuliomoro@1088 262 \end{itemize}
giuliomoro@1088 263
giuliomoro@1088 264 The test uses XML validation, so the ordering of nodes is important to pass this validation. Some nodes also have specific attributes which must be set and may even have a certain format to apply them. This is done so error checking can be performed both quickly and succintly with easy to find errors before loading and running a test session.
giuliomoro@1088 265
giuliomoro@1088 266 Before identifying any features, this part will walk you through the available nodes, their function and their attributes.
giuliomoro@1088 267
giuliomoro@1088 268 \subsection{Root}
giuliomoro@1088 269 The root node is \texttt{<waet>}, it must have the following attributes:
giuliomoro@1088 270
giuliomoro@1088 271 \texttt{xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"}
giuliomoro@1088 272
giuliomoro@1088 273 \texttt{xsi:noNamespaceSchemaLocation="test-schema.xsd"}.
giuliomoro@1088 274
giuliomoro@1088 275 This will ensure it is checked against the XML schema for validation.
giuliomoro@1088 276
giuliomoro@1088 277 \subsection{Set up}
giuliomoro@1088 278 The first child node, \texttt{<setup>} specifies any one time and global parameters. It takes the following attributes:
giuliomoro@1088 279 \begin{itemize}
giuliomoro@1088 280 \item \texttt{interface}: String, mandatory, specifies the interface to load
giuliomoro@1088 281 \item \texttt{projectReturn}: URL, mandatory, specifies the return point. Can be a 3rd party server or the local server. Set to null to disable automatic saving. Specifying "save.php" will trigger the return if either the PHP or python servers are used. On error, it will always default to presenting the save on page.
giuliomoro@1088 282 \item \texttt{randomiseOrder}: Boolean, optional, if true it will randomise the order of the test pages. Default is false.
giuliomoro@1088 283 \item \texttt{testPages}: non-negative integer, optional. Specifies the number of test pages to actually test with. Combined with randomiseOrder being true will give a random set of test pages per participant from the given pool of \texttt{<page>} nodes. Specifying 0 disables this option, default is 0.
giuliomoro@1088 284 \item \texttt{loudness}: non-positive integer, optional. Set the default LUFS target value. See \ref{sec:loudness} for more.
giuliomoro@1088 285 \item \texttt{sampleRate}: positive integer, optional. If set, the sample rate reported by the Web Audio API must match this number. See \ref{sec:samplerate}.
giuliomoro@1088 286 \end{itemize}
giuliomoro@1088 287
giuliomoro@1088 288 The \texttt{<setup>} node takes the following child nodes, note these must appear in this order:
giuliomoro@1088 289 \begin{itemize}
giuliomoro@1088 290 \item \texttt{<survey>}: Min of 0, max of 2 occurences. See \ref{sec:survey}
giuliomoro@1088 291 \item \texttt{<metric>}: Must appear only once.
giuliomoro@1088 292 \item \texttt{<interface>}: Must appear only once.
giuliomoro@1088 293 \end{itemize}
giuliomoro@1088 294
giuliomoro@1088 295 \subsection{Page}
giuliomoro@1088 296 \label{sec:page}
giuliomoro@1088 297 The only other first level child nodes, these specify the test pages. It takes the following attributes:
giuliomoro@1088 298 \begin{itemize}
giuliomoro@1088 299 \item \texttt{id}: ID, mandatory. A string which must be unique across the entire XML. It is used to identify the page on test completion as pages are returned in the results in the order they appeared, not specified.
giuliomoro@1088 300 \item \texttt{hostURL}: URL, mandatory. Used in conjuction with the \texttt{<audioelement>} url to specify where the audio files are located. For instance if all your files are in the directory \texttt{./test/} you can set this attribute to "/test/" and the \texttt{<audioelement>} url attribute only needs to file name. Set to "" if no hostURL prefix desired.
giuliomoro@1088 301 \item \texttt{randomiseOrder}: Boolean, optional. If true the audio fragments are presented randomly rather than the order specified. See \ref{sec:randomisation}. Default is false.
giuliomoro@1088 302 \item \texttt{repeatCount}: non-negative integer, optional. Specify the number of times to repeat the test page (re-present). Each presentation will appear as an individual page in the results. Default is 0.
giuliomoro@1088 303 \item \texttt{loop}: Boolean, optional. If true, the audio elements will loop synchronously with each other. See \ref{sec:looping}. Default is false.
giuliomoro@1088 304 \item \texttt{showElementComments}: Boolean, optional. If true then there will be a comment box on the test page for each audio element presented, see \ref{sec:commentboxes}.
giuliomoro@1088 305 \item \texttt{loudness}: non-positive integer, optional. Set the LUFS target value for this page. Supersedes the \texttt{<setup>} loudness attribute for this page. See \ref{sec:loudness} for more.
giuliomoro@1088 306 \end{itemize}
giuliomoro@1088 307
giuliomoro@1088 308 The \texttt{<page>} node takes the following child, nodes note these must appear in this order:
giuliomoro@1088 309 \begin{itemize}
giuliomoro@1088 310 \item \texttt{<title>}: Appear once or not at all. The text content of this node specifies the title of the test page, for instance \texttt{<title>John Doe's Test</title>}
giuliomoro@1088 311 \item \texttt{<commentboxprefix}: Appear once or not at all. The text content specifies the prefix of the comment boxes, see \ref{sec:commentboxes}.
giuliomoro@1088 312 \item \texttt{<interface>}: Must appear only once.
giuliomoro@1088 313 \item \texttt{<audioelement>}: Minimum of one. Specifies an audio element, see \ref{sec:audioelement}.
giuliomoro@1088 314 \item \texttt{<commentquestion>}: Min of 0, max unlimited occurences. See \ref{sec:commentboxes}.
giuliomoro@1088 315 \item \texttt{<survey>}: Min of 0, max of 2 occurences. See \ref{sec:survey}
giuliomoro@1088 316 \end{itemize}
giuliomoro@1088 317
giuliomoro@1088 318 \subsection{Survey}
giuliomoro@1088 319 \label{sec:survey}
giuliomoro@1088 320 These specify any survey items to be presented. The must be a maximum of two of these per \texttt{<setup>} and \texttt{<page>} nodes. These have one attribute, location, which must be set to one of the following: before, pre, after or post. In this case before == pre and after == post. This specifies where the survey must appear before or after the node it is associated with. When a child of \texttt{<setup>} then pre/before will be shown before the first test page and after/post shown after completing the last test page. When a child of \texttt{<page>} then pre/before is before the test commences and after/post is once the test has been submitted.
giuliomoro@1088 321
giuliomoro@1088 322 The survey node takes as its only set of childs the \texttt{<surveyentry>} node of which there can be any number.
giuliomoro@1088 323
giuliomoro@1088 324 \subsubsection{Survey Entry}
giuliomoro@1088 325 These nodes have the following attributes, which vary depending on the survey type wanted:
giuliomoro@1088 326 \begin{itemize}
giuliomoro@1088 327 \item \texttt{id}: ID, mandatory. Must be unique across the entire XML, used to identify the response in the results.
giuliomoro@1088 328 \item \texttt{type}: String, mandatory. Must be one of the following: statement, question, checkbox, radio or number. This defines the type to show.
giuliomoro@1088 329 \item \texttt{mandatory}: Boolean, optional. Defines if the survey must have a response or not. Does not apply to statements. Default is false.
giuliomoro@1088 330 \item \texttt{min}: Number, optional. Only applies when \texttt{type="number"}, the minimum valid response.
giuliomoro@1088 331 \item \texttt{max}: Number, optional. Only applies when \texttt{type="number"}, the maximum valid response.
giuliomoro@1088 332 \item \texttt{boxsize}: String, optional. Only applies when \texttt{type="question"} and must be one of the following: normal (default), small, large or huge.
giuliomoro@1088 333 \end{itemize}
giuliomoro@1088 334
giuliomoro@1088 335 The nodes have the following children, which vary depending on the survey type wanted.
giuliomoro@1088 336 \begin{itemize}
giuliomoro@1088 337 \item \texttt{<statement>}: Must appear only once. Its text content specifies the text to appear as the statement or question for the user to respond to.
giuliomoro@1088 338 \item \texttt{<option>}: Only valid if the parent node has the attribute \texttt{type} set to checkbox or radio. Has attribute \texttt{name} to identify the selected option in the results. The text content is the text to show next to the radio/checkbox.
giuliomoro@1088 339 \end{itemize}
giuliomoro@1088 340
giuliomoro@1088 341 \subsection{Interface}
giuliomoro@1088 342 This node specifies any interface specific options and test parameters. It has an optional \texttt{name} attribute used to set the axis name (where applicable), such as the multi-axis APE interface. Specifying multiple interface nodes in a \texttt{<page>} node will trigger multiple axis where applicable, otherwise only the \emph{first node} will be used and the rest ignored.
giuliomoro@1088 343
giuliomoro@1088 344 The node has the following children, note the order these must appear in is as follows:
giuliomoro@1088 345 \begin{itemize}
giuliomoro@1088 346 \item \texttt{title}: Min 0, max 1 occurence. The text content specifies the name of the axis as shown to the user.
giuliomoro@1088 347 \item \texttt{interfaceoption}: Min 0, max unbounded. Specifies the interface options. See \ref{sec:interfaceoption}.
giuliomoro@1088 348 \item \texttt{scales}: Min 0, max 1 occurence. Contains \texttt{<scalelable>} nodes which define the displayed scales. See \ref{sec:scales}.
giuliomoro@1088 349 \end{itemize}
giuliomoro@1088 350
giuliomoro@1088 351 \subsection{Audio Element}
giuliomoro@1088 352 \label{sec:audioelement}
giuliomoro@1088 353 Appear as children of the \texttt{page} node. Each of these specify an individual interface fragment to display. Multiple fragments can reference the same file (allowing for repetition with different parameters or blind-doubles). The node has the following attributes:
giuliomoro@1088 354 \begin{itemize}
giuliomoro@1088 355 \item \texttt{id}: ID, mandatory. Must be unique across the test page. Used to identify the specific fragment in the results.
giuliomoro@1088 356 \item \texttt{url}: URL, mandatory. Used with the parent \texttt{page} nodes' \texttt{hostURL} attribute to get the full url of the audio file to load.
giuliomoro@1088 357 \item \texttt{gain}: Float, optional. Specify the gain in decibels to apply to the node after loudness normalisation. Default is 0.
giuliomoro@1088 358 \item \texttt{type}: String, optional. Must be one of the following: normal (default when not specified), anchor, reference or outside-reference. Normal, anchor and reference are presented as normal, outside-reference presents the node as a separate interface option.
giuliomoro@1088 359 \item \texttt{marker}: Integer between 0 and 100, optional. Only used when \texttt{type="anchor"|"reference"}. See \ref{sec:referencesandanchors}.
giuliomoro@1088 360 \end{itemize}
giuliomoro@1088 361
giuliomoro@1088 362
giuliomoro@1088 363 \section{Features}
giuliomoro@1088 364
giuliomoro@1088 365 This section covers the different features implemented in the Web Audio Evaluation Tool, how to use them, and what to know about them.
giuliomoro@1088 366
giuliomoro@1088 367 Unless otherwise specified, \emph{each} feature described here is optional, i.e. it can be enabled or disabled and adjusted to some extent.
giuliomoro@1088 368
giuliomoro@1088 369 As the example project showcases (nearly) all of these features, please refer to its configuration XML document for a demonstration of how to enable and adjust them.
giuliomoro@1088 370
giuliomoro@1088 371 \subsection{Interface options}
giuliomoro@1088 372 The interface node has children of interface options which are used to specify modifications to the test environment. These are divided into two catagories: check and show. Check are used to specify conditions which must be met before a page can be completed, these include checking all fragments have been played or checking all fragments have a comment and so on. Show is used to show an optional on page element or control, such as the playhead or master volume.
giuliomoro@1088 373
giuliomoro@1088 374 Check items have the attribute "type" set to "check". The following list gives the string to give the "name" attribute along with a description of the check.
giuliomoro@1088 375 \begin{itemize}
giuliomoro@1088 376 \item \texttt{fragmentPlayed}: Checks that all fragments have been at least partially played
giuliomoro@1088 377 \item \texttt{fragmentFullPlayback}: Checks that all fragments have been fully played. \emph{NOTE:} This will always clear if the page is looping as it is not possible to know every sample has been played.
giuliomoro@1088 378 \item \texttt{fragmentMoved}: Checks that all fragments have been moved. This is interface dependent, for instance on AB this will always clear as there is no movement.
giuliomoro@1088 379 \item \texttt{fragmentComments}: Cheks that all fragments have a comment. Will clear if there are no on page comments but with a console warning.
giuliomoro@1088 380 \item \texttt{scalerange}: Has two extra attributes "min" and "max". Checks that at least one element is below the min value and one element is above the max value.
giuliomoro@1088 381 \end{itemize}
giuliomoro@1088 382
giuliomoro@1088 383 Show items have the attribute "type" set to "show". The following list gives the string to give the "name" attribute along with a description.
giuliomoro@1088 384 \begin{itemize}
giuliomoro@1088 385 \item \texttt{playhead}: Shows the playhead to the end user indicating where in the file they are currently listening
giuliomoro@1088 386 \item \texttt{page-count}: Shows the current test page number and the total number of test pages.
giuliomoro@1088 387 \item \texttt{volume}: Shows a master volume control to the user to manipulate the output gain of the page. This is tracked.
giuliomoro@1088 388 \end{itemize}
giuliomoro@1088 389
giuliomoro@1088 390 \subsubsection{Multiple scales}
giuliomoro@1088 391 In the case of multiple rating scales, e.g. when the stimuli are to be rated in terms of attributes `timbre' and `spatial impression', multiple interface nodes will have to be added, each specifying the title and annotations.
giuliomoro@1088 392
giuliomoro@1088 393 This is where the \texttt{interface}'s \texttt{name} attribute is particularly important: use this to retrieve the rating values, comments and metrics associated with the specified interface.
giuliomoro@1088 394 If none is given, you can still use the automatically given \texttt{interface-id}, which is the interface number starting with 0 and corresponding to the order in which the rating scales appear.
giuliomoro@1088 395
giuliomoro@1088 396 \subsection{Randomisation}
giuliomoro@1088 397 \label{sec:randomisation}
giuliomoro@1088 398 [WORK IN PROGRESS]
giuliomoro@1088 399
giuliomoro@1088 400 \subsubsection{Randomisation of configuration XML files}
giuliomoro@1088 401 The python server has a special function to automatically cycle through a list of test pages. Instead of directly requesting an XML, simply setting the url item in the browser URL to \texttt{pseudo.xml} will cycle through a list of XMLs. These XMLs must be in the local directory called \texttt{./pseudo/}.
giuliomoro@1088 402 % how to
giuliomoro@1088 403 % explain how this is implemented in the pythonServer
giuliomoro@1088 404 %Nick? already implemented in the PHP?
giuliomoro@1088 405 % Needs to be implemented in PHP and automated better, will complete soon
giuliomoro@1088 406
giuliomoro@1088 407
giuliomoro@1088 408 \subsubsection{Randomsation of page order}
giuliomoro@1088 409 The page order randomisation is set by the \texttt{<setup>} node attribute \texttt{randomise-order}, for example \texttt{<setup ... randomise-order="true">...</setup>} will randomise the test page order. When not set, the default is to \textbf{not} randomise the test page order.
giuliomoro@1088 410
giuliomoro@1088 411 \subsubsection{Randomisation of axis order}
giuliomoro@1088 412
giuliomoro@1088 413 \subsubsection{Randomisation of fragment order}
giuliomoro@1088 414 The audio fragment randomisation is set by the \texttt{<audioholder>} node attribute \texttt{randomise-order}, for example \texttt{<audioholder ... randomise-order="true">...</audioholder>} will randomise the test page order. When not set, the default is to \textbf{not} randomise the test page order.
giuliomoro@1088 415
giuliomoro@1088 416 \subsubsection{Randomisation of initial slider position}
giuliomoro@1088 417 By default slider values are randomised on start. The MUSHRA interface supports setting the initial values of all sliders throught the \texttt{<audioholder>} attribute \texttt{initial-position}. This takes an integer between 0 and 100 to signify the slider position.
giuliomoro@1088 418 % /subsubsection{Randomisation of survey question order}
giuliomoro@1088 419 % should be an attribute of the individual 'pretest' and 'posttest' elements
giuliomoro@1088 420 % uncomment once we have it
giuliomoro@1088 421
giuliomoro@1088 422 \subsection{Looping}
giuliomoro@1088 423 \label{sec:looping}
giuliomoro@1088 424 Looping enables the fragments to loop until stopped by the user. Looping is synchronous so all fragments start at the same time on each loop.
giuliomoro@1088 425 Individual test pages can have their playback looped by the \texttt{<page>} attribute \texttt{loop} with a value of "true" or "false".
giuliomoro@1088 426 If the fragments are not of equal length initially, they are padded with zeros so that they are equal length, to enable looping without the fragments going out of sync relative to each other.
giuliomoro@1088 427
giuliomoro@1088 428 Note that fragments cannot be played until all page fragments are loaded when in looped mode, as the engine needs to know the length of each fragment to calculate the padding.
giuliomoro@1088 429
giuliomoro@1088 430 \subsection{Sample rate}
giuliomoro@1088 431 \label{sec:samplerate}
giuliomoro@1088 432 If you require the test to be conducted at a certain sample rate (i.e. you do not tolerate resampling of the elements to correspond with the system's sample rate), add \texttt{sampleRate="96000"} - where ``96000'' can be any support sample rate (in Hz) - so that a warning message is shown alerting the subject that their system's sample rate is different from this enforced sample rate. This is checked immediately after parsing and stops the page loading any other elements if this check has failed.
giuliomoro@1088 433
giuliomoro@1088 434 \subsection{Metrics}
giuliomoro@1088 435 The \texttt{Metric} node, which contains the metrics to be tracked during the complete test, is a child of the \texttt{setup} node, and it could look as follows.
giuliomoro@1088 436
giuliomoro@1088 437 \begin{lstlisting}
giuliomoro@1088 438 <Metric>
giuliomoro@1088 439 <metricEnable>testTimer</metricEnable>
giuliomoro@1088 440 <metricEnable>elementTimer</metricEnable>
giuliomoro@1088 441 <metricEnable>elementInitialPosition</metricEnable>
giuliomoro@1088 442 <metricEnable>elementTracker</metricEnable>
giuliomoro@1088 443 <metricEnable>elementFlagListenedTo</metricEnable>
giuliomoro@1088 444 <metricEnable>elementFlagMoved</metricEnable>
giuliomoro@1088 445 <metricEnable>elementListenTracker</metricEnable>
giuliomoro@1088 446 </Metric>
giuliomoro@1088 447 \end{lstlisting}
giuliomoro@1088 448
giuliomoro@1088 449 When in doubt, err on the inclusive side, as one never knows which information is needed in the future. Most of these metrics are necessary for post-processing scripts such as timeline\_view\_movement.py. % Brecht: should perhaps list somewhere what metrics are required for which analysis scripts.
giuliomoro@1088 450
giuliomoro@1088 451 \subsubsection{Time test duration}
giuliomoro@1088 452 \texttt{testTimer}\\
giuliomoro@1088 453 One per test page. Presents the total test time from the first playback on the test page to the submission of the test page (exculding test time of the pre-/post- test surveys). This is presented in the results as \texttt{<metricresult id="testTime"> 8.60299319727892 </metricresult>}. The time is in seconds.
giuliomoro@1088 454
giuliomoro@1088 455 \subsubsection{Time fragment playback}
giuliomoro@1088 456 \texttt{elementTimer}\\
giuliomoro@1088 457 One per audio fragment per test page. This totals up the entire time the audio fragment has been listened to in this test and presented \texttt{<metricresult name="enableElementTimer"> 1.0042630385487428 </metricresult>}. The time is in seconds.
giuliomoro@1088 458
giuliomoro@1088 459 \subsubsection{Initial positions}
giuliomoro@1088 460 \texttt{elementInitialPosition}\\
giuliomoro@1088 461 One per audio fragment per test page. Tracks the initial position of the sliders, especially relevant when these are randomised. Example result \texttt{<metricresult name="elementInitialPosition"> 0.8395522388059702 </metricresult>}.
giuliomoro@1088 462
giuliomoro@1088 463 \subsubsection{Track movements}
giuliomoro@1088 464 \texttt{elementTracker}\\
giuliomoro@1088 465 One per audio fragment per test page. Tracks the movement of each interface object. Each movement event has the time it occured at and the new value.
giuliomoro@1088 466 \subsubsection{Which fragments listened to}
giuliomoro@1088 467 \texttt{elementFlagListenedTo}\\
giuliomoro@1088 468 One per audio fragment per test page. Boolean response, set to true if listened to.
giuliomoro@1088 469 \subsubsection{Which fragments moved}
giuliomoro@1088 470 \texttt{elementFlagMoved}\\
giuliomoro@1088 471 One per audio fragment per test page. Binary check whether or not a the marker corresponding with a particular fragment was moved at all throughout the experiment.
giuliomoro@1088 472
giuliomoro@1088 473 \subsubsection{elementListenTracker}
giuliomoro@1088 474 \texttt{elementListenTracker}\\
giuliomoro@1088 475 One per audio fragment per test page. Tracks the playback events of each audio element pairing both the time in the test when playback started and when it stopped, it also gives the buffertime positions.
giuliomoro@1088 476
giuliomoro@1088 477 \subsection{References and anchors}
giuliomoro@1088 478 \label{sec:referencesandanchors}
giuliomoro@1088 479 The audio elements, \texttt{<audioelement>} have the attribute \texttt{type}, which defaults to normal. Setting this to one of the following will have the following effects.
giuliomoro@1088 480 \subsubsection{Outside Reference}
giuliomoro@1088 481 Set type to 'outside-reference'. This will place the object in a separate playback element clearly labelled as an outside reference. This is exempt of any movement checks but will still be included in any listening checks.
giuliomoro@1088 482 \subsubsection{Hidden reference}
giuliomoro@1088 483 Set type to 'reference'. The element will still be randomised as normal (if selected) and presented to the user. However the element will have the 'reference' type in the results to quickly find it. The reference can be forced to be below a value before completing the test page by setting the attribute 'marker' to be a value between 0 and 100 representing the integer value position it must be equal to or above.
giuliomoro@1088 484 \subsubsection{Hidden anchor}
giuliomoro@1088 485 Set type to 'anchor'. The element will still be randomised as normal (if selected) and presented to the user. However the element will have the 'anchor' type in the results to quickly find it. The anchor can be forced to be below a value before completing the test page by setting the attribute 'marker' to be a value between 0 and 100 representing the integer value position it must be equal to or below.
giuliomoro@1088 486
giuliomoro@1088 487 \subsection{Checks}
giuliomoro@1088 488 \label{sec:checks}
giuliomoro@1088 489
giuliomoro@1088 490 %blabla
giuliomoro@1088 491 These checks are enabled in the \texttt{interface} node, which is a child of the \texttt{setup} node.
giuliomoro@1088 492 \subsubsection{Playback checks}
giuliomoro@1088 493 % what it does/is
giuliomoro@1088 494 Enforce playing each sample at least once, for at least a little bit (e.g. this test is satisfied even if you only play a tiny portion of the file), by alerting the user to which samples have not been played upon clicking `Submit'. When enabled, one cannot proceed to the next page, answer a survey question, or finish the test, before clicking each sample at least once.
giuliomoro@1088 495 % how to enable/disable
giuliomoro@1088 496
giuliomoro@1088 497 Alternatively, one can check whether the \emph{entire} fragment was listened to at least once.
giuliomoro@1088 498 % how to enable
giuliomoro@1088 499
giuliomoro@1088 500 Add \texttt{<check name="fragmentPlayed"/>} to the \texttt{interface} node.
giuliomoro@1088 501
giuliomoro@1088 502
giuliomoro@1088 503 \subsubsection{Movement check}
giuliomoro@1088 504 Enforce moving each sample at least once, for at least a little bit (e.g. this test is satisfied even if you only play a tiny portion of the file), by alerting the user to which samples have not been played upon clicking `Submit'. When enabled, one cannot proceed to the next page, answer a survey question, or finish the test, before clicking each sample at least once.
giuliomoro@1088 505 If there are several axes, the warning will specify which samples have to be moved on which axis.
giuliomoro@1088 506
giuliomoro@1088 507 Add \texttt{<check name="fragmentMoved"/>} to the \texttt{interface} node.
giuliomoro@1088 508
giuliomoro@1088 509 \subsubsection{Comment check}
giuliomoro@1088 510 % How to enable/disable?
giuliomoro@1088 511
giuliomoro@1088 512 Enforce commenting, by alerting the user to which samples have not been commented on upon clicking `Submit'. When enabled, one cannot proceed to the next page, answer a survey question, or finish the test, before putting at least one character in each comment box.
giuliomoro@1088 513
giuliomoro@1088 514 Note that this does not apply to any extra (text, radio button, checkbox) elements, unless these have the `mandatory' option enabled. %Nick? is this extra 'mandatory' option implemented?
giuliomoro@1088 515
giuliomoro@1088 516 Add \texttt{<check name="fragmentComments"/>} to the \texttt{interface} node.
giuliomoro@1088 517
giuliomoro@1088 518 %ADD: how to add a custom comment box
giuliomoro@1088 519
giuliomoro@1088 520 \subsubsection{Scale use check}
giuliomoro@1088 521 It is possible to enforce a certain usage of the scale, meaning that at least one slider needs to be below and/or above a certain percentage of the slider.
giuliomoro@1088 522
giuliomoro@1088 523 Add \texttt{<check name="scalerange" min="25" max="75"/>} to the \texttt{interface} node.
giuliomoro@1088 524
giuliomoro@1088 525 \subsubsection{Note on the use of multiple rating axes}
giuliomoro@1088 526 I.e. what if more than one axis? How to specify which axis the checks relate to? %Nick? to add?
giuliomoro@1088 527
giuliomoro@1088 528 \subsection{Platform information}
giuliomoro@1088 529 % what does it do, what does it look like
giuliomoro@1088 530 % limitations?
giuliomoro@1088 531 For troubleshooting and usage statistics purposes, information about the browser and the operating system is logged in the results XML file. This is especially useful in the case of remote tests, when it is not certain which operating system, browser and/or browser were used. Note that this information is not always available and/or accurate, e.g. when the subject has taken steps to be more anonymous, so it should be treated as a guide only.
giuliomoro@1088 532
giuliomoro@1088 533 Example:
giuliomoro@1088 534 \begin{lstlisting}
giuliomoro@1088 535 <navigator>
giuliomoro@1088 536 <platform>MacIntel</platform>
giuliomoro@1088 537 <vendor>Google Inc.</vendor>
giuliomoro@1088 538 <uagent>Mozilla/5.0 ... </uagent>
giuliomoro@1088 539 <screen innerHeight="1900px" innerWidth="1920px"/>
giuliomoro@1088 540 </navigator>
giuliomoro@1088 541 \end{lstlisting}
giuliomoro@1088 542
giuliomoro@1088 543 \subsection{Gain}
giuliomoro@1088 544 It is possible to set the gain (in decibel) applied to the different audioelements, as an attribute of the \texttt{audioelement} nodes in the configuration XML file:
giuliomoro@1088 545
giuliomoro@1088 546 \texttt{<audioElements url="sample-01.wav" gain="-6" id="sample01quieter" />}\\
giuliomoro@1088 547 Please note, there are no checks on this to detect if accidentaly typed in linear. This gain is applied \emph{after} any loudness normalisation.
giuliomoro@1088 548
giuliomoro@1088 549 \subsection{Loudness}
giuliomoro@1088 550 \label{sec:loudness}
giuliomoro@1088 551 % automatic loudness equalisation
giuliomoro@1088 552 % guide to loudness.js
giuliomoro@1088 553 Each audio fragment on loading has its loudness calculated. The tool uses the EBU R 128 recommendation following the ITU-R BS.1770-4 loduness calculations to return the integreated LUFS loudness. The attribute \texttt{loudness} will set the loudness from the scope it is applied in. Applying it in the \texttt{<setup>} node will set the loudness for all test pages. Applying it in the \texttt{<page>} node will set the loudness for that page. Applying it in the \texttt{<audioelement>} node will set the loudness for that fragment. The scope is set locally, so if there is a loudness on both the \texttt{<page>} and \texttt{<setup>} nodes, that test page will take the value associated with the \texttt{<page>}. The loudness attribute is set in LUFS
giuliomoro@1088 554
giuliomoro@1088 555 \subsection{Comment Boxes}
giuliomoro@1088 556 \label{sec:commentboxes}
giuliomoro@1088 557 There are two types of comment boxes which can be presented, those linked to the audio fragments on the page and those which pose a general question. The audio fragment boxes are shown by setting the attribute \texttt{showElementComments} to true of the page in question. This will then show a comment box below the main interface for every fragment on the page. There is some customisation around the text that accompanies the box, by default the text will read "Comment on fragment " followed by the fragment identifier (the number / letter shown by the interface). This 'prefix' can be modified using the page node \texttt{<commentboxprefix>}, see \ref{sec:page} for where to place this node in the document. The comment box prefix node takes no attribute and the text contained by the node represents to the prefix. For instance if we have a node \texttt{<commentboxprefix> Describe fragment </commentboxprefix>}, then the interface will show "Describe fragment " followed by the identifier.
giuliomoro@1088 558
giuliomoro@1088 559 The second type of comment box is slightly more complex because it can handle different types of response data. These are called comment questions because they are located in the comment section of the test but pose a specific question.
giuliomoro@1088 560
giuliomoro@1088 561 \clearpage
giuliomoro@1088 562
giuliomoro@1088 563
giuliomoro@1088 564 \section{Using the test create tool}
giuliomoro@1088 565 We provide a test creation tool, available in the directory test\_create. This tool is a self-contained web page, so doubling clicking will launch the page in your system default browser.
giuliomoro@1088 566
giuliomoro@1088 567 The test creation tool can help you build a simple test very quickly. By simply selecting your interface and clicking check-boxes you can build a test in minutes.
giuliomoro@1088 568
giuliomoro@1088 569 Include audio by dragging and dropping the stimuli you wish to include.
giuliomoro@1088 570
giuliomoro@1088 571 The tool examines your XML before exporting to ensure you do not export an invalid XML structure which would crash the test.
giuliomoro@1088 572
giuliomoro@1088 573 This guide will help you to construct your own interface on top of the WAET (Web Audio Evaluation Tool) engine. The WAET engine resides in the core.js file, this contains prototype objects to handle most of the test creation, operation and data collection. The interface simply has to link into this at the correct points.
giuliomoro@1088 574
giuliomoro@1088 575 \section{Building your own interface}
giuliomoro@1088 576
giuliomoro@1088 577 \subsection{Nodes to familiarise}
giuliomoro@1088 578 Core.js handles several very important nodes which you should become familiar with. The first is the Audio Engine, initialised and stored in variable `AudioEngineContext'. This handles the playback of the web audio nodes as well as storing the `AudioObjects'. The `AudioObjects' are custom nodes which hold the audio fragments for playback. These nodes also have a link to two interface objects, the comment box if enabled and the interface providing the ranking. On creation of an `AudioObject' the interface link will be nulled, it is up to the interface to link these correctly.
giuliomoro@1088 579
giuliomoro@1088 580 The specification document will be decoded and parsed into an object called `specification'. This will hold all of the specifications various nodes. The test pages and any pre/post test objects are processed by a test state which will proceed through the test when called to by the interface. Any checks (such as playback or movement checks) are to be completed by the interface before instructing the test state to proceed. The test state will call the interface on each page load with the page specification node.
giuliomoro@1088 581
giuliomoro@1088 582 \subsection{Modifying \texttt{core.js}}
giuliomoro@1088 583 Whilst there is very little code actually needed, you do need to instruct core.js to load your interface file when called for from a specification node. There is a function called `loadProjectSpecCallback' which handles the decoding of the specification and setting any external items (such as metric collection). At the very end of this function there is an if statement, add to this list with your interface string to link to the source. There is an example in there for both the APE and MUSHRA tests already included. Note: Any updates to core.js in future work will most likely overwrite your changes to this file, so remember to check your interface is still here after any update that interferes with core.js.
giuliomoro@1088 584 Any further files can be loaded here as well, such as css styling files. jQuery is already included.
giuliomoro@1088 585
giuliomoro@1088 586 \subsection{Building the Interface}
giuliomoro@1088 587 Your interface file will get loaded automatically when the `interface' attribute of the setup node matches the string in the `loadProjectSpecCallback' function. The following functions must be defined in your interface file.
giuliomoro@1088 588 \begin{itemize}
giuliomoro@1088 589 \item \texttt{loadInterface} - Called once when the document is parsed. This creates any necessary bindings, such as to the metric collection classes and any check commands. Here you can also start the structure for your test such as placing in any common nodes (such as the title and empty divs to drop content into later).
giuliomoro@1088 590 \item \texttt{loadTest(audioHolderObject)} - Called for each page load. The audioHolderObject contains a specification node holding effectively one of the audioHolder nodes.
giuliomoro@1088 591 \item \texttt{resizeWindow(event)} - Handle for any window resizing. Simply scale your interface accordingly. This function must be here, but can me an empty function call.
giuliomoro@1088 592 \end{itemize}
giuliomoro@1088 593
giuliomoro@1088 594 \subsubsection{loadInterface}
giuliomoro@1088 595 This function is called by the interface once the document has been parsed since some browsers may parse files asynchronously. The best method is simply to put `loadInterface()' at the top of your interface file, therefore when the JavaScript engine is ready the function is called.
giuliomoro@1088 596
giuliomoro@1088 597 By default the HTML file has an element with id ``topLevelBody'' where you can build your interface. Make sure you blank the contents of that object. This function is the perfect time to build any fixed items, such as the page title, session titles, interface buttons (Start, Stop, Submit) and any holding and structure elements for later on.
giuliomoro@1088 598
giuliomoro@1088 599 At the end of the function, insert these two function calls: testState.initialise() and testState.advanceState();. This will actually begin the test sequence, including the pre-test options (if any are included in the specification document).
giuliomoro@1088 600
giuliomoro@1088 601 \subsubsection{loadTest(audioHolderObject)}
giuliomoro@1088 602 This function is called on each new test page. It is this functions job to clear out the previous test and set up the new page. Use the function audioEngineContext.newTestPage(); to instruct the audio engine to prepare for a new page. ``audioEngineContext.audioObjects = [];'' will delete any audioObjects, interfaceContext.deleteCommentBoxes(); will delete any comment boxes and interfaceContext.deleteCommentQuestions(); will delete any extra comment boxes specified by commentQuestion nodes.
giuliomoro@1088 603
giuliomoro@1088 604 This function will need to instruct the audio engine to build each fragment. Just passing the constructor each element from the audioHolderObject will build the track, audioEngineContext.newTrack(element) (where element is the audioHolderObject audio element). This will return a reference to the constructed audioObject. Decoding of the audio will happen asynchronously.
giuliomoro@1088 605
giuliomoro@1088 606 You also need to link audioObject.interfaceDOM with your interface object for that audioObject. The interfaceDOM object has a few default methods. Firstly it must start disabled and become enabled once the audioObject has decoded the audio (function call: enable()). Next it must have a function exportXMLDOM(), this will return the xml node for your interface, however the default is for it to return a value node, with textContent equal to the normalised value. You can perform other functions, but our scripts may not work if something different is specified (as it will breach our results specifications). Finally it must also have a method getValue, which returns the normalised value.
giuliomoro@1088 607
giuliomoro@1088 608 It is also the job the interfaceDOM to call any metric collection functions necessary, however some functions may be better placed outside (for example, the APE interface uses drag and drop, therefore the best way was to call the metric functions from the dragEnd function, which is called when the interface object is dropped). Metrics based upon listening are handled by the audioObject. The interfaceDOM object must manage any movement metrics. For a list of valid metrics and their behaviours, look at the project specification document included in the repository/docs location. The same goes for any checks required when pressing the submit button, or any other method to proceed the test state.
giuliomoro@1088 609
giuliomoro@1088 610 \clearpage
giuliomoro@1088 611 \section{Analysis and diagnostics}
giuliomoro@1088 612 \subsection{In the browser}
giuliomoro@1088 613 See `analysis.html' in the main folder: immediate visualisation of (by default) all results in the `saves/' folder.
giuliomoro@1088 614
giuliomoro@1088 615 \subsection{Python scripts}
giuliomoro@1088 616 The package includes Python (2.7) scripts (in `scripts/') to extract ratings and comments, generate visualisations of ratings and timelines, and produce a fully fledged report.
giuliomoro@1088 617
giuliomoro@1088 618 Visualisation requires the free matplotlib toolbox (http://matplotlib.org), numpy and scipy.
giuliomoro@1088 619 By default, the scripts can be run from the `scripts' folder, with the result files in the `saves' folder (the default location where result XMLs are stored). Each script takes the XML file folder as an argument, along with other arguments in some cases.
giuliomoro@1088 620 Note: to avoid all kinds of problems, please avoid using spaces in file and folder names (this may work on some systems, but others don't like it).
giuliomoro@1088 621
giuliomoro@1088 622 \subsubsection{comment\_parser.py}
giuliomoro@1088 623 Extracts comments from the output XML files corresponding with the different subjects found in `saves/'. It creates a folder per `audioholder'/page it finds, and stores a CSV file with comments for every `audioelement'/fragment within these respective `audioholders'/pages. In this CSV file, every line corresponds with a subject/output XML file. Depending on the settings, the first column containing the name of the corresponding XML file can be omitted (for anonymisation).
giuliomoro@1088 624 Beware of Excel: sometimes the UTF-8 is not properly imported, leading to problems with special characters in the comments (particularly cumbersome for foreign languages).
giuliomoro@1088 625
giuliomoro@1088 626 \subsubsection{evaluation\_stats.py}
giuliomoro@1088 627 Shows a few statistics of tests in the `saves/' folder so far, mainly for checking for errors. Shows the number of files that are there, the audioholder IDs that were tested (and how many of each separate ID), the duration of each page, the duration of each complete test, the average duration per page, and the average duration in function of the page number.
giuliomoro@1088 628
giuliomoro@1088 629 \subsubsection{generate\_report.py}
giuliomoro@1088 630 Similar to `evaluation\_stats.py', but generates a PDF report based on the output files in the `saves/' folder - or any folder specified as command line argument. Uses pdflatex to write a LaTeX document, then convert to a PDF.
giuliomoro@1088 631
giuliomoro@1088 632 \subsubsection{score\_parser.py}
giuliomoro@1088 633 Extracts rating values from the XML to CSV - necessary for running visualisation of ratings. Creates the folder `saves/ratings/' if not yet created, to which it writes a separate file for every `audioholder'/page in any of the output XMLs it finds in `saves/'. Within each file, rows represent different subjects (output XML file names) and columns represent different `audioelements'/fragments.
giuliomoro@1088 634
giuliomoro@1088 635 \subsubsection{score\_plot.py}
giuliomoro@1088 636 Plots the ratings as stored in the CSVs created by score\_parser.py
giuliomoro@1088 637 Depending on the settings, it displays and/or saves (in `saves/ratings/') a boxplot, confidence interval plot, scatter plot, or a combination of the aforementioned.
giuliomoro@1088 638 Requires the free matplotlib library.
giuliomoro@1088 639 At this point, more than one subjects are needed for this script to work.
giuliomoro@1088 640
giuliomoro@1088 641 \subsubsection{timeline\_view\_movement.py}
giuliomoro@1088 642 Creates a timeline for every subject, for every `audioholder'/page, corresponding with any of the output XML files found in `saves/'. It shows the marker movements of the different fragments, along with when each fragment was played (red regions). Automatically takes fragment names, rating axis title, rating axis labels, and audioholder name from the XML file (if available).
giuliomoro@1088 643
giuliomoro@1088 644 \subsubsection{timeline\_view.py} % should be omitted or absorbed by the above soon
giuliomoro@1088 645 Creates a timeline for every subject, for every `audioholder'/page, corresponding with any of the output XML files found in `saves/'. It shows when and for how long the subject listened to each of the fragments.
giuliomoro@1088 646
giuliomoro@1088 647
giuliomoro@1088 648
giuliomoro@1088 649 \clearpage
giuliomoro@1088 650 \section{Troubleshooting} \label{sec:troubleshooting}
giuliomoro@1088 651 \subsection{Reporting bugs and requesting features}
giuliomoro@1088 652 Thanks to feedback from using the interface in experiments by the authors and others, many bugs have been caught and fatal crashes due to the interface seem to be a thing of the past entirely.
giuliomoro@1088 653
giuliomoro@1088 654 We continually develop this tool to fix issues and implement features useful to us or our user base. See \url{https://code.soundsoftware.ac.uk/projects/webaudioevaluationtool/issues} for a list of feature requests and bug reports, and their status.
giuliomoro@1088 655
giuliomoro@1088 656 Please contact the authors if you experience any bugs, if you would like additional functionality, if you spot any errors or gaps in the documentation, if you have questions about using the interface, or if you would like to give any feedback (even positive!) about the interface. We look forward to learning how the tool has (not) been useful to you.
giuliomoro@1088 657
giuliomoro@1088 658
giuliomoro@1088 659 \subsection{First aid}
giuliomoro@1088 660 Meanwhile, if things do go wrong or the test needs to be interrupted for whatever reason, all data is not lost. In a normal scenario, the test needs to be completed until the end (the final `Submit'), at which point the output XML is stored in the \texttt{saves/}. If this stage is not reached, open the JavaScript Console (see below for how to find it) and type
giuliomoro@1088 661
giuliomoro@1088 662 \texttt{createProjectSave()}
giuliomoro@1088 663
giuliomoro@1088 664 to present the result XML file on the client side, or
giuliomoro@1088 665
giuliomoro@1088 666 \texttt{createProjectSave(specification.projectReturn)}
giuliomoro@1088 667
giuliomoro@1088 668 to try to store it to the specified location, e.g. the `saves/' folder on the web server or the local machine (on failure the result XML should be presented directly in the web browser instead)
giuliomoro@1088 669
giuliomoro@1088 670 and hit enter. This will open a pop-up window with a hyperlink that reads `Save File'; click it and an XML file with results until that point should be stored in your download folder.
giuliomoro@1088 671
giuliomoro@1088 672 Alternatively, a lot of data can be read from the same console, in which the tool prints a lot of debug information. Specifically:
giuliomoro@1088 673 \begin{itemize}
giuliomoro@1088 674 \item the randomisation of pages and fragments are logged;
giuliomoro@1088 675 \item any time a slider is played, its ID and the time stamp (in seconds since the start of the test) are displayed;
giuliomoro@1088 676 \item any time a slider is dragged and dropped, the location where it is dropped including the time stamp are shown;
giuliomoro@1088 677 \item any comments and pre- or post-test questions and their answers are logged as well.
giuliomoro@1088 678 \end{itemize}
giuliomoro@1088 679
giuliomoro@1088 680 You can select all this and save into a text file, so that none of this data is lost. You may to choose to do this even when a test was successful as an extra precaution.
giuliomoro@1088 681
giuliomoro@1088 682 If you encounter any issue which you believe to be caused by any aspect of the tool, and/or which the documentation does not mention, please do let us know!
giuliomoro@1088 683
giuliomoro@1088 684 \subsubsection*{Opening the JavaScript Console}
giuliomoro@1088 685 \begin{itemize}
giuliomoro@1088 686 \item In Google Chrome, the JavaScript Console can be found in \textbf{View$>$Developer$>$JavaScript Console}, or via the keyboard shortcut Cmd + Alt + J (Mac OS X).
giuliomoro@1088 687 \item In Safari, the JavaScript Console can be found in \textbf{Develop$>$Show Error Console}, or via the keyboard shortcut Cmd + Alt + C (Mac OS X). Note that for the Developer menu to be visible, you have to go to Preferences (Cmd + ,) and enable `Show Develop menu in menu bar' in the `Advanced' tab. \textbf{Note that as long as the Developer menu is not visible, nothing is logged to the console, i.e. you will only be able to see diagnostic information from when you switched on the Developer tools onwards.}
giuliomoro@1088 688 \item In Firefox, go to \textbf{Tools$>$Web Developer$>$Web Console}, or hit Cmd + Alt + K.
giuliomoro@1088 689 \end{itemize}
giuliomoro@1088 690
giuliomoro@1088 691 \subsection{Known issues and limitations}
giuliomoro@1088 692 \label{sec:knownissues}
giuliomoro@1088 693
giuliomoro@1088 694 The following is a non-exhaustive list of problems and limitations you may experience using this tool, due to not being supported yet by us, or by the Web Audio API and/or (some) browsers.
giuliomoro@1088 695
giuliomoro@1088 696 \begin{itemize}
giuliomoro@1088 697 \item Issue \href{https://code.soundsoftware.ac.uk/issues/1463}{\textbf{\#1463}}: \textbf{Firefox} only supports 8 bit and 16 bit WAV files. Pending automatic requantisation (which deteriorates the audio signal's dynamic range to some extent), WAV format stimuli need to adhere to these limitations in order for the test to be compatible with Firefox.
giuliomoro@1088 698 \item Issues \href{https://code.soundsoftware.ac.uk/issues/1474}{\textbf{\#1474}} and \href{https://code.soundsoftware.ac.uk/issues/1462}{\textbf{\#1462}}: On occasions, audio is not working - or only a continuous `beep' can be heard - notably in \textbf{Safari}. Refreshing, quitting the browser and even enabling Developer tools in Safari's Preferences pane (`Advanced' tab: ``Show `Develop' menu in menu bar'') has helped resolve this. If no (high quality) audio can be heard, make sure your entire playback system's settings are all correct.
giuliomoro@1088 699 \end{itemize}
giuliomoro@1088 700
giuliomoro@1088 701 \clearpage
giuliomoro@1088 702 \bibliographystyle{ieeetr}
giuliomoro@1088 703 \bibliography{Instructions}{}
giuliomoro@1088 704
giuliomoro@1088 705
giuliomoro@1088 706 \clearpage
giuliomoro@1088 707 \appendix
giuliomoro@1088 708
giuliomoro@1088 709 \section{Legacy}
giuliomoro@1088 710 The APE interface and most of the functionality of the first WAET editions are inspired by the APE toolbox for MATLAB \cite{ape}. See \url{https://code.soundsoftware.ac.uk/projects/ape} for the source code and \url{http://brechtdeman.com/publications/aes136.pdf} for the corresponding paper.
giuliomoro@1088 711
giuliomoro@1088 712 \clearpage
giuliomoro@1088 713
giuliomoro@1088 714 \section{Listening test instructions example}
giuliomoro@1088 715
giuliomoro@1088 716 Before each test, show the instructions below or similar and make sure it is available to the subject throughout the test. Make sure to ask whether the participant has any questions upon seeing and/or reading the instructions.
giuliomoro@1088 717
giuliomoro@1088 718 \begin{itemize}
giuliomoro@1088 719 \item You will be asked for your name (``John Smith'') and location (room identifier).
giuliomoro@1088 720 \item An interface will appear, where you are asked to
giuliomoro@1088 721 \begin{itemize}
giuliomoro@1088 722 \item click green markers to play the different mixes;
giuliomoro@1088 723 \item drag the markers on a scale to reflect your preference for the mixes;
giuliomoro@1088 724 \item comment on these mixes, using text boxes with corresponding numbers (in your \textbf{native language});
giuliomoro@1088 725 \item optionally comment on all mixes together, or on the song, in `General comments'.
giuliomoro@1088 726 \end{itemize}
giuliomoro@1088 727 \item You are asked for your personal, honest opinion. Feel free to use the full range of the scale to convey your opinion of the various mixes. Don?t be afraid to be harsh and direct.
giuliomoro@1088 728 \item The markers appear at random positions at first (which means some markers may hide behind others).
giuliomoro@1088 729 \item The interface can take a few seconds to start playback, but switching between mixes should be instantaneous.
giuliomoro@1088 730 \item This is a research experiment, so please forgive us if things go wrong. Let us know immediately and we will fix it or restart the test.
giuliomoro@1088 731 \item When the test is finished (after all songs have been evaluated), just call the experimenter, do NOT close the window.
giuliomoro@1088 732 \item After the test, please fill out our survey about your background, experience and feedback on the test.
giuliomoro@1088 733 \item By participating, you consent to us using all collected data for research. Unless asked explicitly, all data will be anonymised when shared.
giuliomoro@1088 734 \end{itemize}
giuliomoro@1088 735
giuliomoro@1088 736 \clearpage
giuliomoro@1088 737
giuliomoro@1088 738 \section{Terminology} % just to keep track of what exactly we call things. Don't use terms that are too different, to avoid confusion.
giuliomoro@1088 739 As a guide to better understand the Instructions, and to expand them later, here is a list of terms that may be unclear or ambiguous unless properly defined.
giuliomoro@1088 740 \begin{description}
giuliomoro@1088 741 \item[Subject] The word we use for a participant, user, ... of the test, i.e. not the experimenter who designs the test but the person who evaluates the audio under test as part of an experiment (or the preparation of one).
giuliomoro@1088 742 \item[User] The person who uses the tool to configure, run and analyse the test - i.e. the experimenter, most likely a researcher - or at least
giuliomoro@1088 743 \item[Page] A screen in a test; corresponds with an \texttt{audioholder}
giuliomoro@1088 744 \item[Fragment] An element, stimulus or sample in a test; corresponds with an \texttt{audioelement}
giuliomoro@1088 745 \item[Test] A complete test which can consist of several pages; corresponds with an entire configuration XML file
giuliomoro@1088 746 \item[Configuration XML file] The XML file containing the necessary information on interface, samples, survey questions, configurations, ... which the JavaScript modules read to produce the desired test.
giuliomoro@1088 747 \item[Results XML file] The output of a successful test, including ratings, comments, survey responses, timing information, and the complete configuration XML file with which the test was generated in the first place.
giuliomoro@1088 748 \end{description}
giuliomoro@1088 749
giuliomoro@1088 750 \clearpage
giuliomoro@1088 751
giuliomoro@1088 752 \setcounter{secnumdepth}{0} % don't number this last bit
giuliomoro@1088 753 \section{Contact details} % maybe add web pages, Twitter accounts, whatever you like
giuliomoro@1088 754 \label{sec:contact}
giuliomoro@1088 755
giuliomoro@1088 756 \begin{itemize}
giuliomoro@1088 757 \item Nicholas Jillings: \texttt{nicholas.jillings@mail.bcu.ac.uk}
giuliomoro@1088 758 \item Brecht De Man: \texttt{b.deman@qmul.ac.uk}
giuliomoro@1088 759 \item David Moffat: \texttt{d.j.moffat@qmul.ac.uk}
giuliomoro@1088 760 \end{itemize}
giuliomoro@1088 761
giuliomoro@1088 762 \end{document}