Launched: the new dashboards UI

July 07 Bullet_white By Derek Bullet_white Posted in Features

Dashboards and charts are the swiss army knife of monitoring tools. In fact, dashboards and charts account for roughly half of all page views in our UI.

A couple of months back, we decided it was time to revamp our dashboards and charts experience in Scout. Like a swiss army knife, our goal was to strike the balance between utility and ease-of-use. Today, we're excited to rollout our the new experience to everyone.

The new UI delivers a buttery-smooth experience while providing what you need to monitor your growing server footprint.

Unifying dashboards and charts

Dashboards and charts used to be two separate areas of Scout: now, two have become one. It's never been easier to get all of your key metrics onto a single page.

dashboards

The sidebar lists all of your metrics. As your Vim-loving colleague would tell you, the fastest way to work is via your keyboard. It's the same with dashboards: to filter metrics, just start typing. Use your up/down keys to page through metrics and hit enter to create a chart.

When you add a chart, you'll see that metric across all of your servers. Say goodbye to clicking check boxes!

add chart

What if you want to filter metrics (example: memory usage on just your application servers)? Easy stuff. Use the global filters at the top of the page to apply that filter to every chart on the page:

global filter

...or just use the chart-specific settings to apply it to just this chart:

chart filter

Drag and Drop + Resize

You can drag-and-drop plus resize charts at-will to get your dashboard exactly how you want it.

drag and drop + resize

Lightweight: embrace ad-hoc

Frequently, we'll whip up a dashboard for something we want to inspect. Dashboards don't get in the way: you don't need to name dashboards or charts just to view or share a dashboard with a colleague.

Elastic

As you add/remove servers or plugins, charts will auto-update with the changes. Filters are applied via environment names, role names, and server names - not specific IDs - so they stay current as your infrastructure grows.

Sharing is caring

Want to share a dashboard with a friend that doesn't have a Scout account? No worries - just click the "Share" link:

share

Less noise w/range

When you have many servers, charts get very noisy with lots of lines. Our range display solves this problem by displaying a line for the average and a band for the min/max across all of your servers.

You can always toggle to the breakout display to view a line for each server.

range and breakout

Full-width

The charts will resize dynamically as you adjust the width of your browser window.

Synced tooltips

When inspecting a chart, you'll see a vertical line on the other charts over that same point in time. With this, correlations become clear.

Easy date navigation

Just like before, our flexible date parser makes it easy to select the end time for a chart. You can select between different durations and move forward+back in time.

date select

What about your existing charts and dashboards?

You'll be able to access these under the "Legacy Charts" navigation area in Scout. We'll be deprecating support for old dashboards and charts in the next several months. Rest assured we'll communicate this timeline as it develops.

We've been using the new UI internally for a while and we can't imagine going back. Charge is hard, but we think this will be a transition you'll be excited about.

Feedback

As always, send your thoughts and bug reports to support@scoutapp.com.

Get notified of new posts.

Once a month, we'll deliver a finely-curated selection of optimization tips to your inbox.