SmartWeb 2016 - Ruth John

on YouTube ↗30m

" summary

MIDI is a data protocol not sound: three-byte messages (first byte = note on/note off, second = note number like 60 = middle C, third = velocity) that the browser can read via the Web MIDI API (Chrome today). Demos include a live keyboard-to-browser URL, emoji-mapped notes, a crowdsourced step sequencer, and 3,000 launch pads used on a website. Related tools: Web Audio API (oscillators, buffers), MediaRecorder, Tone.js for timing, Bluetooth LE MIDI and the Web Bluetooth flagged API.

AI-written summary · about

" chapters (15)

1. 0:00Introduction
2. 2:30MIDI
3. 4:19Data
4. 7:36Keyboard API
5. 9:10Audio API
6. 10:14Oscillator
7. 11:34Media Recorder
8. 12:48Instruments
9. 15:13Affordable hardware
10. 16:35Step sequencer
11. 17:40Timing
12. 19:50Connectors
13. 22:20MIDI Show Control
14. 25:03Practical Uses
15. 28:01Specifications

" related talks

• 23mLet's talk about MIDIRuth John · RuhrJS 2016
• 29mMIDI A New Dimension in Controlling Your BrowserArmagan Amcalar · You Gotta Love Frontend 2019
• 26mLearning to Read Music with the Web MIDI APIJan Kleinert, Ryan Jarvinen · Node+JS Interactive 2019
• 44mBeats in the Browser - Coding Music with JavaScriptRowdy Rabouw · NDC Sydney 2024
• 26mBeats in the Browser - Coding Music with JavaScriptRowdy Rabouw · JSDayIE 2023
• 44mTiny Computers, JavaScript and MIDIGeorge Mandis · JSFoo 2017
• 33mWe ❤ Music & the WebMartin Schuhfuss, Tim Pietrusky · JSConf Budapest 2016
• 40mBeats in the Browser - Coding Music with JavaScriptRowdy Rabouw · Copenhagen Developers Festival 2023