The idea

A couple of months ago, I shared an interactive infographics on the 6 reasons to (re)watch Buffy. It explained why, not how. To complete it, and in time for Buffy’s 25th anniversary, I created an interactive episode guide.

This blog is to document and shed a light on how I created this viz. I would advise to read first my blog on the process for the 6 reasons to (re)watch Buffy here, because there are a lot of similarities.

#1 Getting the data

#Python #Webscraper.io

• For episode ratings, I followed Isabella Benabay’s tutorial How to Scrape TV Show Episode IMDb Ratings Using Python & BeautifulSoup.
• The rest of the quantitative data was from IMDB, I used webscraper.io
• For the skip/watch recommendations, I decided to refer to a third party blog specialised in that type of analysis, rather than debating myself, as this is highly subjective!

#2 Format & software

#mobilefirst #Tableau

As last time, my priority is to create with mobile usage in mind so I worked on the mobile version first. To be honest, it’s not perfect but it gives a sense of what the data looks like.

Desktop version

mobile version

#3 Design

I used Figma for the layout, Adobe for the fonts of the title (Mason sans). I have already mentioned a couple of times the video resources that got me into Figma, should you be interested.

#4 Technical & data challenges

#map_layers

I was my first time I used map layers, so I am in debt to the amazing tutorial recommendations listed here, following my question on Twitter.

I learn better with videos (rather than written blogs) so I found especially useful the videos by Adam McCann and Luke Stanke.

On the data side, I also wanted to play with standard deviations to look at the variance of scores. If you are interested in understand how I created those, the workbook is downloadable and should contain another data sheet, with all the calculations

That’s all I had folks 🙂

On his blog visualisingdata.com, Andy Kirk has published a series of blogposts around the ‘little of visualisation design’, in which he focuses on the little details that make a huge difference. If you haven’t read it yet, go on Andy’s blog now, and then come back to thank me, you’re welcome.

I’d like to replicate the exercise and highlight some of the awesome details I saw in the entries of the data visualisation competition Iron Viz. This list is not exhaustive ; if your viz is not included, that doesn’t mean I didn’t like it. The quality was fire this year. Besides, my goal is not to list my fave viz, just a couple of details that made me chef kiss my computer on a Sunday afternoon and even, consider opening a YouTube reaction channel where I shout my love of other people’s dataviz sprinkled with French swear words (solid concept eh?).

Trends I notice this year in Iron Viz:

• A good year for horizontal scrolldown, not an easy format at all – yet, you guys rocked it
• Many clever techniques to reveal the viz little by little, via click actions required from the user
• Lot of entries exuded fun.

9 details I loved about 2022’s entries

1. The selective art of colours
2. Be daring with boring charts
3. Using the colours and design of your topic in a tactful manner
4. When your chart type evokes the topic you are covering
5. Selecting the right datapoints
6. Documenting via a video / audio guide
7. How not to make your viz look as complex as it is at first sight
8. How to encourage the reader to re-visit your viz with a new pair of eyes
9. Fun in dataviz

1/ No, you don’t need 9 colours to convey meaning

Ervin Vinzon for his One Piece managed to represent a topic in its complexity with only shades of grey and 1 accent colour. See, it’s possible!

2/ Some charts should be banished… nah actually, all charts have a use case, you just didn’t know

I very rarely see the point of treemaps. However, it is possible that Dinushki De Livera’s converted me because her Colors of Van Gogh makes a good use of them to reveal colour palette progression in Van Gogh’s work.

Meanwhile, I genuinely don’t get the hate pie charts get and don’t even @ me, I’ll tear you down on this one. It brings so much joy to me that Jessica Moon’s used a new combo, let’s call them lollipies in her Comedy in Huntsville, AL.

3/ Taking design elements from your topic… while creating your own identity: the colour palette edition

Adam Green, : integrated elements from Roy Lichstenstein in his design of Intro to pop art, while keeping his unique touch. This is a fun viz to explore!

Shout out to Wendy Shijia too, who used tactfully Google’s colour palette in her Learning about the world through doodle art viz: Google’s logo colours are hard on the eye, especially if you put the blue and red next to each other, they vibrate. Receding the colours (I can’t remember the technical term, please don’t sue me :D) is a detail that makes a huge difference.

4/ When your design and your topic merge: chart types

I like nothing more than a classic chart which designs ties with the topic. For instance, I used lollipop chart in the shape of trees in my geocaching viz, cause you know, geocaching is an outdoor activity.

Nicole Klassen put this to the next level in her Next to Normal viz, I mean, LOOK A GUITAR:

Same concept in Ant Pulleys’ Making Music – Leisure Time Music Across the UK viz: this Cleveland dot plot that that looks like music on a sheet, I AM HERE FOR THAT TYPE OF DETAILS  

5/ The right datapoints

On Twitter, everyone praised Kim Tricker for her sleek design on her Women in Film. I totally agree of course, but I have to say, I was even more impressed by how compelling her storytelling is with just a few cleverly selected datapoints. You absolute Queen.

6/ Accessibility and storytelling

I added an audio transcript in one of my vizzes recently but Emily De Padua went so much further in the 19′ listener guide of Color Studies. A special shout out for this one, because, once you finished a viz, the last thing you want to do is to spend more time recording and explaining it. And yet, it’s a precious thing. THANK YOU.

7/ There is an art in enticing the reader in a complex viz

CJ Mayes, The art of conversation: so many details in the design recede (the instructions, the dotted lines between the sections etc.) to help you immerse. And then BAM, you realise the viz is actually 10x more in-depth that you thought at first.

8/ Storytelling like an onion

Nathalie Richer, Women Artworks at MoMA: what a classy execution. The horizontal scroll works so well here and I am usually not a fan. I love the fact that you have to click for details but even more, when you finish the viz, those spiders that invite you to re-visit the viz, such a neat idea!

9/ Practitioners just want to have fun

I love how Annabelle Rincon’s Tintin in the Data World includes an engine to translate the name of Tintin in… your own language or other languages like latin. You know, in case you need to go back to Ancient Rome and have a conversation about your favourite Tintin characters 😀

I’m gonna finish my tour with Will Sutton, Interpreting Art: this sparks so much joy. The fact that there’s a quiz at the beginning, creates a strong “what about me (and my results)” component and entices the reader in the topic.

That’s a wrap folks!

Final note: many countries are not eligible for the global #ironviz qualifiers, therefore disqualifying many talents in the world. For instance, it would be shame not to give more visibility to Idris Akilapa’s Afrobeat & Afrobeats, a viz that gave me an intro on a topic on which I have absolutely 0 knowledge. That’s what I love the most about those competitions!