Deadbeat Drummer

Dead Beats. Dead Simple

DeadbeatDrummer.com was created for drummers wishing to reinforce their drum lessons through free, high quality video tutorials. Deadbeat Drummer teaches drummers the fundamental rhythms required to play rock and heavy metal. Crystal clear audio, captivating video and unique camera angles make Deadbeat Drummer the best website in the world to learn the drums.

Executive Summary

Rock Out with Deadbeat Drummer Out

The idea for Deadbeat Drummer came about when I spoke to a number of drummers about the state of online video tutorials and they agreed with me that the low quality video and overpowering sound were truly uninspiring. I fully agreed that these online lessons should motivate people to learn the drums, rather than dissuade them.

A lengthy conversation ensued when I found out that there was no website dedicated to teaching drummers rock and heavy metal rhythms, the genre of music I'd most listen to.

Armed with a number of drumming related surveys, I visited drum teachers in the Belfast area, to see if local drummers agreed with me. A few weeks later, I collected the anonymous surveys and there was a general consensus that drummers were unhappy with the quality and price of online videos.

I set up deadbeatdrummer.com, spotting this gap in the market. The intention was to create the highest quality drum video tutorials in the world at the price that was most appealing to drummers - completely free.

I rented a studio and equipped myself with black drapes, soft-boxes, a video camera, a jib and got drumming!

Having shot and edited the first videos, I began work on the website. After weeks of hard work, the sleek, standards compliant, content managed website went live, professionally housing the quality video tutorials.

To this day, drummers watch the tutorials on a range of desktop and post-PC devices. Deadbeat Drummer remains one of the world's most ambitious and innovative drumming websites, attracting beginner, intermediate and advanced drummers from all over the globe.

Audio & Video

Turning it to 11

When I came up with the idea for Deadbeat Drummer, I knew it had to change the world. It had to make the lives of drummers easier. To do this, I couldn't merely rely on a fresh teaching style. I would have to use the most advanced technology I could get my hands on, to deliver the best possible viewing experience.

Research was crucial at this stage, to create something that had never been done before. I realized the importance of video and audio from an early stage and set about optimizing both. It was important to focus equally on both so that one did not outshine the other.

EZdrummer

I stumbled across Toontrack's EZdrummer when researching audio recording software. My setup before Deadbeat Drummer was impractical for the nature of the tutorials, as my electronic drumkit wired directly into a guitar amplifier. It was ideal for volume but unsuitable for clarity. With EZdrummer I was able to record directly into garageband and even adjust the tone, volume and ambience of each drum hit.

I recorded the audio separately from the video to reduce the chance of human error whilst recording the video.

Acquiring a Studio

Before the studio, I had the drumkit setup in my bedroom. After several screen tests, I realized that the location just wasn't right. Somewhere larger with plenty of space for camera manoeuvrability was required to get the job done effectively and appear professionally on screen.

I hired an empty workspace in Craigantlet, packed my drumkit into the car and set off with plenty of spare cables. The location was quiet with surrounding fields, so noise control wasn't an issue.

Preparations

My vision was to cover the room in black drapes and have a large light beaming down onto the drumkit, almost like a spotlight. Following several trips around Belfast, this vision became a reality when I acquired two superb softboxes and four large sections of black fabric.

I also used a Hague Junior Jib for the overhead camera angles, all being shot on a Canon 60D in HD. It was a great learning experience positioning the lights differently depending on the camera angle.

Video Production

The first video "Now You've Got Something to Die For" took around four weeks to shoot the various camera angles and record the audio. I could only shoot at night to give me complete control over the lighting.

The process involved me constantly running backwards and forwards between the kit and the camera to check every 10 seconds or so. The angles captured are edited together from around 30 times through the song. By the end of the process, I was beginning to agree with the song title, but it was worth it.

Video Editing

I tried editing with Garageband but the software didn't give me enough control over transitions, audio syncing and filters. I stitched the various camera angles together using Premiere Pro and replaced the warmth with a cool blue filter from the excellent "Magic Bullet Looks", a plugin designed by Stu Maschwitz, Sin City's Visual Effects Supervisor.

The most difficult part of the editing was aligning each camera angle to the exact point in the audio track to make it appear as if I'm playing live.

Website

Powered by Rock

It was ambitious of me to want to build a fully content managed website, complete with CSS3 Media Queries and an E-Commerce system in the twelve week time frame, alongside the videos. My experience with each of these prior to Deadbeat Drummer was limited and the videos had already taken up so much time. It was a risk, but I'm glad to say it paid off.

Each new article is essentially a blog post and each page works on a range of screen sizes. The store is fully operational and most importantly, secure. The design reflects the quality of the content and the values of the Deadbeat Drummer brand are revealed throughout the site's design; simple, thoughtful and delightful.

Standards and Compatibility

Deadbeat Drummer was built using HTML5, CSS3, PHP and Javascript. I decided to take advantage of many of HTML5 and CSS3's features to limit the amount of images and javascript required, as well as make the markup more semantic. I included box-shadows, rounded corners, transforms, transitions and a few of the helpful new HTML5 tags, such as article, aside, section and video. I felt it was very important that the site adhere to the future HTML5 standards set by the W3C as well as work in as many web browsers as I could get my hands on.

Sublime Video

Weeks of HTML5 video research lead me to Jilion's Sublime Video, which boasted the ability to work in every browser and play seamlessly on smartphones. The look and feel of the player suited the site a lot better than the JW-Player. So much so, that I became a "Planet" subscriber to make certain that the Deadbeat Drummer users would get the best possible video experience and not run into any compatibility issues. The joy of Sublime Video is its full screen feature, ideal for high quality drumming videos, requiring the best possible insight into learning the drums through online video.

CSS3 Media Queries

The Deadbeat Drummer website scales up and down beautifully, giving you an experience that's ideally suited to whichever device you visit the site on, be it an iphone, tablet, laptop or desktop computer. The content adapts to whichever resolution you use, meaning a fancy computer is not required to access the site and start learning the drums. On an iPhone, the site has a web-app like feel to it with the focus being on solid large buttons, text that doesn't require zooming to read and sensible image sizes. Once tapped, the videos enlarge to full screen.

Content Managed

It was important to me to integrate a CMS into the Deadbeat Drummer website, to allow me to control posts without having to constantly update my HTML markup. I chose Wordpress to manage the content on Deadbeat Drummer for a number of key reasons:

Easy to add, update and manage posts
Easy to create pages and custom pages
Large community and the Codex fantastic for tips
Can search by category, by author and date posted

After plenty of trial and error, I included a few scripts I wrote myself to call the featured post image, the post title, the band name and an excerpt from the post. The site also uses Wordpress custom fields to display an image for the tutorial related post.

Another script I wrote is viewable once you hover over a post image. The Deadbeat Drummer emblem appears with the post title below. The script actually calls the post title, formats it and inserts it below the emblem on hover-over. This useful custom script means I don't have to redo images in Photoshop each time for the hover-states, which are implemented with CSS3 transforms and transitions.

Wordpress categories meant I could attach a band name, lesson type and author name to each post. I can see this being very useful for users in the future who want to search for posts containing a certain band name or lesson type.

E-Commerce

Being able to build an E-commerce system into a website is a great skill for a web designer to have. I decided to give it a go having already ordered Deadbeat Drummer T-Shirts and Drumsticks. I initially tried the WP E-commerce plugin but found it over complicated and too time consuming, just to be able to sell two items online. A stream of positive reviews led me to Big Cartel.

It was Tyler Galpin's involvement with the United Pixelworkers Store that especially prompted me to sign up. The level of customization offered by Big Cartel is astounding. The other main reason I chose it was for the security aspect. Using such a reliable system gave me piece of mind that customer details would be safe and the store would never break.

What Are You Waiting For?

http://deadbeatdrummer.com

Consider this colophon your golden ticket, your glimpse behind the scenes, your insight into the thought and technical process behind Deadbeat Drummer. Now you've heard about it, why not head over to http://deadbeatdrummer.com and experience Deadbeat Drummer for yourself. Click the button below to see what all the buzz is about.

Thank Yous

A Collaboration

DeadbeatDrummer.com would not have been possible without the help and support of many people. Their involvement in the project kept me motivated to produce something spectacular, that could potentially change lives and help drummers around the world.

Dreamhost for their fantastic web hosting
Sublime Video for the best HTML5 video service out
Typekit for rocking the fonts on Deadbeat Drummer
Big Cartel for being the best value E-Commerce system out
Joni Korpi for his wonderful Less Framework 4
Andrew Goodman from Last Minute Productions for teaching me After Effects
The Net-Finity Group for the part-time design work during the year, working on Media Lightbox
Sarah Martin from Paragon Fabrics for sorting me out with drapes
TSL-2009 for the softboxes
Hague for the Junior Jib
The guys at Komodo Image for printing the T-Shirts
Chris Mills, a gentleman from Opera, a real inspiration of mine..thanks for coming to Belfast!
GoPro for the head cam used in the videos
Brian McNarry from Bloomfield Presbyterian for the loan of the snare drum!
Gabriel Muldoon, for his invaluable advice throughout the year
Davy Bates, drum teacher from Ossia Music for his advice on the project
My grandfather Brian Willis, who helped fund the project
My father Adrian Willis, who sadly passed away 28th February 2011, for getting me interested in both music and computers! Love you Dad, this one's for you!

About Ben Willis

The Designer

Having finished Upper Sixth with A-Levels in languages, Ben wanted to somehow combine his love of languages with his passion for creating digital art. Ben chose to study Interactive Multimedia Design at the University of Ulster and has never looked back.

His placement year at Net-Finity was confirmation that he wanted to become a web designer, working with companies such as UsedCarsNI.com, NIFRS, Media Lightbox, Harry Corry and Linwoods.

Having finished his placement year, the Net-Finity group offered Ben a part-time role working for Media Lightbox whilst completing his final year at University. Ben very happily agreed and ended up designing an entirely new system for the company, whose clients include Vodafone, BP, Nokia and the National Trust.

Ben is indebted to Media Lightbox for giving him the huge opportunity to redesign the system from the ground up.

You won't be surprised to know that in his spare time, Ben plays the drums. He also enjoys hockey, photography and head banging.

For more information and a full portfolio, visit www.ben-willis.com.