Please enable JavaScript.
Coggle requires JavaScript to display documents.
Dashboards :chart_with_upwards_trend:, Screenshot 2024-12-12 213135 -…
Dashboards :chart_with_upwards_trend:
Types :bar_chart:
Strategic Dashboard
Highly Selective, Long term goals
Focus on
Progress
, Mostly on KPIs, author Driven Stroytelling
Insights and Progress
Analytical Dashboards
Large Volume of data , filters
a lot of drill down,
Data flowing one form to other
Focus on
Data access
, Reader driven Storytelling
Operational Dashboard
Time Sensitive , Current Status
Realtime Unfiltered
Focus on
Outliers
, Must Help users act quickly and accurately
Tasklist Dashboard
Immediate tasks to complete
CRMs, Task Driven
Focus on
pending actions
and incoming requests
What is it ?
Complex products
with Multiple data sources and disjoint systems
Dashboard provide key data in one
single place
Help user create
understanding out of data
Are user focused
Understanding Requirements
1) Define
2) Understand Stress Level
Stress Level for Dashboards
by Benjamin Bach
The more you minimize one of the parameters. the more stress you induce upon other parameters. The more you maximize your parameters, less stress you induce.
:newspaper:
https://www.pure.ed.ac.uk/ws/portalfiles/portal/315583426/2205.00757_1_.pdf
3) Understand Business
Expertise Level
Balance between, Business Expertise and Interface Expertise
Consider Different Interfaces based on the users
Start Defining stakeholder and decisions
1) Where
2) How it will be used
3) Metrics, Key data
4) Sources
5) Technical constraints
6) Requirements and Filtering
Call With A Stakeholder
Dear [XYZ],
As a UX lead on the dashboard project, my team and I are currently in the process of discovery. As we start our work, we'd like to better understand your frustrations, expectations and success criteria for a dashboard.
1) What decisions do you want to be more informed on?
2) What is the hardest thing about making these decisions?
3) Describe the last time you tried making that decision?
4) How did you become informed before making it?
2 more items...
Data thry need
Value and Frustrations
Main Purpose
Resources
https://dashboarddesignpatterns.github.io/
Nivo Charts
https://www.practicalreporting.com/books
https://www.datavizclarity.com/
https://uxplanet.org/10-rules-for-better-dashboard-design-ef68189d734c?gi=01a2ed12ee21
Charts :chart_with_downwards_trend:
Inflatable Vocabulary
"Non-data" elements
Categorical scales
Quantitative scales
Time scales
Categorical color palette
Sequential color palette
Divergent color palette
Line charts
Area charts
Tree maps
Small multiples
Marimekko charts
Pie charts
Dot plots
Inset charts
Stacked bar charts
Bubble charts
Spider charts
Donut charts
Waterfall charts
Bumps charts
Line charts
Scales
Categorical
e.g Regions
Represents Categories
Do's & Don'ts
:check: Sorting Non Sequential Categories
by value usually makes charts easier to read
:warning: Vertical and
diagonal Label text is
a little comfortable to read
:wrench: Quick Fix: Rotate the Whole
chart by 90 Degrees
:check: An ''inset chart''
Inset charts can be used to handle data that falls within a narrow range in almost any chart type
Quantitative
e.g Transactions per Day
Represents Ranges
Time scale
e,g Years
Represents Time
Do's & Don'ts
:warning: Vertical and diagonal
Label text is not obvious
time the chart spans
:warning:Tilting wont fix it as
time is perceived from left to right.
:warning: Dropping Dates creates
Uncertainty in getting the exact value at certain time
:wrench: Quick Fixs:
A multi-level time scale
Easy to tell exactly when values occurred
Horizontal text is easy to read
Colors
Categorical Palettes
Represents Categories
Categories can be sequential or Non-Sequentials
Qualitaive, hues
Sequential Palettes
1-color gradient, shades of the same hue
represents Ranges, arranged light to dark
Classed
Classed
UnClass
Diverging
2 Color Gradients with a dividing point
represents ranges, with distinct edges worth highlighting
Types
Standard line chart
Dot plot
Bumps chart
Step chart
Thin bar chart
Bar chart
Slope chart
Arrow chart
Pie chart
Stacked bar chart
Treemap
Right Column:
Makko charts
Waterfall chart
Area chart
Choropleth map
Stacked bar charts
Bubble charts
Spider charts
Donut charts
Choosing Charts
https://dataschool.com/assets/images/Decision%20Tree%206.png
Multiple Values
Relationship: how multiple independent variables relate to each other.
Comparison: how two or more sets of data compare with each other.
Composition: how a set of data is made up of smaller divisions.
Distribution: how different sets of data are spread over a population or other distribution.
