Internet Boy Band Database

The Premise

🎵 Hot new release! 🎵 @codenberg, @ProQuesAsker, and @thisismrmalik take you on a nostalgia-infused history of boy bands. Menudo, Blackstreet, One Direction, plus 52 more! Come for the tunes, stay for the adorable dance moves. https://t.co/678fv8SlED #boybands #datadrivendance pic.twitter.com/pE3KmpgkXu

— The Pudding (@puddingviz) November 27, 2018

Seriously, this was just a “we want to experiment with making in-browser animations and make something fun on the internet” kinda thing

My Contributions

• Managing dozens of data collection volunteers
• Data Cleaning
• Some Front End Programming (HTML, CSS, JS)
• Some Story Design

Collaborators

This story was suggested by Russell Goldenberg who wanted to see the physical characteristics of boybands switch while they continued dancing (that is, switch from the members of a single band to the members of another). To make this a reality, we worked with motion-graphics animator, Malik Yusuf who handled all of the illustrations and animations in Adobe After Effects. He then output his work into Lottie, a library to render animations natively on the web. We asked for help from dozens of volunteers (thank you volunteers!!) to help us collect data on the physical appearance (and other details) about every boy band member in that band’s highest ranking music video. I worked with these volunteers and cleaned all of the data they entered. Then Russell and I worked together to make Malik’s illustrations switch out using the data that we were feeding into it.

Screenshots