dashboard design

Dashboard Design, Tips & Tricks

KEVIN MCGINLEY

medium.com/@kevin_mcginley @kevin_mcginley linkedin.com/in/kevinmcginley

Think Of Yourself As An Artist

It’s Your Job To Capture The Beauty Of Data

Your Tools Are Lines…

And Angles

Colors That Blend…

Colors That Shade…

Colors That Contrast…

And Colors That Sizzle

You Care About Shapes…

And Shape Alignment

Everything Looks Good In Its Place…

And We Notice When Something Is Off

Contents

•Dashboard Design Tips • Color • Lines And Shapes • Chart Tips •Dashboard Layout

Side-By-Side: Overview

Side-By-Side: Office Details

Color Combinations Matter!

www.colorbrewer2.org

Combinations and Consistency

Color palettes don’t match and Brands

colors are inconsistent.

Color palettes don’t match and Brand

Brands are consistent and are part of the

same palette.

Use Color Brewer To Obtain Color Palettes

All colors used on the page are part of the same palette or are

neutral.

Each object has its own color palette and

sometimes mixes within an object.

The Beauty Of Grey: Good For Conditional Formatting

Dark blue bars draw attention away from min/max bars/dots.

Light blue headers and

dark gray total shading is distracting.

Use of light grey throughout causes

conditional formats to stand out more.

Lines And Shapes

Avoid Gridlines In Charts

Color palettes don’t match and Brands

Gridlines are drawing attention away from the important lines.

Your eye focuses on the lines that matter.

Use Thinner Lines In Line Charts

Use 2pt lines in line charts; can be defaulted

on the server.

OBIEE defaults to 3pt lines, which can be hard to read when

they overlap.

Use Section Lines On Dashboards

Objects appear to be floating in space.

Section lines anchor each object to an area

of the dashboard.

Bars Instead Of Circles For Gauges (And In General)

The horizontal bar style gauge more closely resembles Few’s Bullet Chart.

Stephen Few argues that circular objects can always be better

represented as rectangles.

Chart Tips

Provide A Legend When Using Conditional Formatting

Stick to fewer colors, consider colors within

the same hue, and provide a legend.

There are 8 color shades in these

gauges and we know what none of them

Consider Fewer Y-Axis Values With Smaller Numbers

Values need only provide a frame of reference. Consider smaller fonts,

abbreviated numbers (include decimals), and only 3 ticks for

bottom, middle, and top.

It’s not necessary to have 7 numbers here; it clutters the chart and

distracts from the chart focal point (the line).

Lose Axis Labels; De-emphasize Legends

The chart title indicates the legends and they are obvious; shrink the font sizes on legends to keep the focus

on the chart lines.

Neither Y nor X-axis labels are needed here and they

consume space. The legend contributes to the clutter.

All About That Quadrant: Scatters & Bubbles

Lose the gridlines and reduce the tick lines to 3 to emphasize the four

quadrant aspect of a scatter or bubble chart. Use the chart title for

the bubble size axis label.

The extra gridlines distract from reading the bubble chart

and the trellis version is to small to make sense of.

Stack It Real Good

There is no way to tell the year total in the

chart and the chart is more cluttered.

Stacking the bars helps keep the total year number in perspective

and simplifies the chart

Performance Tile Tips

Use the larger size tiles, avoid bold fonts, gradients, conditional formatting, and

stick to soft colors.

Bold numbers are harder to read and the underline style adds

no value.

Dashboard Layout

Use Space Carefully

Increase default chart sizes, use larger tiles, and arrange objects like you’re packing a

car or a grocery bag.

Objects are smaller than they need to be and aren’t arranged

optimally.

Make Good Functional Decisions

This Trellis Chart makes more sense as a standalone bubble.

This column prompt would be better suited as a column selector.

Shading not necessary (assumed to be a

mistake).

Column selector on the bottom because it

affects the X-axis.

More Functional Decisions

Hide a table behind a chart with a view selector to both

meet requirements and drive visual dashboards.

Objects are smaller than they need to be and aren’t arranged

optimally.

The intended but missing filter view

report added below the prompts.

Live Dashboards

dashboard design

Technology

sistem dashboard management

documento funcional dashboard

excel dashboard 2019 - cursosbyte.com.br · dashboard, mas...

bnx dashboard

construction dashboard

e-library dashboard

dashboard instruction

visys dashboard

dashboard ssqs sekolah

vera dashboard

blackboard dashboard

dashboard design and layoutyang kini dilengkapi transmisi...

nvvb dashboard congres - werving · 2016. 5. 25. · inhoud...

xcelsius - sap crystal dashboard design data connection for...

logo dashboard

corporate dashboard

kmpoint dashboard server

installation und dashboard-design · cobra bi-modul 9 so...

dashboard uxit 2014

seagate dashboard ug - gfk etilize · 2015-05-21 ·...