Press "Enter" to skip to content

Simple user experience design inspired by radio

This week I launched the redesign for my podcast’s website over at stutteringiscool.com. It’s the 3rd makeover since I first started my show in November 2007. While the second makeover was designed for the experienced podcast listener, as I got to know my audience over time, I’ve decided that the third makeover would target the non-technical. Those who may not necessarily know what a podcast is.

I was inspired by the simple user interface of traditional radio. After all, my show is an audio podcast! With traditional radio, the user turns the dial (or presses the button these days) to the desired frequency and starts listening. But with podcasting, it’s a little more complex. You need software to subscribe, you have to find the RSS feed, enter the RSS feed, hook up your mp3 player, etc. Try explaining that to a non-technical person who is used to the simple interface of YouTube and Facebook videos.

Therefore, I placed the audio player right on the homepage along with the latest episode. And the makeover is designed around the latest episode. So the traditional radio metaphor is the user falls on my homepage and clicks the play button.
Stuttering is Cool v3 screengrab
Subscription information is displayed on the right side. This is to serve two purposes. The first is to give seasoned podcast listeners a few convenient one-click solutions to subscribing with popular RSS readers (and to help spread the word about CastRoller, built by friends of mine in the podcasting community). The second is to introduce the idea of subscribing to users who may not be familiar with the option prefer email notification.

Of course, the audio player shows up on every episode’s page. Perfect for users to click the link in the email notice, automatically launch browser, then user clicks play. And for those who stumbled upon any page in my site from a search engine result or shared link, etc.

The big blue area without the patterned background highlights the mission of my show: audience participation via submitted audio. I keep that displayed throughout the site as a reminder for users who browse around the site. It makes for a big footer, but this is important for the spirit of the show.

Then finally, I kept my “101 Stuttering Links” feature at the bottom. I don’t want it to play a major role on my site since it’s more of a courtesy feature.

I removed the large comic area that played a major role in the second design. The comics now show up on my podcast’s companion site, ti-ger.org. This way, I keep stutteringiscool.com interface focused on the podcast.

You may have noticed that I use the same fonts on the two companion sites and this danielerossi.ca. The reason being that I like the idea of consistent branding across these three sites that were made by me. Presented by me. Produced by me.