Dashboard Design & Best Practices
Topic 7 of 12 · In Business Intelligence · September 9, 2026
Design dashboards that communicate clearly: layout principles, color theory, interactivity, drill-through, bookmarks, mobile layout and performance optimization.
Overview
A dashboard is only valuable if people actually use it. The difference between a dashboard that gets checked every morning and one that gets ignored after a week is design. This topic teaches you how to design dashboards that communicate clearly, look professional, and perform well on any device.
You will learn the principles of information dashboard design (from Stephen Few and other experts), how to choose the right visual for each type of data, how to use color intentionally, how to add interactivity without adding confusion, and how to optimize dashboard performance so it loads quickly on desktop and mobile. The goal is not "make it pretty" — it is "make it understood in under 30 seconds."
Before You Start
- Have the Power BI report from the Power BI topic saved and open, ready to be redesigned in the practice section
- Take a screenshot of the current report and note three design flaws against the evaluation checklist before starting
- Keep Stephen Few's five design principles visible as you replan each page
- Open Performance Analyzer from the View menu so you can capture the render time of every visual before changes
- Open the mobile layout editor so you can design a single-column version for the CEO's phone
Learning Objectives
- Apply Stephen Few's dashboard design principles to layout and content
- Choose the right chart type for each data relationship
- Use color intentionally and accessibly in dashboards
- Design effective interactivity: slicers, drill-through, cross-filtering
- Create bookmarks and conditional formatting for dynamic views
- Optimize layouts for mobile consumption
- Improve dashboard performance: DAX optimization, visual reduction, aggregation
- Evaluate a dashboard against a design checklist
Prerequisites
Continue from Power BI Deep Dive for the tool knowledge to implement these designs. The design principles apply to any BI tool (Power BI, Tableau, Looker).
Dashboard Design Principles
Stephen Few's five principles of information dashboard design:
- Focus on a few important things — a dashboard should answer one business question, not everything. Limit to 5–9 visuals per page.
- Choose the right visual for the data — bar charts for comparisons, line charts for trends, tables for detail, KPI cards for single numbers.
- Organize for visual hierarchy — most important information top-left, supporting details below and to the right.
- Highlight what matters — use color, size and position to draw attention to key metrics or anomalies.
- Design for your audience — executives want summary KPIs; analysts want drillable detail. Different audiences, different dashboards.
Choosing the Right Visual
| Data Relationship | Best Visual | When to Use |
|---|---|---|
| Comparison | Bar / Column chart | Compare values across categories (revenue by region) |
| Trend over time | Line chart | Show how a metric changes over days/months/quarters |
| Part of whole | Stacked bar or treemap | Show composition (revenue by category within region) |
| Single KPI | Card / KPI indicator | Display one number with a target or comparison |
| Distribution | Histogram / Box plot | Show how values spread (order value distribution) |
| Geographic | Map | Show performance by location (revenue by city) |
| Detail / lookup | Table / Matrix | Show raw numbers, allow sorting and filtering |
| Relationship | Scatter chart | Compare two measures (revenue vs profit margin) |
Rule of thumb: if the audience needs to compare values, use bars. If they need to see a trend, use lines. If they need to look up a number, use a table.
Color Theory for Dashboards
Color is a powerful tool — but easily misused. Guidelines:
- Use color for meaning, not decoration — red = below target, green = on target, neutral = background
- Limited palette — 3–5 colors max for data. Use consistent colors for the same metric across all pages
- Accessibility — avoid red/green combinations (8% of men are colorblind). Use colorblind-safe palettes (e.g. viridis, or Power BI's built-in colorblind themes)
- Semantic consistency — green is good, red is bad, blue is neutral. Never reverse this without explicit labeling
- Background and text — high contrast for readability. Dark text on light backgrounds for most dashboards
Interactivity: Slicers, Drill-Through and Cross-Filtering
Interactivity makes dashboards exploratory — users can slice, dice and drill into the data. Key patterns:
- Slicers — dropdowns or list boxes for filtering (date range, region, product category). Limit to 3–5 slicers per page to avoid clutter.
- Cross-filtering — clicking a bar in one chart filters all other charts on the page. Enable this by default; disable for specific charts that should not be affected.
- Drill-through — right-click a value and navigate to a detail page filtered to that value. Essential for executive → analyst handoff.
- Tooltips — add detailed information on hover without cluttering the main visual. Use report page tooltips for rich, multi-visual tooltips.
Bookmarks and Conditional Formatting
Bookmarks save a specific state of a report page (filters, slicers, visibility). Use cases:
- Toggle views — bookmark for "Actual vs Budget" and "Actual vs Last Year" as buttons the user can switch between
- Show/hide panels — a bookmark that shows a detail table when a button is clicked
- Reset filters — a "Reset" button that clears all slicers to a default state
Conditional formatting highlights values based on rules: color cells red when below target, bold text when above threshold, data bars for magnitude comparison.
// Conditional formatting rule (DAX expression in Power BI)
// Color a card visual red when revenue is below target
Revenue Status =
VAR Revenue = SUM(fact_sales[revenue])
VAR Target = 1000000
RETURN
IF(Revenue < Target, 0, 1) // 0 = red, 1 = greenMobile Layout and Performance
Mobile layout: Power BI has a dedicated mobile layout editor. Design a simplified, single-column layout for phone consumption — fewer visuals, larger text, key KPIs only. Executives often check dashboards on their phones during commutes.
Performance optimization:
- Reduce visuals — each visual sends a query to the model. 15 visuals = 15 queries. Aim for 5–8 per page.
- Use bookmarks to defer visuals — hide off-screen visuals until the user clicks a bookmark
- Optimize DAX measures — use variables, avoid FILTER on large tables, pre-aggregate with SUMMARIZE or materialized views
- Use aggregations — Power BI can use pre-aggregated tables for fast loading and drill down to detail only when needed
- Disable cross-highlighting on charts that do not need it
- Limit slicers — each slicer interaction triggers a requery of all visuals
Dashboard Evaluation Checklist
Use this checklist before publishing any dashboard:
| Check | Criteria |
|---|---|
| Clear purpose | One question per page, stated in the title |
| Visual hierarchy | Most important number top-left |
| Right chart type | Each visual matches the data relationship it shows |
| Color used for meaning | Red/green for status, consistent palette, accessible |
| Interactivity | Slicers for key dimensions, drill-through for detail |
| No clutter | 5–9 visuals per page, no unnecessary elements |
| Mobile-friendly | Key KPIs accessible on phone |
| Performance | All visuals render in under 5 seconds |
| Tested with users | At least one person from the target audience has reviewed it |
Hands-On Practice
Take your Power BI report from the Power BI Deep Dive mini project and redesign it using these principles.
- Apply the 30-second rule: write one sentence describing the main message. Does a viewer get it in 30 seconds?
- Reorganize the layout: KPI cards top-left, supporting charts below and to the right.
- Review each chart type: is it the right visual for the data relationship? Replace any that are not.
- Apply a consistent color theme: one primary color, one accent color, red/green for status.
- Add a drill-through page for detail (e.g. from a region bar chart to a store-level table).
- Create a bookmark for "Reset Filters" and one for toggling between two views.
- Design a mobile layout with 3 KPI cards and one trend chart.
- Run Performance Analyzer and optimize any visual taking more than 3 seconds.
Deeper Worked Examples
Redesigning an overloaded executive dashboard
Step 1
Step 2
Step 3
Step 4
Step 5
Step 6
Common Mistakes
- Designing for yourself instead of the audience — ask what they need to see, not what you want to show
- Using pie charts for more than 2–3 categories — bar charts are almost always clearer
- Color for decoration instead of meaning — every color should communicate something
- Too many slicers — each slicer adds cognitive load and triggers requeries
- Ignoring mobile — executives check dashboards on phones; design for both
- Not testing with real users — you are too close to your own design to see the problems
- Publishing without the evaluation checklist — a 5-minute review catches major issues
Real-World Usage
In production BI, the dashboard is the product. A well-designed dashboard replaces weekly status meetings, eliminates ad-hoc Excel requests and gives every stakeholder self-service access to the truth. A poorly designed dashboard gets used once and abandoned. The design principles in this topic — learned from experts like Stephen Few and reinforced by tools like Power BI's Performance Analyzer — are what separate a working BI system from a successful one.
Mini Project
Business problem: Your current Power BI dashboard from the previous mini project has all the right data but the CEO finds it hard to read. She checks it on her phone during meetings and needs the key numbers immediately.
Dataset: reuse the retail sales dataset and Power BI report from the Power BI Deep Dive project.
Objective: redesign the dashboard following design best practices and produce a before/after comparison.
Task 1
Task 2
Task 3
Task 4
Task 5
Task 6
Task 7
Task 8
Task 9
| Deliverable | What It Proves |
|---|---|
| Before/after screenshots | You can identify design problems |
| Redesigned Page 1 layout | You apply visual hierarchy principles |
| Correct chart types | You match visuals to data relationships |
| Consistent color theme | You use color intentionally |
| Drill-through and bookmarks | You add interactivity purposefully |
| Mobile layout | You design for multiple devices |
| Performance under 5 seconds | You optimize for real-world use |
Key Takeaways
- Focus on one question per page, 5–9 visuals max, 30-second rule
- Choose chart type by data relationship: bars for comparison, lines for trends, tables for detail
- Use color for meaning, not decoration — limited palette, accessible, semantic
- Interactivity: slicers for filtering, drill-through for detail, bookmarks for toggle/reset
- Mobile layout: simplified, single-column, key KPIs only
- Performance: reduce visuals, optimize DAX, use aggregations, disable unnecessary cross-filtering
- Always evaluate with the design checklist before publishing
Key Terms & Glossary
| Term | Meaning |
|---|---|
| Visual hierarchy | Arranging a dashboard so the most important number sits top-left and supporting detail flows down and to the right, matching how managers read. |
| Drill-through | Navigating from a summary value to a detail page filtered to that value, such as from a region bar to store-level rows. |
| Bookmark | A saved state of a report page's filters, slicers and visibility, used to build toggle views and reset buttons. |
| Cross-filtering | The behaviour where selecting a value in one visual filters the other visuals on the page; it can be disabled per visual where it hurts performance or clarity. |
| KPI card | A single-number visual showing one metric against a target, usually with colour status and intended to be read in the top row. |
| Performance Analyzer | A Power BI Desktop tool that reports the render time and underlying DAX query duration of each visual, used to find and fix slow reports. |
Learning Resources
Information Dashboard Design — Stephen Few
The foundational book on dashboard design principles. Essential reading for any BI professional.
Microsoft Learn — Power BI Report Design
Microsoft's guide to designing reports in Power BI Desktop with best practices.
Guy in a Cube — Dashboard Design Tips (YouTube)
Practical Power BI dashboard design tips and walkthroughs.
Storytelling with Data — Cole Nussbaumer Knaflic
A blog and book on data visualization and communication — principles that apply to any dashboard.
Color Safe — accessible color palettes
Generate accessible color palettes that meet WCAG contrast guidelines for dashboards.
Power BI Design Tips — SQLBI
Expert articles on Power BI report design and performance optimization.
Chapter Quiz
Chapter Quiz — Dashboard Design & Best Practices
Design so the message lands in 30 seconds: hierarchy, the right visual, disciplined color, restrained interactivity and fast render.
Question 1 of 5
The 30-second rule says:
Knowledge Check
End-of-Topic Exam
Hint: The five principles map onto the question, the visuals, the layout, the highlighting and the audience.
Model answer: The dashboard answers one question: 'which stock is slow-moving this month?'. Choose a small set of visuals: KPI cards at the top-left for stock turnover, days on hand and dead-stock value; a horizontal bar chart comparing stock value by category so the eye reads length; a line chart of turnover over time; and a table of the top slow movers. Highlight below-target rows in red, restrict the palette to three colours plus status colours, keep the hierarchy with the most important figure top-left, and design for the warehouse manager's analytical use rather than decorative effect. The 30-second read works because the most important number appears first.
Hint: The performance section and its Performance Analyzer callout describe visual count and deferred queries.
Model answer: Every visual fires a DAX query against the model, so 15 visuals multiply the query load and render time even before the slow bar chart is considered. The fixes are to reduce the page to 5-8 focused visuals, shorten the bar chart's query by using a materialised aggregate, disable cross-highlighting where it is not needed, and hide off-screen visuals behind bookmarks so their queries only run when the user clicks to reveal them. This defers the query cost instead of paying it all at page load.
Hint: The interactivity core section defines all three.
Model answer: A bookmark saves a page state including filters, slicers and visibility, and is used for toggle views or reset buttons. Drill-through lets a user click a summary value and jump to a detail page filtered to that value. Cross-filtering propagates a selection in one visual to the other visuals on the page. Scenarios: a bookmark toggling 'Actual vs Budget'; drill-through from a region bar to a store-level detail page; and cross-filtering a category bar so the trend line and table update together.