Rules 1-7

Get the message across.

Seven rules about what the reader takes away: the kind of page, the one message, the chart, the colour, the comparison, the clutter and where the eye lands first.

Rule 1

Decide: presentation or dashboard. Every other choice follows.

Presentations and dashboards

A presentation page argues one point the reader should act on. A dashboard lets the reader monitor and explore. Cole Nussbaumer Knaflic draws the same line in Storytelling with Data: exploratory analysis is opening a hundred oysters; explanatory analysis shows the two pearls you found.

A page that tries to do both fails at both. Its fixed title can turn false the moment a slicer moves, and its point drowns among visuals that answer other questions.

BeforeOne page trying to be both
Report page titled Production loses 40% of its staff, three times the rate in Sales, with three slicers beside the title, four cards, four charts and a callout. Red markers 1 to 3 point at the slicers, the crowded page and the callout.
  • 1 A fixed claim in the title, next to three slicers that can make it false.
  • 2 Four cards and four charts compete with the one point.
  • 3 A callout tells the reader what to do on a page built for exploring.
AfterTwo pages, each with one job
Two report pages. Presentation page: title Production loses 40% of its staff, one bar chart with Production in blue, and a callout Fix Production first. Dashboard page: title Where are we losing people?, three cards, two grey charts and three slicers on the right.
  • The presentation page has an action title, one proof chart and a callout. No slicers, so the claim stays true.
  • The dashboard asks a question instead of stating a claim, and keeps its slicers on the right edge.
Presentation pageDashboard page
JobArgue one pointLet the reader monitor and explore
TitleThe finding, with a numberA question, or a title built from a measure
VisualsOne or twoSix to ten, read from the top left
ColourGrey plus one accent on the pointCategories may get colours; red for exceptions only
SlicersNoneUp to three, on one edge

Both page types are built side by side on Presentations vs. dashboards.

In Power BI

  1. Build the two as separate pages. Right-click the page tab, choose Duplicate page, and strip the copy down to one proof visual for the presentation version.
  2. On the presentation page, delete the slicers. If a filter must stay, set it in the Filters pane and click its lock icon so readers can't change the numbers under the title.
  3. On the dashboard page, stack the slicers on the right edge. Use View > Sync slicers if they should carry across pages.
Rule 2

One page, one message. If the title needs "and", split the page.

Presentations

Working memory holds only a few things at once. A page that makes two claims makes the reader choose which one matters, and most won't choose yours. Consulting slide practice (McKinsey, BCG, Bain) runs on one message per slide, stated in the title.

Everything on the page should prove that one message. A chart that shows something the title doesn't claim belongs on another page, in a drillthrough or in a tooltip. Dashboards follow a looser version: one purpose per page, such as monitoring or comparing.

BeforeTwo claims joined by "and"
Report page titled Production loses 40% of its staff, and Sales pays the most, with three visuals: turnover by department with Production in blue, average pay by department with Sales in orange, and hires by year.
  • The title makes two claims. A blue bar and an orange bar pull the eye in two directions.
  • Hires by year proves neither half of the title.
AfterOne claim, two proofs
Report page titled Production loses 40% of its staff, three times the rate in Sales. Left: share who left by department, Production in blue. Middle: share of everyone who left, Production 81%. Right: callout Fix Production first.
  • The first chart shows the rate. The second shows the size: 83 of the 102 people who left worked in Production.
  • Pay gets its own page, with its own title.

The "and" test. Read the title out loud. If it needs "and" to join two findings, you have two pages.

In Power BI

  1. Write the page title first, in a text box (Insert > Text box). Then check every visual against it.
  2. Move detail to a drillthrough page: on a new page, drag the field (for example Department) into Drill through in the Visualizations pane. Power BI adds a back button.
  3. Or move it into a tooltip: on a new page, open Format page > Page information, turn on Allow use as tooltip, and set Canvas settings > Type to Tooltip. On the main visual, set Format visual > General > Tooltips > Type to Report page and pick that page.
Rule 3

Choose the chart from the message. Name the comparison first.

Presentations and dashboards

Gene Zelazny's method in Say It with Charts: write the message, work out which comparison it makes, then pick the chart. He names five comparisons: part of a whole, ranking of items, change over time, frequency (how values spread out) and correlation (does one thing go with another). Picking from the Visualizations pane first means bending the message to fit the chart.

BeforeChange over time, in a pie
Pie chart titled Count of Employment Status by Term Year, six coloured slices for 2011 to 2016 with a legend.
  • Years are a sequence. A pie has no order, so the jump in 2015 becomes a slice of 26%.
  • The reader matches six colours to a legend to find each year.
AfterChange over time, as a line
Line chart titled Exits jumped to 26 in 2015, and 2016 had 14 by June. The 2015 and 2016 points are labelled.
  • Left to right is earlier to later, so the 2015 jump shows at a glance.
  • The subtitle flags that 2016 is only half a year.
BeforeOne number, in a chart
Column chart titled Turnover Rate with a single column labelled 0.34, gridlines and an axis from 0 to 0.40.
  • An axis, gridlines and a column, all to show one value.
  • 0.34 of what? Nothing says.
AfterOne number, as text
Card reading Employees who have left: 34%, 102 of 301 employees, 2006-2016, with Production 40%, Sales 13% underneath in blue.
  • Knaflic's advice: for one or two numbers, big text beats a chart.
  • The comparison sits right under the number.

Use the comparison to pick the chart:

Your message saysComparisonChart
X is bigger than Y, or X leadsRankingBar chart, sorted largest first
X rose, fell or jumpedChange over timeLine chart (columns for a few periods)
X is a share of the totalPart of a wholeStacked bar, or a pie with two or three slices
X goes with YRelationshipScatter chart
Most cases fall in this rangeFrequencyColumns of value ranges (a histogram)
Here is the numberSingle numberCard or big text

In Power BI

  1. Select the visual and click a different icon in the Visualizations pane. The fields move across where they fit.
  2. Pie to bar: choose Clustered bar chart, then More options (...) > Sort axis, pick the measure and Sort descending.
  3. One number: choose Card (new). Put the context in Format visual > Reference labels.
  4. A relationship: choose Scatter chart, then add Analytics pane > Trend line.
Rule 4

Grey everything, then one accent. Colour only what carries the point.

Presentations and dashboards

The eye sees colour before it reads a single word. Knaflic calls this a preattentive attribute. When every bar has its own colour, nothing stands out, and the reader hunts for a meaning the colours don't have.

So start grey, then colour only the bars, line or number the title talks about. Keep the accent to about a tenth of the page. Dashboards can give categories their own colours when the same categories repeat across visuals, but within one visual the rule holds.

BeforeA colour per bar
Bar chart titled Sum of Total by Employment Source, fourteen bars in eight repeating default colours.
  • Fourteen bars, eight colours, no meaning. The palette repeats, so MBTA ads and Social networks share a blue.
  • The eye bounces between colours instead of reading the ranking.
AfterGrey, plus one accent
Bar chart titled Two sources take 25% of the recruiting budget. MBTA ads ($11.0K) and Diversity Job Fair ($10.0K) in blue, all other sources grey.
  • Two blue bars, the two the title names: $21K of the $84K spent in the year.
  • Grey is context. It's still there, it just doesn't shout.

The squint test. Glance at the visual for one second, then look away. Where did your eyes land? That should be the point in the title.

In Power BI

  1. Create a colour measure:
    Bar Colour =
    VAR Src = SELECTEDVALUE ( 'Recruiting Costs'[Source] )
    RETURN
        IF (
            Src IN { "MBTA ads", "Diversity Job Fair" },
            "#2A78D6",  -- accent
            "#C8C6C4"   -- grey
        )
  2. Select the chart, open Format visual > Bars > Colors, click fx, set Format style to Field value and pick Bar Colour.
  3. Without DAX: in Bars > Colors turn on Show all, set every bar grey and one blue. This version doesn't follow the data, so use it only on fixed presentation pages.
Rule 5

Every number needs a comparison. Show the yardstick on the visual.

Presentations and dashboards

The first thing a reader asks of any number is "compared with what?". Turnover of 24% in IT/IS: good or bad? Nobody can say until there is a target, last year's figure, the company average or a peer next to it.

IBCS builds this into its notation: actuals, previous year, plan and forecast each have a fixed look, so the comparison is always on the chart. You don't need the full standard to use the idea. One dashed line at the company rate does most of the work.

BeforeNo yardstick
Grey bar chart titled Turnover by department with no reference line.
  • The reader sees a ranking but can't judge it.
  • Is 24% in IT/IS a problem? The chart can't say.
AfterThe company rate on the chart
Bar chart titled Only Production is above the company turnover rate of 34%, with a dashed line labelled Company 34% and Production in blue.
  • The dashed line splits the departments into above and below. Only Production is above it.
  • The subtitle warns that the Executive Office is one person. Software Engineering's 30% rests on only 10 people.

Use a real comparison: the company average, another department, a prior year or a peer. If you show a target nobody has set, label it as an example.

In Power BI

  1. Create the benchmark as a measure that ignores the department filter:
    Turnover Rate = DIVIDE ( [Employees Left], COUNTROWS ( Employees ) )
    
    Company Turnover =
    CALCULATE ( [Turnover Rate], REMOVEFILTERS ( Employees[Department] ) )
  2. Select the bar chart, open the Analytics pane and add an X-axis constant line (on a column chart, Y-axis constant line). Click fx next to Value and pick Company Turnover.
  3. Set the line to dashed and dark grey, turn on its Data label and name it "Company".
  4. On a card, add the comparison in Format visual > Reference labels. More on Cards.
Rule 6

Declutter until the data stands out. Each element has to earn its place.

Presentations and dashboards

Every line, box and label on a visual costs the reader a little attention. Knaflic's test for each one: does it add enough to make up for its presence? Borders, gridlines, axis titles, legends, markers and extra decimals rarely pass. IBCS says the same about shadows, 3D and decorative colour. Dashboards may keep light gridlines on dense charts, where readers look up values.

Step through the same chart below. Each step removes something and loses no information.

Step 1: bar chart titled Count of Employee Source by Employee Source with eight colours, a legend, gridlines, a value axis, two axis titles and a border.

1. Power BI default. A border, gridlines, two axis titles, a value axis, eight colours and a legend that repeats the bar names.

Step 2: the same chart without the border, gridlines and axis titles.

2. Border, gridlines and axis titles off. The bars and their names already say what the axes are.

Step 3: the same chart with data labels at the bar ends, and no legend or value axis.

3. Labels on, legend and value axis off. Each bar carries its own number, so the axis and the legend go.

Step 4: bar chart titled Employee referrals bring in more hires than any other source: 31. Employee Referral in blue, other bars grey.

4. Grey plus one accent, and an action title. What's left is the data and the point: 31 hires from employee referrals, the most of any source.

The same applies to tables. A table is for looking up exact values, so it needs clean rows, not boxes.

BeforeA boxed-in table
Table with a dark blue header band, banded rows, lines around every cell, field-name headers such as Count of Department and Sum of Left, and rates to four decimals.
  • A dark header band, banded rows and a box around every cell.
  • Field names in the header and rates to four decimals.
AfterRows, not boxes
Table titled Production loses the most people and pays the least, with thin horizontal rules, plain headers, whole percentages and the Production row in blue.
  • Thin horizontal rules only. Plain headers, rounded numbers.
  • One row in blue: the one the title names.

In Power BI

  1. Format visual > General > Effects > Visual border: Off.
  2. Format visual > Visual > Gridlines: Off. On the axes, turn Title Off.
  3. Data labels: On. Then turn the value axis Off (X-axis on a bar chart, Y-axis on a column chart) and Legend Off.
  4. Line charts: Markers Off.
  5. Tables: Format visual > Style presets: Minimal. Under Grid, keep horizontal gridlines and turn vertical ones off.
Rule 7

Lead with the answer, top left. Detail flows down and to the right.

Presentations and dashboards

Readers of left-to-right languages start at the top left and scan the page in a Z. Whatever sits top left gets read by everyone. Whatever sits bottom right may not be read at all. So the top left belongs to the answer: the title and the key numbers, never a slicer or a logo.

The 3-30-300 rule sets the order of the rest. A reader who gives the page 3 seconds should get the answer; 30 seconds should explain it; 300 seconds should reach the detail. It matters most on dashboards, which have all three layers.

3 seconds: title and cards. 30 seconds: the main charts. 300 seconds: tables, drillthrough and tooltips.

BeforeThe answer in the last place anyone looks
Dashboard page titled HR Dashboard with two list slicers in the top left, a detail table top right, charts in the middle and three default cards at the bottom right. Red markers 1 to 3.
  • 1 Slicers own the top left, the most valuable spot on the page.
  • 2 The headline numbers sit bottom right, read last, with field-name labels and a raw 0.34.
  • 3 A detail table, a 300-second item, takes a 3-second spot.
After3, then 30, then 300 seconds
Dashboard page titled Where are we losing people? with a row of four cards under the title, turnover by department and exits by year below them, a source table at the bottom and slicers in a right-hand rail. Blue badges mark the 3 s, 30 s and 300 s zones, and a dashed Z shows the reading path.
  • The title asks the page's question and the cards answer it, each with a comparison.
  • The charts explain the answer. The table holds the detail for readers who stay.
  • Slicers sit in a rail on the right, out of the reading path.

A presentation page shortens this to two zones: the title (3 seconds) and one proof visual (30 seconds).

In Power BI

  1. Place the cards directly under the title: select each one and type its position in Format visual > General > Properties > Size and position.
  2. Group the slicers: select them, right-click, Group > Group, and move the group to the right edge.
  3. Match the keyboard order to the reading order: View > Selection, open the Tab order tab and put the title and cards first.
Test your eye

Spot the broken rule before you open the answer.

A page title reads "Turnover jumped in 2015, and referral hires stay longest". What would you change?

Split it into two pages (rule 2). One page: "Exits jumped to 26 in 2015, from 14 the year before", with the line chart. The other: "Only 13% of referral hires left, against 34% overall", with the source chart.

You want to show how the 102 people who left split across five departments. Pie or bar?

A sorted bar (rule 3). It is a part of a whole, but with five parts, three of them under 5%, the small slices can't be told apart. Production is 81% of everyone who left. A bar shows that and still lets the reader rank the rest.

A card shows "IT/IS turnover: 24%" in blue. What's missing?

A comparison (rule 5). Add the company rate underneath: "Company: 34%". Now the reader can see IT/IS is below average, and the blue no longer suggests a problem that isn't there.

A bar chart has data labels, a value axis, gridlines, a legend and a border. Which can go?

All but the labels and the bar names (rule 6). The labels give exact values, so the axis and gridlines repeat them. The legend repeats the bar names. The border adds nothing.

A dashboard opens with three slicers in its top-left corner. Why move them?

Top left is where every reader looks first (rule 7). Put the title and cards there so the answer comes in three seconds, and move the slicers to a rail on the right edge.