Stooshe’s music video for ‘Love Me’ got a lot of attention when it launched. We encouraged a lot more traffic to the video with a link sharing competition.

Fans could generate a unique link to the video and earn points for every click their link receives. The fan at the top of the leaderboard won tickets to see Stooshe live with Labrinth in London. 9 runners-up would all receive a signed copy of the StooshTape on CD.

Having run similar campaigns for All the Young and Clement Marfo & The Frontline, I had a solid template to work from. It didn’t take me long to set the competition up and launch it as a Facebook tab.

The system includes an admin panel allowing us to monitor total clicks and unique clicks for each entrant as well as retrieving their details to contact the winners.

The competition did incredibly well driving thousands of clicks and YouTube views.

The music video for ‘Bada Bing’ launched as a ‘like to view’ tab on Benny Banks’ Facebook page.

Building on the design by Kate Brighouse I used the same set-up as the holding page to insert a jQuery countdown timer styled with @font-face.

A few minutes before the launch time I set an unlisted YouTube video to be embedded and played as soon as the countdown hit 0.

The tab also included sharing functionality to promote the video across social networks.

To hype up the anticipation for the release of the ‘Bada Bing’ video I built a holding page counting down to the second the video would go live.

I used Keith Wood’s jQuery Countdown plugin to render a timer. The script was very easy to use and the additional settings made it easy to style and configure. The timezone setting allowed me to specify that the countdown should end at 11am UK time rather than the visitor’s timezone.

By using @font-face, I was able to render all links and even the numbers in the timer with the same fonts used on the single artwork.

The video premiered on a ‘like to view’ Facebook tab. So at 11am on Fri 13th Jan the countdown was switched with a message and link to watch the video on Benny Banks’ Facebook page. After the premier finished I embedded the video directly into the holding page.

We wanted to engage Clement Marfo & The Frontline fans and get them to spread the new video for Mayhem (feat. Kano) like wildfire.

I took the link sharing system I’d built for All the Young and made some major improvements. To start with I created a setup file and optimised the app to make it more templated. Now all the text, links, sharing optimisation, competition details and php functions only need to be defined once for the entire app.

We wanted to reward the fans with the links that genuinely get the most clicks, so I added functionality to count unique clicks separately. The leaderboard ranks users based on their unique clicks but the total activity on their link is still recorded and accessible through the admin section of the app.

I built an admin section that allows us to view all link activity, user details and the total number of clicks that the campaign has generated. This section is password protected to ensure that the results are secure.

To improve the app further I integrated bit.ly url shortening to automatically generate a short url for each fan that signs up.

The app was created to run as a Facebook tab so sharing had to be optimised for Facebook sharing. Each user’s unique link is bundled with personalised sharing meta tags. So posting someone’s url will share a link with a title and description explaining that you can help them win the tickets by simply clicking on the link.

I’ve recently had a go at really ‘cheating the system’ by manipulating some photos to remove distracting elements as well as combining the best elements of different pictures.

The first photo on the left was taken at a skate park on Venice Beach in L.A. While I was really chuffed to get the timing right for this photograph, it bothered me that the two people in the background were distracting and detracted from the distance between that skater’s feet and his board. So using a combination of Photoshop tools I removed the people. I primarily used the clone tool, deleted layers witha very soft eraser and a little bit of Photoshop’s new content-aware fill to remove the people and replace them with the beach, ocean and concrete. A large portion of the concrete was covered so I had to make that up with portions of concrete from other parts of the photo.

The second and third photos I edited were taken over Christmas in Scotland. Trying to freeze active children is quite a challenge, so I got into a habit of taking numerous photos and hoping for the best. In both the examples on the left I had two images of the same scene. Unfortunately neither image was right on its own – someone in focus in one photograph would be blurry in another. So I combined them to get the photograph I was hoping for in the first place.

While I’m pleased enough with the results, I doubt these edits would pass any forensic analysis. I’d rather just capture the image I want in the first place, but it is nice to know that all is not lost if the shot isn’t perfect.

On the 8th October All the Young played a momentous headline gig at the Kings Hall in their home town of Stoke on Trent.

Two weeks before Christmas, I was given the task of releasing a free live album of the show in an innovative and exciting way – before Christmas!

With the time limitations it was obvious that I’d have to build the project myself and needing an instant delivery mechanism led me down the path of HTML5 web apps.

This was my first attempt at proper HTML5 development and I had a lot to learn about web apps too.

I got to work using the jQuery Mobile framework which makes mobile web development a lot easier.

Knowing that a lot of people would also view this site on a desktop, I had to make a number of css rules to keep everything in check. CSS media queries made the site a responsive web design, adjusting to the screen size and adjusting all the elements for the best view on a smartphone, tablet or desktop.

To make the app operate like a native iOS app I added a fixed iPhone style navigation to the bottom of the site. This also resizes depending on the size of the visitor’s device.

The music section is powered by Soundcloud and Matas’ classic custom jquery soundcloud player. I added a loading message that waits for the player to load before displaying it and styled the player to suit the band’s style.

I found an amazing plugin to power the photo gallery. Photoswipe makes it a synch to add a full screen gallery with touch-powered sliding navigation. The default setting has 3 thumbnails across the width of the page which didn’t look great on an iPad or desktop screen. So I used css media queries to adjust the thumbnail size and order as your screen size increases. An iPhone displays 3 thumbnails wide, an iPad displays 4 in portrait mode and 5 in landscape. Desktops also adjust responsively depending on the use’s screen size.

The videos section displays YouTube videos with the iFrame embed method to allow mobile playback. I wrote a lot of custom Javascript and CSS to display this page. The size of the embedded videos adjusts according to the user’s screen size, so they always fill as much space as possible.

The app uses Font Face to render all text in the band’s font. Including the headings, buttons and the liner notes.

I included a send page that allows fans to share the app with friends via email or social networks. It also allows them to sign-up and receive a direct download link for the mp3s.

The responsive design meant that all the sections could be optimised for the best view on different sized devices. Desktops with large monitors or tablet devices display content side-by-side in columns. Smaller devices will stack the content, so that the page only scrolls up and down.

One of the big challenges I set myself for this project was offline storage. The app uses the cache manifest method to store core files offline. The audio and video need to be streamed so offline browsing presents the user with a fallback message.

If users add the app to their home screen it will run full screen like a native app. I used the ‘add to homescreen’ script to display a pop-up message the first time iPhone or iPad users visit the web app.

Finally I had to simplify the app for visitors with old browsers or incompatible devices. I created a very basic page that allows visitors to sign-up and have the download links sent to them. The site detects whether the app will display correctly and only loads it if all requirements are met.

All the Young sent the web app to core fans on Christmas day and had a brilliant response. There are now plans to use the app and content in a much more widespread rollout.

While building the app so quickly was stressful, it was a good crash course in HTML5 and web app development. I learnt a lot in a short space of time and it certainly piqued my interest in doing more advanced web apps in the future.

Tawiah released a brilliant EP as a free download over the 2011 festive season. The ‘holiday gift’ features her new song ‘Run’, along with a remix, acapella version, a song called ‘Don’t Know You Yet’ and a powerful version of ‘Little Drummer Boy’.

To give the EP widespread reach I made an email sign-up widget, optimised for sharing on social networks and easily embedable on blogs and websites.

Having built many free download widgets over the past year I’ve always wanted to streamline the process with a more templated system. I used the ‘Run EP’ widget to start working on a dynamic system that remains quite flexible.

All the free download details are stored in a MySQL Database where the widget is assigned an ID. All image assets, mailing list information, text and meta data for sharing is then loaded and displayed dynamically when the widget is viewed.

The widget is mobile-friendly, providing an iFrame embed code to easily add it to blogs and websites.

To enhance Facebook sharing I built a Flash version of the widget that accesses all the data from an xml feed. This means that users can sign-up for the free download and share it without leaving their Facebook news feed.

I have a fair bit of work to do on the CMS as well as adding more flexible options, but this widget has helped me lay a lot of the foundation for a really powerful and easy to use system. Stay tuned.

To help increase Facebook activity for Paper Crows we created a ‘Like to Download’ Facebook tab giving fans access to the B-Side ‘Gone’.

Kate Brighouse designed the tab using stills from the online video for ‘Cloudbusting’. I put the PHP, HTML, CSS and Javascript together to create the ‘like to view’ functionality.

The tab includes a Like button on the page that is only displayed to non-fans. Once clicked the page refreshes to reveal the download link.

While Fenech-Soler were on tour with Example they handed out wristbands with a url printed on them. Visiting fenechsoler.co.uk/freedownload allows fans to get a free download of ‘Golden Sun’. There were a few aspects to cover considering that a lot of people would access the url from their mobile phones.

The band’s management wanted to drive more Facebook activity without limiting it to Facebook fans. I made the URL redirect to a Facebook tab, but only if Javascript is enabled. If Javascript isn’t enabled the visitor is presented with a sign-up form where they can join the mailing list and have the mp3 emailed to them. If it is enabled they are redirected to a Facebook tab.

The Facebook tab is fairly basic ‘like to download’ functionality, with an inline like button that refreshes the page to reveal the link once clicked. The tab includes a jQuery drop-down that displays a sign-up form for fans that don’t want to use their Facebook account. They can join the mailing list and have ‘Golden Sun’ emailed to them instead.

At the end of November 2011 Warner Bros released a special edition version of Hugh Laurie’s debut album, ‘Let them Talk’. In addition to the three new studio recordings, we wanted to deliver a special deluxe digital product. With this in mind we created a bespoke iTunes LP, loaded with additional content.

I sourced plenty of content including new photographs, unreleased video and additional writing by both Hugh Laurie and his acclaimed producer Joe Henry.

The iTunes LP reads like a book, with Hugh’s notes on certain songs, thoughts on recording the album and his recollection of working with legends like Dr. John, Sir Tom Jones and Irma Thomas. Joe Henry also contributed a detailed introduction to all the talented musicians that performed on the album.

The LP is packed with great video content too. The ‘Live in New Orleans’ DVD contributed two live videos featuring Sir Tom Jones and Irma Thomas. I also included a six part documentary that covers Hugh’s journey to New Orleans and his time in Ocean Way Studio.

Once the iTunes LP was ready for release I briefed the team at Electric Lighting Station to create a trailer for the product. Oggy Hawkins did a superb job and created the video YouTube video embedded on the left.

The ‘Let Them Talk’ iTunes LP went on sale worldwide in December and was incredibly well received. It is great to know that something I created has reached such a wide international audience. Especially with Kate Brighouse and my names in the credits.

One of the latest signings to Warner Bros. UK is the acoustic duo Lilygreen & Maguire.

Kate Brighouse designed a simple holding page using a photograph by taken by Sam Stubbings. I then built and set the holding page up on lilygreenandmaguire.com.

The sign-up form uses Javascript to validate and submit email subscriptions, with a standard html form as the fallback option.

Our team recently started helping out with the occasional Rhino UK project. One of the first jobs we had to work on was a free download page for the new Alvin & The Chipmunks soundtrack.

Kate Brighouse designed the page, which I sliced up and converted into a php microsite.

The sign-up form is validated and submitted via jQuery to keep the process as smooth as possible.

The free download is only available for UK visitors so I had to build in geo-targeting capabilities to ensure that the sign-up form is only displayed to visitors from the UK. I used the MaxMind database to run IP detection and determine the page contents based on the visitor’s location.

In November 2011 Muse released an incredible coffee table book filled with photographs from The Resistance Tour. The book was released exclusively through muse.mu and the band needed to get the word out to fans.

I was asked to build a gallery to preview some of the photographs. I built a gallery using jQuery to elegantly fade the images in and out as a user pages through them. I put together some iFrame code so the band’s management could easily add the gallery to the product page in the online store.

To take it further I developed a slightly smaller version of the gallery to sit in a Facebook tab. The tab links back to product page to encourage purchases. The tab includes social sharing options linked to the product page. So fans who click ‘like’, ‘tweet’ or ‘share’ on the Facebook tab would share a direct link to the product page on muse.mu.

To enhance the sharability of the gallery I created a small Flash version for improved Facebook sharing. Anyone sharing the product page or hitting ‘like’ on the page or Facebook tab would post a preview directly to their wall. The small flash gallery loads in the news feed and ends by linking back to the product purchase page. Sharing the product in this way made it far more engaging and appealing, while driving traffic to the store.

Finally I made sure that the jQuery gallery degraded gracefully for users without Javascript enabled. Instead of using a smooth jQuery transition, the gallery still allows users to flick through the photos easily.

The gallery seems fairly simple at first glance, but there are a number of clever bits of code working together to provide the best product experience.

Just before Stooshe launched their lyric video for ‘Betty Woz Gone’ they put a mixtape up on Soundcloud which was covered by numerous blogs and music sites.

We also made the StooshTape available as a reward for fans joining the girls’ mailing list. To further promote the sign-up incentive, I built a widget that could be embedded on sites, blogs and social networks.

This was one of our usual sign-up widgets, built in Flash with an html5 fallback option. It is optimised for social sharing to allow in-feed embedding on Facebook, as well as Google Analytics to track it’s success.

Visit clementmarfo.com for the official Overtime lyrics.

Clement Marfo & The Frontline’s marketing manager, Nathalie Barnett, came up with a fun way for fans to engage with the band’s current single.

Her idea was for fans to be rewarded for posting the lyrics to Overtime, which lend themselves very well to status updates and tweets.

I commissioned The New Black to build a Facebook app that would personalise a random lyric from the song and post it to Facebook or Twitter.

I had to convert all the lyrics into ‘status friendly’ lines that could include the person’s name and gender.

The app randomly selects a lyric and adds your details to it. You can then post the lyric or select another one.

All the fans who use the app are then entered into a draw to win various CMTF prizes like tickets and merchandise.

The app worked brilliantly as a tool to promote the single whilst rewarding fans for engaging with the song and spreading the word.

When fans join the mailing list on the website or through the widget their free download link is delivered via an automated email. We needed to style the email to fit in with Marlon Roudette’s branding.

Kate Brighouse designed a mailer template and I assembled all the html and css to deliver the emails.

To promote the release of Marlon Roudette’s Riding Home EP, we created a data capture widget with a free download of a song called ‘Brotherhood of The Broken’.

The widget is flash based with a mobile-friendly html & javascript fallback option. The Flash version also plays a preview of the song.

Kate Brighouse designed the widget and a mailer template that I set-up as an automated response to deliver the free download to fans that registered for the UK mailing list.

Marlon Roudette (the former Mattafix frontman) has an irregular record deal. He was recently signed to Warner Bros for the UK release and promotion of his album ‘Matter Fixed’. While we look after him in the UK, he is also signed to Universal Music Germany (and Universal for additional territories).

This proves to be a challenge for online promotion where the internet is global. Universal’s German team have been incredibly helpful in allowing us access to Marlon’s online estate. While they’re much further into the campaign than we are, it was decided that a simple splash page would be the best point of contact for UK fans.

I wrote a simple geo-location script that checks the MaxMind database of IP addresses and redirects any UK visitors to marlonroudette.co.uk. The script also drops a cookie to prevent the need to check the database every time a returning visitor loads the site.

The splash page was designed by Kate Brighouse and features a YouTube embed, link to buy the Riding Home EP, a sign-up module that validates and submits via jQuery and a tour dates listing powered by the bandsintown facebook app.

By hosting the splash page on marlonroudette.co.uk we are able to keep the site updated without needing to involve the German team. The geo targeting script works very well to ensure that visitors always land on the site most relevant to the territory they’re in.

Pete Tong signed Paper Crows to his FFRR label and I’ve been helping out with the band’s online estate.

As the band are starting out, they wanted a fairly simple website so we decided to build the site on a Tumblr blog.

I set about building a custom tumblr theme to make the site more than a basic blog feed. The navigation works in conjunction with Tumblr’s static pages feature. I added static pages for music, videos, contact details and the mailing list. The music page is a collection of Soundcloud players while the Videos page is a bunch of embedded YouTube videos.

I configured the sidebar to contain a mailinglist sign-up module. The form uses jquery and ajax to validate and submit the users details seamlessly.

The sidebar also includes a Facebook like box, with customised css to improve the styling and integration with the site.

Paper Crows use the BandsInTown app to power their tour dates on Facebook and Myspace. I included the Javascript widget to include a tour dates page and sidebar widget.

Cufon made it easier to style the headings and navigation, adding a bit more style to the page’s design.

All posts include AddThis sharing with custom buttons. I also included Omniture tagging to track website traffic.

Finally I switched the A record for papercrows.com to make the tumblr blog the band’s official website at papercrows.com.

The Platinum Edition of the Overtones’ debut album went on sale with an even more deluxe version in iTunes.

The iTunes LP presents the album along with additional content within a very slick design by Kate Brighouse.

The iTunes LP includes the entire album as well as additional bonus tracks. The videos section covers all the group’s music videos, a number of behind the scenes clips, live footage and clips of the band interviewing each other. There are also two photo galleries with various press shots and behind the scenes photos.

To promote this version of the album and make sure fans understood the additional content I had Oggy Hawkins create a preview video. He did an incredible job and the video did a great job driving sales of the premium digital product.

During a brainstorming session about expanding All the Young’s fanbase we decided to create a system that would reward points for sharing content.

We decided to focus the campaign on the forthcoming release of ‘Quiet Night In’. Fans would earn points for sharing a unique link to pre-order the album. The fan with the most active link would win a gig from the band in their local pub. Runners up would receive a signed guitar and signed vinyl.

I set-up a MySQL database to hold all the user data and wrote the system using php.

Fans register their details and the database returns a unique link tied to their ID. I set-up addthis to make sharing the link really easy and set-up all the correct meta data to personalise the sharing system on social networks.

All the Young’s fans took to the competition really enthusiastically and passed their links around everywhere they could, driving loads of traffic to the iTunes pre-order page for ‘Quiet Night In’.

Later in the campaign we changed the link’s destination to a free download tab on the band’s Facebook page, by extending the competition’s reach we were able to drive a lot more new Facebook fans for All the Young.

The system worked really well and will be something we can easily repurpose for other artists.

To help drive Facebook likes on Clement Marfo & The Frontline’s Facebook page Alex Burford came up with a plan to reward Facebook fans with exclusive content.

Alex designed a tab to display behind the scenes photographs from the Overtime video shoot and I got to work building it.

The page used php to dynamically load thumbnails from a folder. I configured fancybox to open the full size images in a slick lightbox.

If a visitor isn’t a fan on the Facebook page they will see the thumbnails but they’re faded out and the link to the full sized image will be disabled. I floated a like button over the inactive gallery which reloads the page and disappears after a user clicks on it.

A few weeks later we were given the Cruelty Remix of Overtime to give away, so the exclusive content changed to a download link for Facebook fans.

I reconfigured the page to display a download link for existing fans and a like button for non-fans. The meta data on the page also needed to be edited so that the sharing functionality would post an updated message about the exclusive content on offer.

On the Saturday we ventured out across the Gower Peninsula after a surreal stop in Porthcrawl where the entire town was celebrating the life of Elvis for the weekend. Despite the sunny start to the day we were treated to typical Welsh weather by the time we made it to the beach at Llangennith. The rain hadn’t stopped all the eager surfers who were in their 5-10mm wetsuits learning how to stand on a surfboard while your body shivers uncontrollably.

We spent the whole day driving around the beautiful peninsula and ended up in Mumbles, taking photos of the amazing Mumbles Lighthouse. As a last minute decision we decided to head into Cardiff and catch a comedy show at the Glee Club. The comics were hilarious but sadly we weren’t treated to any local acts.

On the Sunday we passed by Barry Island but kept our stay very brief due to the rain. It started clearing up as we approached Coch Castle and then made our way to Caerphilly Castle. We decided to squeeze one more castle (and a cheese festival) into our trip by visiting Cardiff Castle on the way home. Even though we wanted to be brief they wouldn’t let us in half an hour before the cheese festival closed, so we hit the road and made our way back to London.

The weekend was a great introduction to Wales. Next time we’ll be sure to go deeper into the country and experience the mountains and beaches further North.

Live at Proud, Camden (United Kingdom).
12 October 2011.

My cousin gave us gift vouchers to go Zorbing in Dorset so we hired a car and left London on a Friday evening.

We spent the weekend camping and driving around the area stopping off at beautiful beaches and vantage points. Knowing that summer was drawing to a close we made the most of the warm weather and had an amazing swim in the sea near Durdle Door.

On the Sunday morning we took off to the farm that host the zorbing and got rolled down a hill. They offer two zorbing options, the harness or aqua options, fortunately we could do both so we did the harness first. You get strapped into a seat and then take off facing each other as you roll head over feet or feet over head all the way down the hill. The aqua option was much better. They add some water to the inflated ball and as you roll down the hill you slip and slide as if you were on a water slide. It was loads of fun.

We took a brief stroll around Dorchester before making our way to Lulworth Cove for lunch and a final swim before heading back to the big smoke.

View larger versions of my panorama shots below

Weymouth Panorama

Durdle Door Panorama

Lulworth Cove Panorama