Archive: February 1st, 2012

I’ve published the transcript of a talk I gave at An Event Apart in 2010. It’s mostly about interaction design, with a couple of diversions into progressive enhancement and personality in products. It’s called Paranormal Interactivity.

I had a lot of fun with this talk. It’s interspersed with videos from The Hitchhiker’s Guide To The Galaxy, Alan Partridge, and Super Mario, with special guest appearances from the existentialist chalkboard and Poshy’s upper back torso.

If you don’t feel like reading it, you can always watch the video or listen to the audio.

You could even look at the slides but, as I always say, they won’t make much sense without the context of the presentation.

Clearleft has been running dConstruct since 2005. You can still visit the site for each year:

1. 2005
2. 2006
3. 2007
4. 2008
5. 2009
6. 2010
7. 2011

Right from the first event, we recorded and released a podcast of the talks—thanks to Drew’s l33t audio skillz—and all of those audio files are still online. That’s quite a collection of aural goodies. So we decided to put them all together in one place. I give you…

The dConstruct Audio Archive.

Michelle came up with the visual design—evolving it from last year’s dConstruct site—while I worked on the build. The small-screen and large-screen layouts were designed simultaneously and then I took a small-screen first approach to building it, progressively layering on the wider layouts and tweaking for the in-between states that didn’t have mock-ups. It was a lot of fun.

There’s nothing very complicated going on in the back end. I’m just using a JSON file to store all the info about the talks and I’m piggybacking on the dConstruct Huffduffer account to offer up podcast feeds by year and by category. The categories are fairly arbitrary and unscientific but they give a good indication of the kind of topics that dConstruct speakers have covered over the years …and you can see the trend of each topic over time in a sparkline on each category page, generated by Google’s Chart API.

One tricky challenge was figuring out how to handle the images of speakers to make them responsive. Initially I was looking at Andy’s context-aware responsive images because the small-screen single-column layout often displayed wider images than on a larger screen’s multiple-column layout. In the end though, I decided that my time would be better spent optimising the images for every screen by getting the file sizes as low as I could so I spent a lot of time in Photoshop blurring backgrounds and messing with export settings. So while the images are all 450 pixels wide by 300 pixels tall, the average file size is around 20K. That’s not ideal for small-screen, low-bandwidth devices that are squishing the images down but I figured it was a good start.

There’s still lots more I’d like to tweak (I need to add links to slides, transcripts and videos where available) but rather than wait for everything to be perfect, I thought I might as well launch it now and continue to work on it.

So feel free to explore the archive, find some talks you like, subscribe to a podcast of your liking or huffduff anything that catches your ear.

And if listening to all the previous talks piques your interest, you’ll be happy to that dConstruct will be back this year …and it’s going to be splendid!