Turn your browser into a synthesizer with Flora Drift

Designer Luke Twyman (opens in new tab) likes to create new and exciting things for the web. And his latest venture is no exception. Making use of the Web Audio API, Flora Drift (opens in new tab) procedurally generates music and visuals, effectively turning your browser into a real-time sythesizer.

"Flora Drift originally started as a 48 hour challenge I set myself, to come up with some kind of web-based generative project. I'd been keen to do another music-based project and had been meaning to get to know the Web Audio API. The freedom to create synth audio right in the browser really appeals to me."

Flora Drift procedurally generates music and visuals

Flora Drift procedurally generates music and visuals

After the 48-hour period, Twyman had something he wanted to continue working on. "It took about two weeks to get it to the stage I wanted," he says. "There was a lot of tweaking to the generation of both the music and the visuals to try and get what felt like the right balance between random variation and aesthetics.

"The mood of it was important to me, I wanted to create a still remoteness but make the plants feel alive, I spent a lot of time working on the desaturated colour palettes and synth sounds to create the right ambient feel. I wanted to make the interaction feel rewarding without it dominating the mood or experience.

I spent a lot of time working on the colour palettes and synth sounds to create the right ambient feel

"Creating a good balance between all the sounds was a challenge, and as there are sometimes so many sounds happening at once I often found I was meeting the limits of the Web Audio. I had to put a lot of thought into managing the oscillators and make sure they're being removed as soon as they've finished playing."

Thank you for reading 5 articles this month* Join now for unlimited access

Enjoy your first month for just £1 / $1 / €1

*Read 5 free articles per month without a subscription

Join now for unlimited access

Try first month for just £1 / $1 / €1

Kerrie Hughes is Editor at Creative Bloq. One of the original CB crew, Kerrie joined the team back in 2013 after moving from her role as staff writer on 3D World. Since then she's written regularly for other creative publications. Kerrie's work for Creative Bloq involves managing the team and the site's content, developing and maintaining commercial partnerships, and finding innovative ways to bring Creative Bloq's audience the content they're looking for.