Utterance

Utterance

Converting utterances into text, words into letters which break apart as they collide. This is a small experiment built using the Chrome implementation of the Web speech API and canvas.

Phrases returned from the API are parsed into characters. Each characters' metrics are calculated and used to generate a physical entity/primitive using a JavaScript port of the box2d physics engine. These primitives are then arranged in word order and left tumble under gravity.

Rendering is handled by the awesome pixi.js. It uses WebGL by default and is also setup to handle retina pixel density.

Live Demo

The live demo is best viewed in Desktop Chrome. You'll need to allow access to the microphone when prompted. Source code can be found in my chrome sketches repository.

Utterance
Utterance
Utterance
Utterance
Utterance