Skip to content

Board Examples

Advanced layout patterns and comprehensive examples.

Marketing Command Center

A complex dashboard combining multiple layout types, content, and charts:

source: examples_db
title: "Marketing Command Center"

queries:
  sales_summary:
    sql: |
      SELECT SUM(revenue) AS revenue, SUM(units_sold) AS units_sold, COUNT(DISTINCT category) AS category_count FROM ecommerce_orders
  sales_by_date:
    sql: |
      SELECT date, SUM(revenue) AS revenue, SUM(units_sold) AS units_sold FROM ecommerce_orders GROUP BY date ORDER BY date
  sales_by_category:
    sql: |
      SELECT category, SUM(revenue) AS revenue, SUM(units_sold) AS units_sold FROM ecommerce_orders GROUP BY category ORDER BY revenue DESC
  sales_by_product:
    sql: |
      SELECT product, category, SUM(revenue) AS revenue, SUM(units_sold) AS units_sold FROM ecommerce_orders GROUP BY product, category ORDER BY revenue DESC
  sales:
    sql: |
      SELECT * FROM ecommerce_orders

charts:
  spend:
    query: sales_summary
    type: kpi
    label: "Total Revenue"
    value: revenue
  clicks:
    query: sales_summary
    type: kpi
    label: "Total Units"
    value: units_sold
  roi:
    query: sales_summary
    type: kpi
    label: "Categories"
    value: category_count
  spend_trend:
    query: sales_by_date
    type: line
    title: "Revenue Over Time"
    x: date
    y: revenue
  channel_mix:
    query: sales_by_category
    type: bar
    title: "Category Mix"
    x: category
    y: revenue
  funnel:
    query: sales_by_product
    type: bar
    title: "Product Funnel"
    x: product
    y: units_sold
  conversion:
    query: sales
    type: table
    title: "Sales Table"
  campaigns:
    query: sales
    type: table
    title: "Campaign Table"
  creative1:
    query: sales_by_date
    type: bar
    x: date
    y: revenue
  creative2:
    query: sales_by_category
    type: bar
    x: category
    y: units_sold
  creative3:
    query: sales_by_product
    type: pie
    theta: revenue
    color: product

rows:
  # Section 1: Top Level KPIs
  - height: "120px"
    cols:
      - spend
      - clicks
      - roi

  # Section 2: Main Trends (Split 50/50)
  - cols:
      - spend_trend
      - channel_mix

  # Section 3: Funnel Analysis
  - rows:
      - text: |
          **Funnel Performance**
          Analyzing conversion rates by product
      - cols:
          - funnel
          - conversion

  # Section 4: Detailed Reports (Tabs)
  - tabs:
      items:
        - title: "Campaigns"
          rows:
            - campaigns

        - title: "Creatives"
          cols:
            - creative1
            - creative2
            - creative3
Marketing Command Center Marketing Command Center DF-UNKNOWN-INTERNALChart Error: spendQuery execution failed: Source 'examples_db' not found. No source profiles are configured. Declare sources under `sources:` in your dataface.yml. (query: sales_summary)https://docs.it-dataface.com/guides/error-handling/?code=DF-UNKNOWN-INTERNALDF-UNKNOWN-INTERNALChart Error: clicksQuery execution failed: Source 'examples_db' not found. No source profiles are configured. Declare sources under `sources:` in your dataface.yml. (query: sales_summary)https://docs.it-dataface.com/guides/error-handling/?code=DF-UNKNOWN-INTERNALDF-UNKNOWN-INTERNALChart Error: roiQuery execution failed: Source 'examples_db' not found. No source profiles are configured. Declare sources under `sources:` in your dataface.yml. (query: sales_summary)https://docs.it-dataface.com/guides/error-handling/?code=DF-UNKNOWN-INTERNAL DF-UNKNOWN-INTERNALChart Error: spend_trendQuery execution failed: Source 'examples_db' not found. No source profiles are configured. Declare sources under `sources:` in your dataface.yml. (query: sales_by_date)https://docs.it-dataface.com/guides/error-handling/?code=DF-UNKNOWN-INTERNALDF-UNKNOWN-INTERNALChart Error: channel_mixQuery execution failed: Source 'examples_db' not found. No source profiles are configured. Declare sources under `sources:` in your dataface.yml. (query: sales_by_category)https://docs.it-dataface.com/guides/error-handling/?code=DF-UNKNOWN-INTERNAL Funnel Performance Analyzing conversion rates by product DF-UNKNOWN-INTERNALChart Error: funnelQuery execution failed: Source 'examples_db' not found. No source profiles are configured. Declare sources under `sources:` in your dataface.yml. (query: sales_by_product)https://docs.it-dataface.com/guides/error-handling/?code=DF-UNKNOWN-INTERNALDF-UNKNOWN-INTERNALChart Error: conversionQuery execution failed: Source 'examples_db' not found. No source profiles are configured. Declare sources under `sources:` in your dataface.yml. (query: sales)https://docs.it-dataface.com/guides/error-handling/?code=DF-UNKNOWN-INTERNAL Campaigns Creatives Campaigns DF-UNKNOWN-INTERNALChart Error: campaignsQuery execution failed: Source 'examples_db' not found. No source profiles are configured. Declare sources under `sources:` in your dataface.yml. (query: sales)https://docs.it-dataface.com/guides/error-handling/?code=DF-UNKNOWN-INTERNAL 2026-07-17 15:04 UTC made with dataface
▶

Nested Grids

Create sophisticated layouts by combining multiple layout types:

source: examples_db
title: "Complex Dashboard"

queries:
  sales_summary:
    sql: |
      SELECT SUM(revenue) AS revenue, SUM(units_sold) AS units_sold, COUNT(DISTINCT category) AS category_count FROM ecommerce_orders
  sales_by_category:
    sql: |
      SELECT category, SUM(revenue) AS revenue, SUM(units_sold) AS units_sold FROM ecommerce_orders GROUP BY category ORDER BY revenue DESC
  sales_by_product:
    sql: |
      SELECT product, category, SUM(revenue) AS revenue, SUM(units_sold) AS units_sold FROM ecommerce_orders GROUP BY product, category ORDER BY revenue DESC
  sales_by_date_category:
    sql: |
      SELECT date, category, SUM(revenue) AS revenue, SUM(units_sold) AS units_sold FROM ecommerce_orders GROUP BY date, category ORDER BY date, category

charts:
  kpi1:
    query: sales_summary
    type: kpi
    label: "Revenue"
    value: revenue
  kpi2:
    query: sales_summary
    type: kpi
    label: "Units Sold"
    value: units_sold
  mini1:
    query: sales_by_category
    type: bar
    title: "Mini Chart 1"
    x: category
    y: revenue
  mini2:
    query: sales_by_product
    type: bar
    title: "Mini Chart 2"
    x: product
    y: units_sold
  main:
    query: sales_by_date_category
    type: line
    title: "Main Analysis"
    x: date
    y: revenue
    color: category

rows:
  - cols:
      - kpi1
      - kpi2
      - cols:
          - mini1
          - mini2
  - main
Complex Dashboard Complex Dashboard DF-UNKNOWN-INTERNALChart Error: kpi1Query execution failed: Source 'examples_db' not found. No source profiles are configured. Declare sources under `sources:` in your dataface.yml. (query: sales_summary)https://docs.it-dataface.com/guides/error-handling/?code=DF-UNKNOWN-INTERNALDF-UNKNOWN-INTERNALChart Error: kpi2Query execution failed: Source 'examples_db' not found. No source profiles are configured. Declare sources under `sources:` in your dataface.yml. (query: sales_summary)https://docs.it-dataface.com/guides/error-handling/?code=DF-UNKNOWN-INTERNAL DF-UNKNOWN-INTERNALChart Error: mini1Query execution failed: Source 'examples_db' not found. No source profiles are configured. Declare sources under `sources:` in your dataface.yml. (query: sales_by_category)https://docs.it-dataface.com/guides/error-handling/?code=DF-UNKNOWN-INTERNALDF-UNKNOWN-INTERNALChart Error: mini2Query execution failed: Source 'examples_db' not found. No source profiles are configured. Declare sources under `sources:` in your dataface.yml. (query: sales_by_product)https://docs.it-dataface.com/guides/error-handling/?code=DF-UNKNOWN-INTERNAL DF-UNKNOWN-INTERNALChart Error: mainQuery execution failed: Source 'examples_db' not found. No source profiles are configured. Declare sources under `sources:` in your dataface.yml. (query: sales_by_date_category)https://docs.it-dataface.com/guides/error-handling/?code=DF-UNKNOWN-INTERNAL 2026-07-17 15:04 UTC made with dataface
▶

Document-Style Report

source: examples_db
title: "Analytical Report"

queries:
  sales_by_category:
    sql: |
      SELECT category, SUM(revenue) AS revenue, SUM(units_sold) AS units_sold FROM ecommerce_orders GROUP BY category ORDER BY revenue DESC
  sales_by_date_product:
    sql: |
      SELECT date, product, SUM(revenue) AS revenue, SUM(units_sold) AS units_sold FROM ecommerce_orders GROUP BY date, product ORDER BY date, product

charts:
  revenue_by_category:
    query: sales_by_category
    type: bar
    title: "Revenue by Category"
    x: category
    y: revenue
  trends:
    query: sales_by_date_product
    type: line
    title: "Trend Analysis"
    x: date
    y: revenue
    color: product

rows:
  - text: |
      # Monthly Performance Report
      This month showed **strong growth** across all key metrics.
      The following visualizations break down the performance by category.

  - cols:
      - revenue_by_category

      - text: |
          ### Key Insights
          - **Electronics**: Leading category with 35% growth
          - **Accessories**: Needs attention, down 5%
          - **Tools**: Steady performance

  - trends
Analytical Report Analytical Report Monthly Performance Report This month showed strong growth across all key metrics. The following visualizations break down the performance by category. DF-UNKNOWN-INTERNALChart Error: revenue_by_categoryQuery execution failed: Source 'examples_db' not found. No source profiles are configured. Declare sources under `sources:` in your dataface.yml. (query: sales_by_category)https://docs.it-dataface.com/guides/error-handling/?code=DF-UNKNOWN-INTERNAL Key Insights Electronics: Leading category with 35% growth Accessories: Needs attention, down 5% Tools: Steady performance DF-UNKNOWN-INTERNALChart Error: trendsQuery execution failed: Source 'examples_db' not found. No source profiles are configured. Declare sources under `sources:` in your dataface.yml. (query: sales_by_date_product)https://docs.it-dataface.com/guides/error-handling/?code=DF-UNKNOWN-INTERNAL 2026-07-17 15:04 UTC made with dataface
▶

Best Practices

Logical Grouping

Use boards to group related charts together. This improves readability and organization.

Layout Selection

Layout Best For
Rows Simple vertical flow, mobile, scrolling
Cols Side-by-side comparisons, sidebars
Grid Precise control, dense dashboards
Tabs Managing density, hiding content until needed

Modularity

Extract complex boards into separate files (starting with _ for partials) and include them by referencing their filename.

Performance

  • Keep individual boards focused
  • Use tabs to lazy-load complex sections
  • Split large dashboards into multiple files