0
0
Figmabi_tool~8 mins

Why color communicates meaning in Figma - Dashboard Impact

Choose your learning style9 modes available
LearnWhyDeepSheetTryChallengeScenarioRecallDash
Dashboard Mode - Why color communicates meaning
Business Question

How can color be used in dashboards to quickly communicate important information and improve understanding?

Sample Data
CategorySalesTargetStatus
Electronics120000100000Above Target
Furniture8500090000Below Target
Clothing9500095000On Target
Books4000050000Below Target
Sports110000100000Above Target
Dashboard Components
  • KPI Cards: Show total sales and overall performance with color-coded backgrounds:
    • Total Sales: Sum of Sales = 450000 (green background for good performance)
    • Performance Status: If total sales > sum of targets, show "Good" in green; if equal, "Meets" in yellow; else "Needs Improvement" in red.
  • Bar Chart: Sales by Category with bars colored:
    • Green if sales > target
    • Yellow if sales = target
    • Red if sales < target
  • Table: Detailed data with Status column colored:
    • Green for "Above Target"
    • Yellow for "On Target"
    • Red for "Below Target"
Dashboard Layout
+----------------------+----------------------+
|      KPI Cards       |      KPI Cards       |
|  Total Sales (Green) | Performance Status   |
+----------------------+----------------------+
|                      Bar Chart (Sales by Category)                      |
+-----------------------------------------------------------------------+
|                            Data Table (Colored Status)                 |
+-----------------------------------------------------------------------+
Interactivity

A category filter allows users to select one or multiple categories. When a category is selected:

  • KPI Cards update total sales and performance status for selected categories.
  • Bar chart highlights only selected categories.
  • Table shows only rows for selected categories with color-coded status.
Self Check

If you add a filter to select only "Electronics" and "Sports", which components update and how?

  • KPI Cards show total sales of 230000 and performance status as "Good" (green).
  • Bar chart displays only Electronics and Sports bars, both colored green.
  • Table shows only Electronics and Sports rows with green status color.
Key Result
Dashboard uses color to show sales performance by category, making it easy to see which categories are above, on, or below target.