The Technology Behind Google's Moog Synth Doodle

Google is using modern web tools to recreate the legendary synth in the browser

Google has once again outdone itself with a fully working replica of the famed Moog synthesizer built right into the homepage. Celebrating the birthday of Robert Moog, the inventor of the instrument of the same name, Google set out to highlight his creation in the best way possible, by building one online.

What you get is a simplified version of the Moog synth, but one that has all the basics. Three oscillators each with several waveforms to choose from, a filter and an envelope module. Plus, a full working 24-key keyboard.

"When people hear the word 'synthesizer' they often think 'synthetic'—fake, manufactured, unnatural. In contrast, Bob Moog’s synthesizers produce beautiful, organic and rich sounds that are, nearly 50 years later, regarded by many professional musicians as the epitome of an electronic instrument," Google explained.

"'Synthesizer,' it turns out, refers to the synthesis embedded in Moog’s instruments: a network of electronic components working together to create a whole greater than the sum of the parts," it added.

You can go straight to the Google homepage and start playing. The doodle will be there for a day, but it will become available at the Google Doodles website once it's removed from the homepage.

You can tweak the synthesizer to get the exact sound you want and then record your audio doodle with the four-track recorder. You'll be able to layer your sounds to create something resembling a song.

Putting together the doodle wasn't an easy task, but it's a testament of what the web can do. In Google Chrome, the audio is generated and processed via the native Web Audio API, otherwise the Flash backend is used in Firefox and everything else.

Google used a healthy helping of JavaScript and CSS3 in the doodle as well as some of its own tools, the Closure libraries, as well as its own APIs and technologies, the Google Web Fonts – for the fonts obviously, the Google+ API and the Google URL shortener – for sharing, and App Engine to host and run the app.

Hot right now  ·  Latest news

1 Comment