Introducing: Heads Up Display for Chartbeat Publishing

It’s going to be a cool and breezy 72 degrees in NYC today after weeks of hot and humid weather. So learning that this morning, I threw on a bright sundress and grabbed a cardigan as I sprinted out the door. I made a data-informed decision even if I wasn’t totally conscious of it.

That’s how data works. It’s how it should work. Data is everywhere. We live in a world of information. So why should we only see it in the form of charts, graphs, reports, and dashboards?

We shouldn’t. That’s why we built Heads Up Display for Chartbeat Publishing: to give editorial teams an incredibly intuitive and efficient way to see their site’s data – right on their site.

Meet Heads Up Display

This idea of integrating data directly into the editorial workflow has always been the goal of Chartbeat Publishing. We want to give you a sense of what’s happening on your site, alert you when something unusual is occurring, and then provide you with the information to take action. Rinse and repeat.

The dashboard does this brilliantly and with incredible depth (or at least we hope and hear that’s the case!) – but it’s a destination you need to go to outside of your normal routine, an extra step for you editors.

Heads Up Display comes to you. It takes literally one click to activate, and sits in your browser, bringing you immediate signals about the health of your page. It provides you with a unique set of data designed to help you optimize your page – homepage, section-front or article.

All the power in one little bar

Your menu bar is your power panel. It gives you all the vitals for the page you’re on:

  • Total number of concurrents for the page: Clicking the concurrent number brings you to the dashboard for a deeper look at your audience and their behaviors.
  • Traffic sources: Opens up to give you further details on your referrers, including a new feature that’s only in the Heads Up Display – specific referrers through Internal sources. That’s HUGE for story pages. It lets you understand which articles within your site are driving the most traffic to a particular page.
  • Most clicked pages: Gives you an easier navigation option – click on this one, and we immediately scroll you to the article on the page (almost like magic!).

Quick homepage performance

Use Heads Up Display on your homepage to show you how well your homepage is driving traffic to the stories you’ve promoted.

The ranks of each story, marked by pins, provide a super-fast sense of which stories are working and which ones are at the bottom of the pack.

Then add on the velocity arrows within the ranks to see how quickly the story is accelerating or decelerating. If there’s an up arrow, it means the this story is accelerating, so you should wait and see how it plays out – maybe it was recently promoted to the position. If there’s a down arrow, the pick up is starting to slow down.

Detailed real-time click rate

Click a pin to see the click rate of that story: how many clicks per minute it’s getting in real time, and you can also see how the story’s been trending over the past 30 minutes. If the trend line seems to be falling, then it might be time to swap in another story.

Scroll depth by page

Heads Up Display on an article gives you valuable insight into how people are interacting with your story right now.

Check out the Scroll Depth on the right side of your page; this is in context so you know exactly how far down the page your readers are reading. If most readers are abandoning early, then you might want to play with the content or add something more interactive like a video or an image.

In this view, you’ll also see you how well related stories on that page are performing – as long as those stories are on your site.

As with anything we launch, what you’re seeing today is just the beginning. There are a million things we want to add and iterate on. What makes it in first is often decided by your feedback.

If you aren’t a Chartbeat Publishing client yet, let us know what questions you have and how we can help. And for those of you using Heads Up Display, if you have any ideas, requests, or questions, please feel free to chat with our Chartcorps during a free online workshop, or email me directly at Looking forward to hearing what you think!

Sneak Peek: It’s about to get REAL Social

How well do you know your social audience? I mean really know them – not just that they come from Facebook, but how they interact and engage with your content?
Well, after we launch our brand new version of Social View for the Chartbeat dashboard next week, you’ll know them a whole lot better.

Alongside Social Concurrents, you’ll see a completely redesigned and pivotable Social Timeline.

What about tweeting directly from the dashboard? That might be coming your way too…

But we’ve said far too much already. Check back next week for the whole shebang!

Sneak Peek Launch: Heads Up Display

How cool would it be if you could see what people are doing on your site, on your site??

That’s what we thought too. The coolest!

In a week or so, all you Chartbeat Publishing clients will be able to get real-time site data without leaving your site  – literally on or – through our new Heads Up Display. You’ll get critical information about the performance of your homepage, section fronts, articles overlaid right on your browser. It’s how people are interacting with your content in real time, without having to go to the dashboard.

Is your prominent story also the top performer? What’s gaining momentum right now? Or what should be, and isn’t? You may be surprised. We certainly have been. As have our alpha testers.

This shot is one of the early sketches of what the Heads Up Display could look like on top of your homepage. It’s changed a little bit since then. We’ve removed the pencil, for starters.

If you want even more of a sneak peek of what we’re building, follow our crazy talented designers on Dribbble. They share early sketches all the time.

Check back in a few days when we launch Heads Up Display to see it in action and give us your thoughts.

How transparent is your data? Probably not enough.

Why the hell would anyone want to share their site data?  At first, it seems only a lunatic would willingly share their precious treasure trove of data. I mean, it’s scary: it allows your readers/visitors to judge you and your competitors to use it against you.

But it’s also the only real way to be successful in the real-time world.

Internally, democratization of data autonomizes your teams to make smarter collective decisions the second they need to be made. We talk about that a lot. It’s what the most successful teams do best.

And sharing it externally drives new layers of content discovery and engagement opportunities for your readers. 

Your readers want to know what other people are reading. That’s why “Popular Stories” or “What’s Trending” collections that you create are such a hit.

But they also want to know what’s interesting and niche – the cool factor of finding something before anyone else does.

Real-time transparency, sharing your site and content information with not just your whole team but your readers, opens up this whole new world of discovery.

That’s exactly what BusinessInsider is doing:

Because not all articles get as much traffic and engagement as the top story. And at times, it’s not the headlining story that people want to consume and share.

That sense of discovering what is interesting before that mass tipping point is awesome for readers – particularly the socially savvy ones looking for something that aligns with their interests/personal brand to share on their social networks.

If your readers have access to the real-time data on a site, nothing stops them from noticing an upward trend or clever headline and jumping on board and reading it, and sharing it.

To us, real-time data has always been about helping content creators adapt to the unexpected and unknown, but with readers doing the same, the possibilities become endless. The way your brand and content are spread in new ways grows exponentially.

Soon, we could see real-time transparency as the expectation and not the exception, as more and more readers embrace digestible data in their everyday life and become accustomed to seeing insights before making any decisions – including reading an article or visiting a page.

Introducing Engaged Time to Chartbeat Publishing

Built by the newest member of our front-end team, Nick “Nitro” Moy, Engaged Time makes its Chartbeat Publishing debut today!

Why Engagement?

Why is this a big deal, you ask? I guess we should start with our thought process around how the publishing audience specifically consumes news content, which led to our focus on engagement as a metric.

I’m not sure anyone would argue, at this point, that we can’t be judging our content solely by traffic numbers anymore. Traffic can be incredibly misleading when viewed in a vacuum. Volume is obviously fantastic – you need to know people are showing up, after all –  but how do you know they’re actually reading and consuming your content?

You need to know that you are keeping your readers attention, making sure they’re scrolling and reading down the page to the meat of your content vs. just knowing that you’re  an ace headline writer that gets people to the page for a second before they bail entirely.

That scenario happens all the time these days, right? Everything is shareable, we click on pretty much any link in front of us. So your job is not to just create and promote stories that intrigue, but you must must must engage. Otherwise they don’t remember (or care) that they’ve been to your site at all.

What is Engaged Time?

If you’ve been with us for a bit, you know we’ve shown you engagement metrics in the past. We’ve shown you a dial that shares the readers that are reading, writing, and idle.

Well, this launch represents a new way of thinking for us and all you big-shot publishers. It shifts engagement from being only a state-based measure (reading and writing) to a measurement of time.

Why the change? Well, what can you do with knowing 34 people are writing on this page right now? Is that good? Is that better than it normally is? Should you get in there and start commenting on it? You have no idea.

So, we watched how journalists and editors talked about, thought about, and used the idea and elements of engagement and realized that you guys need something that’s a bit more quantifiable, something you can measure yourself against, instantly understand the context behind it and – most importantly – know how you should act on it.

That’s why we landed on Engaged Time.

We launched this concept in the Chartbeat dashboard about a month back:

Engaged Time on the Overview shows the aggregate total Engaged Time on a site in a heads-up way like “1 year, 2 months” of attention on the site, so Chartbeat members can compare against the same day over the past month.

On a content level, we display the average Engaged Time on that article – so if Peter, Paul, and Mary are all reading this page and Peter spends 1 minute, Paul spends 30 seconds, and Mary spends 45 seconds it means this page has an average Engaged Time of 45 seconds.

You publishers have a very different primary goal than the Chartbeat product’s audience. We learned by talking to and user testing with lots and lots of our Chartbeat Publishing clients that that main goal is to understand not just how the top pages are performing in both traffic and engagement, but also to find the highly engaging pages further down in the stack – maybe revealing it in your 30 or 40th traffic-ranked article. You need a way to highlight and work with those diamonds in the rough.

That’s precisely how we’ve designed Engaged Time for Chartbeat Publishing:

You can now quickly assess how you’re performing today through the brand new Engagement Module on the main dashboard view:

We’ve added a new Engagement Module on the main dashboard view, so you can quickly understand your site’s performance today. In addition to the overall Average Engaged Minutes, we also show you how your stories are distributed by engagement.

Total Engaged Time gives you a sense of aggregated growth over the course of the day, and of course, we still have our reading and writing metric represented as a percentage of engaged. Click on the “Engaged” label at the bottom, and all your stories will sort by the highest Average Engaged Time to the lowest.

Like everything else in Chartbeat Publishing, your Engaged Time metrics pivot when you switch your dashboard to a Section or Author view, and a Page view. In fact, that’s where things get super interesting.

Click on a page and see how many Engaged Minutes it racked up over the course of the day, and figure out where it stands in terms of Engagement against the other stories (through the distribution graph).

This pivot-screen shows you that you can now sort by engagement and view your site through this new lens, one that goes beyond traffic. That bar graph shows you the relationship between engaged members (those actively reading, writing, scrolling) on your site. The little time circle on the page shows you the average Engaged Time on that page.

Just an FYI – we created a minimum traffic threshold on the sort, based on your highest trafficked page, so you will see relevant content at the top (not just the random page that one guy in Detroit finds so interesting he’s been on it, actively reading and analyzing for two hours so that it skews your results).

Within this view, you’ll instantly:

  1. Find out why this story is SO engaging. What can you learn from it and potentially spread to less engaging stories?
  2. Decide whether to promote it further. Conceivably, this is what is keeping people on the page longer, so it’s your opportunity to drive them to a second story. Engaged Time tells you how much people love you. Make sure they stay in love.

How is this Engagement Metric Different from the Rest?

Ugh. Really? Another engagement metric? None of them work. I can’t do anything with them.

Yeah, we hear you. We agree. Which is why we spent months and months and months and months building Engaged Time to be THE metric.

We’re that sure about this metric because it’s built around what makes Chartbeat fundamentally different: Our technology.

Most analytics sites (traditional and real time) measure the stuff happening on your site by the event: the page load, the click.

So, if you’ve visited Page A then Page B, the time in between those two page loads is your Time on Page.

But…what happens in between those two page loads? Are people actually reading? Is their tab just open in the background while they answer emails? What if they never make it to the next page? If this last bit is the case, how do you know if you have just inflated traffic numbers on an interesting headline that people aren’t actually scrolling or reading?

We’re built with a totally different state-based system.

We see what your readers are doing in between the clicks.

We can tell if they’re actually engaged if they’re reading (scrolling, page up and down) and/or writing (keystrokes). If they aren’t engaged in either action for 30 seconds, then we consider them idle, and they’re not counted towards Engaged Time.

Great. This is cool. But…what do I do with this metric?

We’re seeing each of our publisher friends, unsurprisingly, using Engaged Time in different ways. But here are a couple of tips:

  • Keep an eye on the engagement number for stories that receive spike alerts.
  • Highly trafficked stories are already exhibiting unusual behavior, so you want to try and increase Engaged Time on them as well to keep this audience as focused as possible.
  • If the Engaged Time is low, then you might want to give them a boost:
    • Add images, video, pull quotes, call outs to the most unique facts
    • Add related links and drive an already engaged audience to more and more engaging content.
  • Use Engaged Time as your decision-maker: If you’re trying to decide between two stories to promote through social channels or on your homepage the most engaging story should win.

But we also want you to tell us. You know how we work — we watch how you work. So keep us posted on how Engaged Time is working (or not) for you. Leave us notes in the comments for everyone to see or shoot us an email at

Designing Data – Part 5: Launch and Iterate

We’re asked about our design all the time – usually in an incredibly kind way full of high fives and “how’d you do that?!”s but sometimes in a “ugh, did you even think about talking to a customer??” kind of way. So, we decided to give you a week-long deep dive into our design process in this “Designing Data” series. Today’s the last post in this series…though iterating never ends, so maybe there will  be more down the line. Stay tuned!

We make changes constantly. Seriously. Every day.

Sometimes they’re small and only our most dedicated users notice them; sometimes they entirely change the way people interact with our data. We don’t look at these changes as regressions, dead ends, or a waste of time; we look at this as the right way to design products.

We vet everything intensely, but we can only do so much in the confines of our office with a few dozen users in pre-launch testing. And the only way to know if we’ve succeeded is to put it all out there into the real world (even if it sometimes results in a few harsh Tweets headed our way).

So, when a new design is launched, we can’t just pick up and move onto the next thing. We listen. We read every email coming into customer service, we consider every tweet, we grab everyone who wants to talk to us about what we’ve done and we listen. We figure out where things rocked and where things sucked and then this whole cycle starts again.

If you’ve been following this design blog series, you know that in our initial design we tried to answer the question our users were always asking, “what’s special happening on my site right now?”  with the new dashboard Overview.

We stripped out a whole bunch of detail and put the focus on Notable Pages (an algorithm that detects what pages have unusual traffic) and Peer Stats (information from similar sites.)

With the combination of those two stats our dashboard was always able to alert our users when something surprising, unique, or interesting was happening.

But when it got out there into the wild…it turned out that people wanted to see more.

They didn’t realize it at first, but it wasn’t just “is something special happening?” that they wanted answered rather it was “is everything normal?”

While the questions sound similar, there is a world of difference between the two. We had built a dashboard that always caught and called out the big stuff, but it had trouble distinguishing between a normal day and a really bad one.

We thought users would turn to the other views by clicking down their left-hand nav to understand these more nuanced things, but we were quickly told they wanted to put these new things on a second screen to always have a pulse of their site, even if it was just to tell them that everything was going smoothly.

So we went back to into research mode. We asked what it meant when something was running smoothly, we watched how people used a dashboard when they weren’t paying attention, and we found out what screen they put our dashboard on.

We learned a lot of little things (like that people liked to put our dashboards on big screens, but there wasn’t enough contrast in the colors to display information well enough at that scale).

We got some bigger ones, too, that weren’t solved by changing colors.

It turned out it wasn’t just the surging pages they wanted to see… they also wanted to know if anything unusual was happening with their more always-trafficked content.  So we brought back Top Pages and showed them with the Notable ones as context.

Now the dashboard doesn’t just show you when something special is happening – it also lets you know when you’re doing alright and everything’s just fine.

But that only solved things on the individual page level when the information about the people sending it was every bit as important.

So we changed the visualization of Traffic Sources to show two new things: the top referring domains and search terms and how your performance today compares with your average performance.

Now, no matter if your day is normal, great, or terrible, you can tell right away. And that was the point all along.

So welcome to our new Overview page. We think it answers the three questions that were most important…

  1. How many people are on my site?
  2. What are they looking at?
  3. Where are they coming from?


…but maybe you don’t. That’s awesome. We want to know. This process won’t stop until we do…

Designing Data – Part 4: Design and Prototype

We’re asked about our design all the time – usually in an incredibly kind way full of high fives and “how’d you do that?!”s but sometimes in a “ugh, did you even think about talking to a customer??” kind of way. So, we decided to give you a week-long deep dive into our design process in this “Designing Data” series. Yesterday we looked at the data, and today we’re talking about designing against it.

Once we know that we’re solving real problems and using good data, we get to the part that everyone sees, touches, and (hopefully!) falls in love with: The design.

While we love delighting users and get pretty jazzed when people ohh or ahh over what they see on screen, we make sure to have a few people on our product design team who are solely responsible for making sure that the design uses and highlights the data we’re displaying in the best possible way. So that it’s not just pretty, but usable.

Although this is the stage where pixels are pushed, lines of code are also written. Usually, we need to prototype a live design to make sure we can touch it, vet it, and sometimes get user feedback on it, regardless of how rough it is.

Whether it’s quickly building a navigation system to make sure it functions instinctively or prototyping a visualization with real data pumping through it to see what it looks like — a functioning, built design lets you see things that you never would in the static world of Photoshop.

For this very reason, every designer on our team is also a developer.

When pulling together the original Chartbeat dashboard Overview, we went through a bunch of prototypes that were pushed out to small groups of our users.

Well, they didn’t love everything, that’s for sure. That sucked. We’d spent hours/days/weeks designing and prototyping….and it just didn’t work. But we don’t try to make it fit or fall on our sword and go with it anyway. We made that first version of the Overview better.

From the beginning, our goal for this view was to provide a high level, at-a-glance view of the site so it was obvious if something interesting or unusual was happening.

Some of our early concepts were knocked down by users mainly because we weren’t answering the questions they were asking, the needs they had at that instant level.

Honestly, many of these concepts were visually much more appealing than the design we launched with but, as always, the goal isn’t only to make things pretty; the goal is finding the delicate balance between beauty, usefulness, and delight. To us, that’s the core of good design. That’s is what makes people who don’t have time for raw data able to understand, use, act on, and enjoy our products.

So what were those pretty (but not so useful) designs that didn’t make it for Traffic Sources?

The radar chart is a beautiful visualization and has the advantage of being able to quickly compare shapes, but it falls apart in the eyes of many users who are trying to get precise values of individual traffic sources.

A radar chart is intended to show balance, when in reality most sites don’t have (and shouldn’t have) an equally balanced set of traffic.

So we canned that guy and moved on to the dot chart.

The dot chart was definitely cool, but  it didn’t work for us a different reason. We liked the idea of being able to show a shape, or thumbprint, of your site’s traffic and added a connecting line between the values. The line didn’t have a value – it was just meant to aid the eye in spotting the dots easily.

But users were interpreting it is a relationship between each traffic source, which it certainly wasn’t meant to be. We took a hit on that one for sure. The last thing we ever ever want is to launch a misleading visualization!

Then came the circle chart. This guy had a lot of promise. Circle charts can be beautiful and usable, but its main weakness really shows when trying to compare values on different radii. The eye gets a little tripped up. Not to mention that it’s tricky to grasp at a quick glance – the whole point of the Overview. So we inevitably trashed this guy, too.

How did we land on our “final” design? Check back tomorrow to read our last piece of Designing Data: Launch and iterate.

Designing Data – Part 3: Look at the Data

We’re asked about our design all the time – usually in an incredibly kind way full of high fives and “how’d you do that?!”s but sometimes in a “ugh, did you even think about talking to a customer??” kind of way. So, we decided to give you a week-long deep dive into our design process in this “Designing Data” series. Yesterday we identified problems through user research, and today we’ll look at the data to validate our thinking.

We’ve identified the problem. Next step is to start sketching or to open up Photoshop and start throwing pixels on the screen, right? Nope. Negative. Wrong.

We always look at the data before even thinking about design.

We’re a company that eats, sleeps, and dreams information and insight, and we design from what we have — not what we wish we had.

It’s so easy to spend days pushing pixels in Photoshop making the perfect design for the perfect scenario, but it’s all meaningless if the result doesn’t carry over to reality. Great mockups are easy. Designs that work well with real data of all kinds are hard. Some days, really hard.

When we were designing the Overview on the Chartbeat dashboard, we took each question people were trying to answer and made sure the data we were tracking matched up against those questions to provide real, unique value.

We questioned and vetted every decision as to whether or not to put each data point on the Overview, a secondary page, or not include it at all. We looked at client after client, page after page after page trying to find places where our data fell down.

  • People wanted to know where traffic was coming from. But did that mean dropping a list of each referring site was be enough?
  • How did the dashboard look if your site had very low traffic, like 0-10 concurrents?
  • What if it had a ton, like 500,000+?
  • What if everyone was coming from search? Or social?
  • What if you got a flood of traffic all at once? Would the visualization work? Would it tell you that something special was happening?

To some people it can seem like overkill. But when you’re working with data, you can’t make assumptions and expect the design to match every possible form of data across thousands of sites.

Otherwise, it’s a ridiculous waste of time. Which is why we’ve gotten into the habit of  ending meetings the second someone says “Well, if the data says ____” by responding with “Let’s go look at it.” And all gather around my screen, or Isaac’s (our chief data scientist’s), or Matt’s (our UI designer).

We tear apart every single concept that makes it to this second stage in the process. When they survive this grueling data-review round, the fun part begins: Designing and prototyping – which we’ll dive into tomorrow.

We’re On TV!

We’ve been working closely with our good friends over at Patch since Chartbeat was born, essentially. They’re always testing out cool stuff and truly understand how to put real-time data to work.

So when they come to us with new ideas of how to use their Chartbeat data, we pretty much always jump at the opportunity.

Our latest love child? Putting online data on TV. That’s right — three-screen Chartbeat, baby!

Patch and PIX11 News took their Chartbeat Big Board and used it to share what people are reading and talking about in New York, New Jersey, and Connecticut right now. Using online content data to inform offline/on-air topics. Awesome, right?

What ways are you guys using the Big Board? Up in your office? On your own personal second/third monitor? Share the Big Board love!

Designing Data – Part 2: User Research

We’re asked about our design all the time – usually in an incredibly kind way full of high fives and “how’d you do that?!”s but sometimes in a “ugh, did you even think about talking to a customer??” kind of way. So, we decided to give you a week-long deep dive into our design process in this “Designing Data” series. Yesterday we covered the right mindset, today’s all about user research. Check in tomorrow for the looking at the data portion of our design process.

We don’t make a single move without making sure it will solve a real problem for real users.

Whether they’re sitting here at the Chartbase telling us what makes their jobs hard, on a screen-share showing us how they use the dashboard , or through behavioral data from our APIs — everything we do comes from real people and their real usage. Not best case, hypothetical personas who might one day open up our dashboard.

That’s why we’re so serious when we talk about learning from our users. They are as much partners as they are anything else and we just couldn’t deliver without them.

The biggest thing we’ve learned is to always be listening (ABL, if you will). And really listening. Not just hearing what they say and delivering that exact feature. But truly understanding what will make them better than they every thought possible. We can’t build anything until we really get that.

But understanding and solving are very different things. Don’t try to solve everything or even anything right off the bat.

In our early user research, we’re just trying to figure out the common problems people bump into.

We don’t ask “what don’t you like about our dashboard?” we ask “what makes you come to Chartbeat? Why do you want to see data at all?” The former results in feature requests while the latter uncovers the things that make life harder — and we’re way more interested in those.

Until we know why people turn to us we can’t solve their problems, we can’t make something that will make them better.

For example, in talking to people about our recent Chartbeat dashboard redesign we realized that, at the highest level, people had three questions they turned to Chartbeat for:

  • How many people are on my site?
  • What are they looking at?
  • Where are they coming from?

In short, they needed the pulse of their site.

So, naturally, we decided to build something that delivered just that.

Where next, you ask? Well, looking at the data of course! We’ll get there in tomorrow’s edition.