Depth and Discovery: Powering Visualizations with the Google Analytics API

At Juice, we work with web analytics APIs large and small, from Google, comScore and Omniture. The Google Analytics API is our favorite. It powers the world’s best, most widely deployed analytics site. And it powers Juice products like Concentrate (innovative search analytics) and Vasco de Gapi (a tool for exploring the Google Analytics API).

We were approached by the Google Analytics API team to find ways to explore new ways of looking at data with the API, and we were excited by the possibilities. We’ve been working on our own visualization framework, JuiceKit™, that integrates the power of the Flare Visualization Library with Adobe Flex.

The result is Analytics Visualizations, two visualizations powered by the Google Analytics API that are free to use. You just need a Google account with access to Google Analytics data to explore your own data.

Analytics Visualizations Home Page

Referrer Flow

Curious about what sites are linking to you and what content is benefitting the most? Referrer Flow answers those question and shows how results change over time. Here is a brief video introduction:

Referrer Flow is a stream of daily treemaps showing pageviews and bounce rates for various groupings of your website’s pages. You can group by combinations of page title, referrer and url. Clicking on the treemap will filter all the data by the page, referrer or url that you clicked on. Click again to clear your filter.

Keyword Tree

A list of top keywords isn’t enough to really understand how people are searching and finding your site. Keyword Tree visually displays the most frequently used search keywords and how they are used together. Here’s a video overview:

You’ll see a frequently used search term at the center and the words and phrases that are most often used in combination with that word. Pick a different starting word by typing into the box in the upper right or selecting from the top word across the bottom of the screen. The words are sized by their frequency of use and colored by bounce rate (or % new visitors or average time on site). Roll over a word to see details about that combination of connected words.

Depth and Discovery

In designing these visualizations we focused on the question: how can we let users uncover the unexpected? That means designing targeted visualizations focused on limited well-defined issues. The Referrer Flow monomaniacally focuses on a single question "What pages are people viewing on your site and where are they coming from?" The Keyword Tree is laser-focused on word ordering and what that means for keyword performance.

The Google Analytics reporting tool is a great general-purpose reporting solution. It gives the advanced users everything they need to answer specific questions. However, its generality means it has limited ability to focus on two issues; depth and discovery.

The Google Analytics API is Google’s solution to this problem. It’s an opportunity both for businesses like ours that can create new ways of analyzing data, and for large sites that can use the API for integration, custom analytics, and more.

Thanks to Nick Mihailovski at Google for his gracious support, help and encouragement and Avinash Kaushik for inspiring this idea.

Airline and Airport Traffic and Delays: A JuiceKit Visualization Demo

To fly is to be frustrated. If you’ve been traveling for long, you no doubt have your opinions about what airlines and airports are the biggest sources of suffering. Whether it is weather delays, getting stuck on the tarmac due to air traffic, maintenance problems, or missing a connection, it all feels outside of your control.

But a little knowledge can help. The Bureau of Transportations has maintained a giant database of air traffic information for decades of flights -- point of origin, flight times, flight delays, type of delay, etc. It is 72 gigabytes of data...just the type of data that needs some visualization. JuiceKit™ to the rescue.

We’ve put together a pair of visualizations that can make this data accessible to your average non-data-monkey traveler:

  • Treemap uses size to represent the number of flights by airline and by point of origin. The color is used to show delay time -- we’ve got all sorts of delay metrics, each of which tells an interesting story.
Airline Treemap
  • US map uses size to represent the number of flights and the color to display delay time. Filtering by airline yields additional details.
Airline US Map

There are some interesting insights that pop-out when you build a visualization this data.

  • The different airline strategies are quickly apparent in the treemap. Hub-and-spoke airlines (Delta, Continental) have one or two dominant boxes (origin location), surrounded by lots of small locations. A point-to-point airline like Southwest looks entirely different with lots of similarly sized boxes.
  • Flipping between delay types uncovers some unexpected results. For example, you might expect weather delays to be heavily correlated by airport. The data shows something a little different: Comair appears to be abnormally impacted by weather delays -- as if a dark cloud chases around their airplanes. While Comair might be overstating weather delay data to prevent paying for meal vouchers, a more reasonable Wikipedia investigation suggests that Comair flies smaller weather-susceptible Bombardier airplanes.

A few details about this demo for our technical audience:

For those of you following JuiceKit™ development, this is a demo of some of the newer features available in our open source Juicekit™ 1.2 distribution, and some of the features that will be coming to the 1.3 version. Treemap styling is now elegant, crisp, and allows for white borders, fixing a couple rendering bugs. There is a new tree-level depth feature that can make it easier to navigate treemaps with lots of layers. The airports map demonstrates a geographic layout built using GeoLayout JuiceKit™ and Flare components. A major improvement demonstrated by the airline-selector dropdown is the ability to keep nodes consistent between data reloads. This allows us to animate the nodes even though they are generated by our new LiveQuery component.

Announcing: JuiceKit™ SDK Open Source

As our followers know, for the past few years Juice has been creating software applications that solve customers’ real information visualization problems in purposeful, understandable, and beautiful ways. In doing this, we have found ourselves reusing quite a few components over and over again - which has made our jobs a lot easier. It occurred to us that others might like to benefit from using these components to achieve great results too.

We’re proud to announce the open source release of Juice Analytics’ JuiceKit™ SDK.

The JuiceKit™ is a toolkit built on Adobe’s Flex SDK to make it easier for web designers and software developers to build visually compelling Information Experiences™. It contains a wide variety of development components from individual data renderers such as a single "small multiple", to a large visualization component such as a treemap or US Map, to fine grained "helpers" that provide handy capabilities such as copying data to the computer’s clipboard. These components can be used independently, within other applications, or assembled together to create full applications.

What can I do with it? (Show me the money)

Because we’ve been using the JuiceKit™ for quite a while, we have a number of customer proven applications based on the SDK that we thought you’d be interested in seeing.

Here is a screenshot of an application that we built to help our client see trends in their internet search and traffic activity. We used the JuiceKit™ to create the small multiples data visualization component of this application.

Use JuiceKit™ to build small multiples

We’ve also frequently used JuiceKit™ to create dashboard prototypes. If you haven’t seen our recent application of our treemap component to the incomprehensible Federal Stimulus Plan, here is a nice example (click to explore):

Stimulus Bill Explorer

And here is a very quick one we did for an IVR monitoring application where we assembled multiple different components together into one view:

Use JuiceKit™ to build a prototype

Finally, we’ve used JuiceKit™ many times to build full enterprise applications such as this sales pipeline tracking dashboard:

Use JuiceKit™ to build a dashboard

How do I get it?

Now it’s time for you to have a go. Here’s how you do it:

  • Go to the JuiceKit™ SDK web page at juicekit.org and catch up on the current status of the project
  • Check out the JuiceKit™ discussion group on Google Groups
  • Download the JuiceKit™ library from github
  • Contribute back to the JuiceKit™ community to make the JuiceKit™ even better

While Juice continues to focus on designing and providing software solutions (as opposed to toolkits) for our clients, we believe offering the JuiceKit™ as open source will benefit the information visualization community we try to serve. In the future we will continue to extend the JuiceKit™ with other components and technologies.

Good luck, and make sure you share how you’re using the SDK so we can continue to drive it in the right direction not only for us, but for you as well.