Tag Archives: visualization

6 ways to view the new YouTube trends map

Posted on

YouTube trends mapVideo on the internet has come a long way from the jerky, plugin-encumbered frustration of the late 90s to its speed and near-ubiquity today. YouTube now reports 1 billion unique monthly visitors watching more than 6 billion hours of video each month. The proliferation of smart phones and accompanying rise in social sharing mean that mobile video viewing is at an all-time high.

Data visualization pro Martin Wattenberg has collaborated with the YouTube trends team to create a map of trending videos in the U.S. Six ways to explore the data:

  1. Click on any of the video thumbnails on the map to play. I’m generally not a fan of the lightbox treatments because they lose the metadata that provides context — but it works well here. Interestingly, the lightbox views seem to have no pre-roll. 
  2. Mouse over the video list by cities/regions at right. The other videos on a map will gray out and let you see at a glance what’s playing where nationally.
  3. Next, toggle between Shares and Views in the filter bar at top. I love this as a metric to understand what people enjoy watching versus what they suggest others watch.
  4. Click Male or Female in the filter bar to see what’s trending by gender. On Tuesday, the females seemed to be watching Blake Shelton while the males tuned into Charles Ramsey.
  5. Click the age ranges to see what’s trending by the usual bands. The high overlap between the 13 year olds and the 65+ crowd confirms my suspicion that the age reporting in YouTube is highly suspect. Twelve year olds tend to sign up as senior citizens to avoid age restrictions, and Google prevents them the changing the age on the account when they go back to fix it in their late teens.
  6. Finally, scroll down below the map to see the top videos trends bars. The colors cleverly derive from the video thumbnail, and offer a great visual that changes as you select filters up top. It’s a great way to see, for example, that tonight there is uniformity in what people are watching but far more variety in what they are sharing.

The trends map is an immensely readable view of the enormous U.S. video data set. For large publishers of video to YouTube, this would be a terrific at-a-glance addition to a video performance dashboard.

3 tips for timelines

Posted on

I can still remember the pain of drawing history report timelines during an analog childhood. The inevitable result was a shaky line of unequal width, with at least one or two skips on the ruler, and uneven pointed arrows each end. A career in draughtsmanship did not beckon.

Timelines seem like the kind of thing digital technology would solve easily. We’d all agree on a protocol and set of user experience conventions, and voilà — a customizable template for slider-enabled, scannable history of any topic. Sadly, that doesn’t seem to have happened. While there are some solid solutions out there, there’s still a wide variety in execution and no common user experience dominates. Here are three tips for designing and developing a timeline.

  1. Think upfront about the content types/data points and the relationship among them. Will there be video? A slideshow? An infographic? When crafting the layout, let the content drive the design and not the reverse. It’s too easy to fall in love with a polished design experience to realize only too late that it won’t accommodate the information that will tell the story.
  2. Build in substantial testing with real users to make sure that features are not too subtle to be useful. It’s easy to underestimate actual user frustration with fiddly fingers and a bouncing eye track.
  3. Mobile views of the timeline are a requirement in a world where the Guardian reports record mobile traffic, and Buzzfeed, going after the bored-people-in-line market is up to 50% mobile. As devices and browsers proliferate, the user experience may need to degrade gracefully for some devices.

Chronicle Timeline MOOCHere are two recent timeline examples with divergent approaches and effects. First, the Chronicle of Higher Education offers a timeline of MOOCs (massively open online courses). It’s a clean if clunky view, with a collapse feature that reduces the elements to headlines and a button to reverse the chronology. A vertical view may be easier for older users, but there’s no responsive for mobile. Best of all the timeline accommodates various content formats while keeping the layout clean.

The Digital Public Library of America (DPLA) launched a beta site last week (coverage here) with a timeline view of the assets. This timeline is elegant, with a sexier horizontal orientation and responsive for mobile (although not fully swipe-able). The biggest challenge posed here is the content — there’s a long historical timeframe but some screens with 0 items shown. The controls are also extremely sensitive, and you have to drag the slider rather than click on an individual year to jump back and forth.

DPLA timeline

Bottom line: timelines aren’t a universally solved problem or easy to get right — a successful outcome depends on balancing functionality with design and working with the content and timeframe you have.

Lovely and functional football table

Posted on

Arsenal results

Most of the football visualizations I find seem to vanish after a few weeks or months, but I sure hope The Beautiful Table sticks.

Designed by Jon Ferry, this lovely and functional visualization shows you how your team (in my case, sadly, Arsenal in the Premier League) is faring. There are many small details that make this work, including use of club colors, smart mouseover behaviors withe match details, and data from both played and scheduled matches enhance the timeline.

Kudos for making something elegant that solves an actual problem: show me how my team is doing without making me look at a HTML table on a web page designed in 1997.

Found via infosthetics.

How to visualize interconnections

Posted on

MOMA has a terrific visualization as part of a show on Inventing Abstraction that opened back in December 2012. Visualization projects that map interconnections become complex quickly in a number of ways:

  • Content for each subject: How much should you display? This seems like the right amount, although there’s something hilarious about seeing Picasso’s interests reduced to an all-caps summary: GUITARS, MODELS, CUBISM, SUMMERS IN CATALONIA
  • Content that informs the connections: What’s the data source for these? Who relates to whom? How closely? How do you display relative strength of relationships, if at all?
  • Overall user experience: How will users know what to do? Where to start? Is the story that is emerging the one you started out telling?
  • Movement: What’s too sensitive? What’s not sensitive enough?
  • Technology: How can this work everywhere you need it to? This is mostly a solved technical problem, but not trivial in a world of proliferating devices. Will this ever be projected? What’s the level of accessibility required?
  • Flexibility: Depending on the life of your product, how do you handle new data about relationships? What’s the governance process for change post launch?

Information aesthetics also points to a great three-minute movie made about the mapping process which gets to the complexity under the hood here.

Reviews of the show overall can be found in The New Yorker and The New York Times, but only the latter of these mentions what struck me immediately in the visualization — the unusually large number of women represented as creators and not only subjects of an artistic movement.