A simple frontend for proto-voice annotations written in Purescript.
To install the tool dependencies, run
$ npm install
in the main directory. Alternatively, you can use your global installations of these tools.
For a development build, run
$ npm run build
then open dev/index.html
.
For a production build, run
$ npm run build-prod
then open prod/index.html
.
For live-reloading on changes to the code, run
$ npm run serve
This will automatically open the app in a browser, and recompile and reload the page every time a source file is changed.
The annotation tool is used to create and modify protovoice analyses. The general procedure is as follows:
- Load a piece (MusicXML or custom
.piece.json
format) or an existing analysis (.analysis.json
). - Analyze the piece by "reducing" it:
- Reduce a slices and transitions step by step.
- Link notes to their parents to indicate their function.
- (optional) Add style information to highlight particular elements of the analysis.
- Download the analysis to your computer or generate an SVG graph.
The viewer can be used to display an analysis and walk through it step by step. You can also select individual notes to see how they are linked to other notes.
To quickly view and explore an analysis, you can use the viewer demo page. However, you can also use the viewer to create embedded interactive visualizations using Javascript. Check the demo page to get an idea how this works. Another example is the repository of protovoice analyses which automatically generates such a page for each analysis.