https://smilermusic.com/alliknow

On the 29th February Smiler released an incredible free mixtape. To maximise the spread of the mixtape I built an embedable widget.

The key purpose of the mixtape was to increase Smiler’s followers on Twitter and Likes on his Facebook page, so the first thing the widget needed to include was a Facebook like button (linked to his fan page) and a Twitter Follow Button.

The widget also includes sharing buttons to like and tweet a link to the widget itself. I included an embed button that launches a lightbox with the embed code ready to be copied for use on blogs and websites. The Like and Tweet buttons both have counters so I decided to add a counter to the embed button too. I stored the number of clicks it gets by making an ajax request to a php script that posts to a MySQL database. I used the same method to retrieve the embed count when the widget is loaded.

To streamline my workflow I gave the widget a responsive design, allowing the elements to fit snugly whether the page is viewed as an embedded iframe, full page site or a mobile site. The packshot adjusts to fill the available space while the countdown and sharing buttons fit neatly alongside or above and below the image.

The plan to release the mixtape at 2pm on the dot meant that the widget would have to display the player and download links when the timer reached zero. I modified Soundcloud’s Premiere App to build a beautiful player that would replace the packshot when the countdown ended.

When the time came, the mix tape launched on a wave of twitter and facebook activity, while the embed code allowed loads of blogs to easily add the entire widget with the soundcloud player, direct download link and sharing functionality.