Akko Music Visualisation Framework

Published on October 14, 2017 under Projects

It's a life-long dream of mine to invent a robust yet accessible music visualisation framework. I've tried a bunch of times in the past using Java (ActiveVisualiser, Envision) but the solutions were very obviously imperfect: first of all, I had no idea what I was doing, and secondly, they were written in Java.

As we all know, browsers are becoming more and more powerful every day with Web Audio API and WebGL being some of the cool additions. Seeing how perfectly these 2 technologies could work together I decided to combine them to produce yet another music visualisation framework, while eliminating 2 major flaws of previous implementations:

With this mind, I made Akko (GitHub repository, online demos).

Introducing Akko

Akko Music Visualising Framework

Akko is a JavaScript music visualisation framework that runs in your browser. It uses Web Audio API and WebGL to provide play music and render 2D or 3D graphics in to the browser window.

Akko exposes a set of APIs that allow you to implement a visualiser, ranging from simple 2D graphics to complex 3D compositions with shadows and shaders. Below you can see a screenshot from a simple visualiser implemented in 45 lines of JS (with proper whitespace). The picture is clickable, in case you want to see the visualiser in action.

Akko custom visualiser example.

As usual, you can find more information on Akko's GitHub page. Check out some online demos, but keep in mind that Akko provides the framework for visualisation - how cool the visualisation looks is up to the author.


End of Article

Timur Kuzhagaliyev Author

I'm a computer science graduate from UCL & Caltech, working as a systems engineer at Jump Trading. Before Jump, I was doing computer vision for Video Quality Analysis team at Amazon.