ZEN Player

ZEN is a demo of a single-song HTML5 Audio Player. It’s powered by jPlayer, styled and mostly animated with CSS3.

I’m really happy how the little details turned out. Like how it morphs from a circle to a square button and the swirl at the beginning. Also that it starts out simple and transforms into fancy pants only when needed.

Credits: Thanks to @maboa and @quinnirill for some JS help. Song from Every Day by Girl Talk.

See the demo.

Source on GitHub.

Note: This is just an experiment and hasn’t been tested enough to be used as a real player. Also, the song is hard coded and would need to be made more dynamic. Use at your own risk. ;-)