Overview

This module will cover the planning phase (2hrs) , the design phase (2hrs) and how to polish a dashboard for product (4hours) . In the planning phase, in order to design a dashboard that meets our users needs, we need to first understand what they are after and what their pain points are. In the design phase will will consider graphically, chart choice, visual hierarchy. Tools like sketching and wire-framing are practised. In the polishing for production, we will learn how to design the final dashboard by attending to the text hierarchy, affordance, interactivity of the dashboard, annotation and color scheme.

Learning Objectives

1. Planning Phase
2. Design Phase
3. Production Phase

Projects

Projects: There are two projects ; a midterm data dashboard project and a final dashboard project. The first project will involve building a dashboard prototype along with sketches and wireframes for the prototype. The final project will involve turning my sketch into an actual dashboard.

Content:

Planning Phase:

“Empathy is at the heart of design. Without the understanding of what others see, feel and experience, design is a pointless task”.

In order to design a dashboard that meets our users needs we need to first understand what they are after and what are their pain points. Early discussions are critical in the planning phase. It is broken down into

• Getting to know your audience.
• Understanding your audience attributes
• Understanding their motivations.
• Getting a handle on audience dimensions.
• Dealing with pain points.
• Pulling Data from prioritises.
• Checking in with stakeholders.
• Stating your objectives.

Audience Type:

One way to classify your audience is by the time dimension of when they make decisions. This creates two types of classifications: strategic VS tactical. The distinction between these roles is how much information your target audience needs to take into account when making a decision.

Strategic audiences are generally looking for an overview of their business and the general direction in which we’re heading. Most people in strategic positions won’t have the time or need to get into the nitty gritty details of the data.

Tactical audiences need their data to be fresh and flowing. This means the data they need in order to make their decisions are current, which also means there should be a clear indication on the dashboards about the last time the data was refreshed and potentially how long before the next refresh happens. Tactical audiences make decisions quickly and the decimal point could very well matter.

Key Question: Action: Ask yourself is this information used to inform day to day decisions. Is this dashboard utilised to have discussions on the direction of the company. This is the core differences between strategic and tactical.

Questions to consider when developing dashboard

Audience Background:

• Did they get a degree relative to the work their doing today?
• Have they focused their career in any particular industry or domain?
• What kind of work do they most enjoy doing and would want to do more of?
• What kind of work do they despise and would like to avoid?
• Who are the main stakeholders?
• How technical are the users?

Value add of the dashboard

• What drove this project to start now?
• Can you tell me how you imagine the dashboard being used in your work setting?
• Has anyone attempted to build this dashboard before? If so, why didn’t they succeed?
• What are the biggest nagging issues you have currently getting to the data that matters to you?

Have the key metrics already been defined?

Note: The main reason we gather this information is so we can design a dashboard that sticks by learning what makes them tick.

Audience Type :

One way to classify your audience is by the time dimension of when they make decisions. This creates two types of classifications: strategic VS tactical. The distinction between these roles is how much information your target audience needs to take into account when making a decision. Strategic audiences are generally looking for an overview of their business and the general direction in which we’re heading. Most people in strategic positions won’t have the time or need to get into the nitty gritty details of the data.

Tactical audiences need their data to be fresh and flowing. This means the data they need in order to make their decisions are current, which also means there should be a clear indication on the dashboards about the last time the data was refreshed and potentially how long before the next refresh happens. Tactical audiences make decisions quickly and the decimal point could very well matter.

Action: Ask yourself is this information used to inform day to day decisions. Is this dashboard utilised to have discussions on the direction of the company. This is the core differences between strategic and tactical.

Audience Dimensions

• Dimensions of Target Audience
• Strategic vs. Tactical
• Years of experience
• Level of motivation
• Technical expertise
• It is important to know if our audience can hold a conversation accurately discussing statistics or do we need to communicate more generally. This impacts the level of details we add to the dashboard.
• Importance of design
• Think about whether the design guidelines are important for the brand and how it is included and paid attention to in the dashboard. This should inform how you approach the design element of your dashboard.

Design Dimensions

• What devices will the dashboard be viewed on most frequently?
• Do you have style guides we can use?
• Can you provide examples of dashboards or the style you would like this dashboard to imitate?

**Pain Points: To get at why the numbers in the dashboard matter for the audience, you need to delve into why these numbers are relevant for your audience. Ask them whether they have faced this challenge before. **

Killer Questions:

• What keeps you up at night?
• Are the investors going to like our pitch?
• Are we making the right inventory stocking levels so that we don’t run out of product?
• What one problem is solved would make the biggest positive impact?
• Increasing the competitiveness of our sales team with a live dashboard hung over their desks
• Making sure we are keeping our customers happier than all of the competition
• What other questions need to be answered to answer the main question?
• If I need to restock the inventory what other supplier choices do we have?
• How well is the competition serving their customers?
• What kind of metric are we looking at?
• Binary (Y/N), trend, range
• Do we need to notify the supplier with an alert to reorder as soon as inventory hits a certain level?
• How is customer satisfaction being measured? Is this an industry standard something specific to us?
• What key decisions will this dashboard support?
• What is the most important question this dashboard can answer?
• What pain is this dashboard meant to address?
• What unique value do you have the dashboard provides you and/or your team?

Topline: Before starting a dashboard , you should create a Dashboard statement of work. What this will be is an outline of the audience attributes, motivations and the necessary data to do this work. Outline the key objectives of this dashboard.

Audience attributes: Who are we designing for? Motivation: What solution is valuable enough for them to use. Necessary Data: Does the data we ened exist and do we have access.

Before starting a dashboard , you should create a Dashboard SoW. What this will be is an outline of the audience attributes, motivations and the necessary data to do this work. Outline the key objectives of this dashboard.

Explicitly call out your target audience: Name , Department, team etc Paraphrase the primary pain point this dashboard is

Design Phase

In this lesson, Robert introduces us the to concept of graphicacy. You will learn about how to make chart choices, keep visual hierarchy in mind. You will get busy with creating doodles or early designs, followed by designing a wireframe for your dashboard, and finally building a prototype for the dashboard. You will learn about common layouts, alignment guidelines. This interim step for creating dashboard prototype is important best practice for when you are developing a dashboard. for a client or organization.

Summary of topics: Design Phase, Graphicacy, Chart Choice, Visual Hierarchy, Wireframing, Layouts, Alignments, Building your prototypes, Handling Text, Conclusions.

Graphicacy: Graphicacy is defined as the ability to understand and present information in the form of sketches, photographs, diagrams, maps, plans, charts, graphs and other non-textual formats.

Low graphicacy: Line Chart & Bar Chart. Medium Graphicacy: Dual axis, scatter plot, cumulative measures, heat map. High Graphicacy: Radar, tree, network, errors bars, connected scatter.

The Graphic Continuum gives a fantastic breakdown of all the different chart types available.

Chart chooser with some simple suggestions on choices driven by whether you wish to show:

• Relationship.
• Composition.
• Comparison.
• Distribution.

Use this resource to determine the correct chart

Visualisations are useful when we need to augment human behaviour as opposed to replacing it with computers. Computer based visualisation systems provide visual representations of datasets designed to help people carry out tasks more effectively.

Domain: Who is the audience. Abstraction: What is shown (data abstraction). Why is the user looking at it (Task Abstraction). Idiom : How is it show? (Visual encoding idiom, interaction idom)

Resources on Data Visualisation

• Information is Beautiful Awards. Annual awards for the most beautiful vizzes of the year.
• Reddit: Data is Beautiful. Collection of data, graphs, chars, maps, etc...
• Tableau Public Gallery. For the best of the best go to the Greatest Hits section.
• The R Graph Gallery. Graphs made with R.
• Xenographics. Unusual charts and maps. Repository of novel, innovative, and experimental visualization to help inspire
• Dribbble.
• Behance.

Encoding in data viz basically means translating the data into a visual element on a chart/map/whatever you’re making. You need to do it right, because doing it right will mean that other people looking at your visualisations can understand what you’re trying to say or show. Another way to think of encoding is as a set of rules to follow. So when you’re making them, you need to think logically about how you set up those rules, otherwise people will get totally confused. If you’re doing something complicated, a good way of helping yourself to think about how you encode, or set up the rules, is:

Every time , do

Wireframing

Wireframes are commonly used in web development, but I find that they are also extremely useful in dashboard design. By keeping the concepts simple and always focused on the priorities of your target audience you can work with wireframes much more flexibly than you would anything designed in your dashboarding tool.

Check out these resources on grids. You will examine the following setup: Quadrants, Columns, The Golden Ratio.

Grids:

The grid system is an aid, not a guarantee. It permits a number of possible uses and each designer can look for a solution appropriate to his personal style. But one must learn how to use the grid; it is an art that requires practice.

Presenting Prototype:

• Lead with the objective of the dashboard: The purpose behind this presentation is to keep the feedback focused on helping you get closer to your goal. By reinstating the objective you are also helping to keep the meeting productive by making sure everyone is staying aligned with the objective
• Talk through each element: The purpose of this feedback session is to look for gaps that prevent users from achieving the objective of this dashboard. Seek answers to questions like do we need to incorporate more data? Do you need more specifics on the metrics that need to be calculated? Who else can you share this with for feedback?
• Leave out color: Color is difficult to decided but it is also a way to get the audience involved in the choices that matter to them. Get right in black and white.
• Leave out text: Again this shows that it isn’t done yet and you can ask if they they want to be involved. Cat Ipsum.
• Text Scale: Is important to set the scale of the text as well. One excellent sit for this is a site called type-scale.com.
• Feedback: Introduce the dashboard as you might a story with a summary ath the high level. How is one expected to flow through the dashboard. Ask questions such as….What gaps exist to prevent users from achieving the objective of the dashboard (more data, specific metrics)

Product Phase:

Project Dashboard Design - Midterm

Dashboard:

Student’s dashboard allows the reader to explore the data to answer these questions: The reader should be able to interactively explore the data within the dashboard to find the answer for each question.

Sketch:

Student provides an image of the sketch, rough drawing or doodle they created before developing the dashboard charts: The sketch should be a rough sketch with paper or pen, or another tool.

Student’s sketch should use different chart types and different visual forms for each question: Each of the sketches should demonstrate the student’s exploration process. For e.g., it can include various filters, ranges in the variable, to demonstrate different options considered by the student.

Wireframe:

The student needs to provide the final wireframe used to organize the content in the dashboard:The wireframe should contain the boxes that resemble the charts in the proof of concept dashboard.

Dashboard fully developed: The student needs to provide a proof of concept dashboard: The dashboard should meet the color constraint (e.g., black and white, or a shade of grey).