Happyworm
design and applications for inspiring web solutions
jPlayer
see it in action
JPlayer is a jQuery plugin we developed that allows web developers to create a 100% CSS styleable audio player. JPlayer can use HTML 5 audio if the users browser supports it, if not it can fallback on Flash to play the audio. Note that no visible Flash is present.
Happyworm also created the jPlayer site and supporting demos.
In the week that jPlayer was released the website saw over 20,000 visits and nearly 50,000 pageviews and was the subject of vigorous debate on the popular discussion site reddit.com. It was the subject numerous blog posts and featured in the official jQuery blog. (see trackbacks above).
Since release in May we have fostered an online community and made five subsequent releases. To date jPlayer has been downloaded over 4,000 times and used on hundreds of websites.
What we did :
- Plugin concept, research and development
- Branding
- JPlayer website design
- Web marketing and licensing
- Discussion site and support
Technologies used :
- JavaScript
- jQuery
- jQueryUI
- Flash
- HTML 5 audio
- XHTML 1.0 + CSS
The Challenge
We needed a CSS styleable audio player for a site we planned to develop, preferably that could integrate with our JavaScript framework of choice jQuery. There didn't seem to be anything about that fitted the bill at the time. So we set about creating our own. Using our combined Flash and JavaScript expertise we were able to create a jQuery plugin that worked across all browsers. We decided to release our effort as open source software under the MIT License and encourage community involvement so that we could develop a better product.
Further enhancements included comptability with the Ogg Vorbis file format and the exploitation of HTML 5 audio meaning that the Flash plugin was no longer required in many of the latest browsers.
We also created a series of demos and have added to these to demonstrate and showcase the latest features such as HTML 5, Ogg Vorbis and jQueryUI Themeroller compatability.
Happyworm used their web audio experience to write an article for the popular HTML5Doctor site and continue to be at the forefront of web audio technology.