Skip to content
Back to Get started

Design → development workflow

One route from a business question to a maintainable Power BI page: build the page, know who owns what, and hand it over with enough detail to implement natively.

Build a page
  1. 01Define the user questionWhat decision does this page support?
  2. 02Choose the page patternPick the archetype that answers that question.
  3. 03Choose page sectionsHeader, filter, KPI, trend, detail zones.
  4. 04Select native componentsPrefer native, then configuration.
  5. 05Select visualizationsStart from the analytical question.
  6. 06Define interactionsFiltering, drill-down, drill-through, navigation.
  7. 07Apply design-system foundationsTokens, typography, spacing, theme.
  8. 08Check Power BI feasibilityNative, configurable, workaround, custom or avoid.
  9. 09Validate accessibilityContrast, focus, non-colour state, reading order.
  10. 10Prepare handoverAnnotated design + configuration spec.

Run the same sequence interactively in the pattern builder.

Roles and responsibilities
RoleOwnsHands over
Design system teamFoundations, tokens, semantic styles, accessibility standardsToken set and theme file to UX and BI development
UX designUser goal, page architecture, pattern choice, component selection, interaction behaviour, states, annotationAnnotated Figma page + configuration intent to BI development
Power BI developmentNative implementation, data binding, DAX, interaction configuration, drill-through, filter context, bookmarks, theme application, performanceWorking report to QA
QADesign consistency, interaction behaviour, filter state, data accuracy, accessibility, edge and empty states, feasibility deviationsDefect list back to UX and development
Design system, Figma, Nudge BI, Power UI and the Power BI theme
              Existing design system
                        |
                   Design tokens
                        |
       +----------------+----------------+
       |                |                |
     Figma          Power UI      Power BI theme
   + Nudge BI                            |
       +----------------+----------------+
                        |
        Reusable Power BI implementation

The existing design system stays the source of truth. Tokens flow into Figma (where designers work with Nudge BI components), into Power UI (which generates and manages the theme) and into the Power BI theme file itself. A theme controls colours, fonts and default visual styling; per-visual layout, field wells and interaction settings remain manual configuration in the report.

Learning paths

New to Power BI UX

Designers arriving from web and product design

  1. 1Get started
  2. 2Web vs Power BI
  3. 3Foundations
  4. 4Page patterns
  5. 5Components
  6. 6Interaction patterns

Designing a new report

A team starting a report from a business question

  1. 1Page patterns
  2. 2Components
  3. 3Visualizations
  4. 4Interaction patterns
  5. 5Feasibility
  6. 6Handover

Reviewing an existing report

QA, design review and BI leads

  1. 1Page architecture
  2. 2Components
  3. 3Interaction patterns
  4. 4Accessibility
  5. 5Constraints
  6. 6Good vs avoid
Power BI platform fact
Maintainability rules that apply at every step: native first, configuration over customization, patterns over bespoke pages, the design system as source of truth, consistency over novelty, and maintainability over pixel perfection.