Interactive Animated Score, a proof of concept

Inspired by the brilliant videos of Stephen Malinowski on his YouTube channel i decided to make an interactive version of such an animated score.

Tho still in an early stage, you can see a proof of concept overhere:

http://abumarkub.net/animated-score/

I used a midi file from piano-midi.de and exported it into a mp3 file. Then i parsed the same midifile to an XML file with a small Java program that i wrote. Flash reads in this XML file and plots the notes to stage. The position of the plotted notes is conducted by the position of the mp3 version of the song.

It is still a proof of concept: the performance has to be improved and the animation could be somewhat more spectacular.

Java and Actionscript code will be available soon.

Update 010111: i have added note info popups and a color scheme per track.

2 Responses to “Interactive Animated Score, a proof of concept”


  • Hey – thanks for the great work.
    Nicely writeen also –
    I have a couple of questions as I am trying to develop something similar myself.

    One thing I am puzzled with is:
    “I used a midi file from piano-midi.de and exported it into a mp3 file”

    Why have you done this, is it necessary?

    • Thanks for your kind words!

      I have rendered the midi file with Pianoteq on beforehand because i wanted a mature piano sound so i did not want to rely on the synthesizer on the end users computer. In other words: Flash ‘plays’ the midi file visually only.

      However, this can be easily changed. You could play the midi file in the Java applet, and visualize it at the same time in Flash.

Comments are currently closed.