Sam Wray & Tim Pietrusky

Part 1: Sam

Game Boy music

Web Audio API

Analysing Sound

let source = 
  context.createMediaElementSource(audio);
let context = new AudioContext();
let audio = new Audio();

Source

Destination

source.connect(
  context.destination
);

Source

Destination

Analyser

let analyser = 
  context.createAnalyser();

source.connect(analyser);

Meyda

RMS

Energy

ZCR

Amplitude Spectrum

Power Spectrum

Spectral Centroid

Spectral Flatness

Spectral Slope

Spectral Rolloff

Spectral Spread

Loudness

Perseptual Spread

Perceptual Sharpness

Mel-Freq Cepstral Coeffic.

Spectral Skewness

Spectral Kurtosis

Meyda

ZCR

RMS

Canvas 2D

Three.JS

WebGL

WebGL

OpenGL Shader Language (GLSL)

Modules

Part 2: Tim

MIDI

Musical Instrument Digital Interface

Web MIDI API

navigator.requestMIDIAccess();
MIDIMessageEvent

LED Curtain

8 x LED Strips

FadeCandy

Raspberry PI 3

WIFI

[
   255, 0, 0  /* 1. LED */
];
[
   255, 0, 0, /* 1. LED */
   0, 255, 0  /* 2. LED */
];

FadeCandy to LED

1.

2.

DMX512

Fir0002/Flagstaffotos

DMX Universe

Sender

Device 2

Device 1

Device n

DMX USB Interface

2 x PAR Lights

Bubble Machine

USB

{  /* Address: 1 */
   0: 255, 1: 0, 2: 0          
};
{  /* Address: 1 */
   0: 255, 1: 0, 2: 0,
   /* Address: 4 */
   3: 0, 4: 255, 5: 0         
};
{  /* Address: 1 */
   0: 255, 1: 0, 2: 0,
   /* Address: 4 */
   3: 0, 4: 255, 5: 0, 
   /* Address: 16 */
   15: 255, 16: 255       
};

Part 3: 🤓 + 🤓

Hack Weekend

 + Web MIDI

 + Grab Canvas Data

 + Control LED / DMX

livejs.network

The End.

 @livejs_network

LiveJS : FrankenJS 2017

By Tim Pietrusky

Made with Slides.com

LiveJS : FrankenJS 2017

  • 2,218

More from Tim Pietrusky