screen-instrument

A class for quickly building screen-based musical instruments on the web.

Work in progress -- only used in a couple of projects so far. This library is not well documented, and probably not fit for public use just yet. Explore at your own risk!

To see this library in action, please see the Sound Ideas project page.

What this does

This class describes an object that can be used to create a screen-based musical instrument. It can be used to create a keyboard, a guitar, or any other instrument that can be represented as a grid of notes.

A corresponding layer of buttons is placed in a separate container for screen reader access.

Dependencies

• Currently relies on Tone.js for sound generation.

• Chord library by @tombatossals -- this seems to push the size of the package up quite a bit, so I may remove it in the future.

and some of my own packages currently in development:

• multitouch-mapper (or touch-pickup, name tbd)
• keyboard-mapper
• midi-mapper
• status-vo (screenreader access)

Instructions

Temporary -- currently troubleshooting! This project is forcing me to learn how to use npm and webpack. As a result I'm fighting with / refactoring some old habits...

import { ScreenInstrument } from '@matthewscharles/screen-instrument'

I suggest importing the ScreenInstrument class as Instrument, as this will be the name of the class in the future. Except this doesn't seem to work, currently:

import { Instrument } from '@matthewscharles/screen-instrument'

or, if using the standalone version in the dist folder:

window.Instrument = ScreenInstrument.ScreenInstrument;

Then, create a new instance of the class:

var instrument = new Instrument(noteArray, document.querySelector('#instrument__underlay'), false, 'instrument', {}, false, false);

Arguments:

• noteArray: an array of note objects.
• container: the container element for the screen reader accessible layer.
• presetName (optional): the name of a preset to load.
• instrumentName: the name of the instance in case needed for reference later.
• soundLibrary: a dictionary of preset names and associated filenames (using samples for now)
• actuator: 'synth' or 'player' (defaults to synth)
• drone: boolean, used in cases where fixed notes are faded rather than definite on/off

Yes, this is definitely a work in progress.

Proper instructions in a future version!

Credits

Guitar sound: [https://freesound.org/people/Kyster/packs/7398/](Notes on nylon strings by Kyster) -- released under the CC attribution license

Charles Matthews 2023