September featured SlideDeck: Doctor Who2 Comments
This month, we scoured more than a few alternate timelines looking for awesome custom SlideDecks out in the wild – lo and behold, we stumbled across this amazing example on BBC America’s website for Doctor Who. Here’s a quick rundown of the things they did to take SlideDeck “to infinity – and beyond!”.
Wait, he says that, right? No? Oh, uh…hm.
How did they use it?
The good folks at the BBC have really leveraged SlideDeck’s flexibility to create a comprehensive codex for the entire show’s content in an extremely small space. Immediately upon arriving, longtime viewers can get recaps of the latest episodes, while show newbies can easily catch up by exploring Doctor Who‘s rich universe of events and characters. All without leaving the page!
This SlideDeck is essentially acting as a virtual concierge that gently guides visitors to where they need to go, preventing them from becoming overwhelmed with choice – a must for any site with a robust amount of content.
Breaking it down – why we love it
There are a bunch of things that this particular SlideDeck does right, (aside from featuring a time-travelling immortal who crosses the galaxy fighting a race of killer robots – we’re not difficult to please), so how about we go through them, one-by-one?
Instead of the standard letter-box style that most SlideDecks tend to use, this example sports a bolder square proportion, helping to to dominate visitors’ attention on the page, as well as giving Her Majesty’s TV people more vertical space within which to stack the content in each slide. Notice also, that they’ve disabled the ability to scroll past the SlideDeck, so there’s literally no way you’ll miss what they have to say (here’s how to disable that option in the jQuery and WordPress versions).
Growing a spine
The Doctor Who SlideDeck makes great use of custom spines to help it seamlessly blend in with the overall look & feel of the site. The devil’s in the details here – take special note of the custom vertical slider indicators and navigation tabs. It sounds complex, but all of these elements can be modified by editing just one image file – find out more about customizing SlideDeck’s image sprites to give your SlideDeck skins a slick, unique new look.
Bring the eyecandy
Striking imagery is almost never a bad thing (unless you’re wallpapering your bedroom), and the good Doctor’s SlideDeck is no exception. While this example doesn’t use background images, it still uses bold, evocative images that serve to keep things interesting, and convey the mood of the show.
Share & share alike
Here’s something special: within each slide in this SlideDeck, a visitor can easily post their own message and a link to the content in question to Facebook & Twitter! Try it out.
What would we suggest?
There’s always room for improvement, and this is no exception. So what would we do to kick this SlideDeck up a notch?
- Embed video content – Let visitors view exciting video clips from within the SlideDeck, instead of requiring them to click through
- Vary the slide templates – Shake things up a little to keep people engaged with the robust amount of content presented here
- Make sharing functionality more apparent – While the call-to-action doesn’t get much clearer than “Post to Twitter/Facebook”, we completely missed the fact that you can write a custom message for the post within the SlideDeck. For all the effort it likely took to get this great feature working, we’d want to make sure people don’t miss it!
- Interlink between slides using the API – Clicking through the slides in sequence is like asking the Doctor himself to take the bus. By hooking into SlideDeck’s simple API, we could have visitors jumping between any two slides in the whole deck, Tardis-style! (That metaphor kinda works…right?)
Want to go all Time Lord with some custom SlideDecks of your own? Why didn’t you say so? Download the free Launchpad bundle to get up and running with your quest for customization. But not before you let us know your thoughts on Doctor Who’s SlideDeck in the comments below!