Skip to main content
Loading Explore guides…
Dashboard Building Best Practices · Acedra
Home
Explore
Business
Dashboard Building Best Practices
Sign in to save
Chat
If YouTube asks you to sign in, open the video on YouTube.
Watch on YouTube
Reload player
Transcript
69 segments
Copy
Hide video
0:00
Hello, welcome, and thank you for joining the webinar, 7 best practices for building a dashboard. My name Tereza Siedlova, I'm a content creator at GoodData and I'll walk you through the webinar today.
0:24
Before we start let me briefly tell you about our company and go over webinar logistics. After that you will dive deeper into tips how to create a professional dashboard. If you haven't heard about GoodData, our company delivers embedded analytics at scale, helping companies to achieve their analytics goals and grow their business.
0:44
When it comes to webinar logistics, all attendees are muted upon entry. If you have any questions, please use the Zoom Q&A box and my colleagues will answer them for you right away.
0:55
Afollow-up email with the webinar recording will be sent to all participants in case you would like to return to any of the topics or share the recording with your colleagues That is all from my side and I'll hand over to Vasek. The floor is yours
1:13
thank you hello again my name is Vaclav and I'm senior UX designer at the Professional Services Department here at GoodData which means that I'm working on client projects and helping customers to understand basically what they actually need from the dashboards. And now let's talk about how to build a dashboard and I want to give you an overview, basically a few tips to get you started because it's a large topic so it might be a little
1:46
intimidating at first. And yeah basically looking at the blank canvas you're not knowing where to start so I would like to give you the overview and some basically a few pieces of puzzle, a few corner pieces or edge pieces from where you can start and build your own dashboards. So definitely you don't need to be afraid of building a dashboard you will see it's not that hard
2:14
Let's start at the very beginning what is a dashboard anyway? Do you have any idea where it come from actually? It's older than you might think and he won't believe me but it's true because this is the first dashboard. it's basically the piece of wood the board which was protecting the coachman on the carriage from the dirt which was thrown out as the horse was dashing through the dirt which means putting those two words together
2:50
created the world dashboard. So yeah those coachmen were actually our first users. And over centuries this term was also used in car dashboards for example we do instrument clusters but currently we are talking mainly about business intelligence dashboards. And that's
3:11
our topic for today so we left the carriages and continue with business intelligence.
3:19
Tip number one is to understand the problem. Because building the wrong product for the wrong users is surprisingly easy and knowing where to start at the very beginning of this of this dashboard building process is very important. And you need to focus on solving the right problem - real people's real problem. You need to define it first and I would say a lot of money was spent on solving the wrong problems and if you do so it's typically an expensive mistake and it's definitely
3:59
frustrating endeavor for everyone involved. So how to make sure you solve the right problem, you need to ask good questions. You need to gather together the stakeholders on the project and just start asking those questions and open-ended questions like what value does the product bring to customers? Basically what's this product about? Why do you want to redesign the product if you are starting with some current product and you need to new version. And if you do that what do you
4:34
want it to do differently because there might be some problem with the current products so what it needs to do differently. And who are the users of those products do you have for example. Have you done any research? do you have any personnel online? who are those people? and what are the users looking for and why? what are their motivations behind going to the dashboard? because no one is just going to look at the numbers just for fun. They need to have a meaning behind that
5:06
number and behind the number there is typically some action what to do with it, why to check it, why do I need to know this number and always dig deeper and deeper ask why why why multiple times until you get to the bottom of the things, to the really root cause of those those needs and pains. And where to do that or how to do that - I would like to organize something called requirements gathering workshop at the very beginning of those projects. And it can be done offline or
5:39
online. If you are offline it's great to just have a wall with stickies or a whiteboard and as you are asking those questions note the answers and so the participants see them the same. You can do for example online in the Miro or any other software like that which simulates the whiteboard which allows you to again use the stickies and as they are asking the questions and noting the answers people can see what you what you are writing
6:16
and can adjust it. So after the after this meeting like one hour two hour meeting you have like shared understanding of what's going on what's what we're gonna build. so tip number one to understand the problem understand the problem, what are you trying to solve.
6:34
and since we have already the what figured out there is tip number two, to know your audience. Because you are definitely not your users. Now we are solving who are the users and you are not your user definitely not the person sitting next to you not your colleague and also not your client, the stakeholders who commission the dashboard. It's typically not the final of the dashboard. Remember you are building a real product for real people so you need to go and ask those
7:12
real people and how to do that well you need to do your homework, do your research in this case and it might be easier than you think and actually also quite cheap because as it was researched
7:32
when you interview five participants you get about 85 percent of insights so after five one-hour long long sessions with five different people future users of your application, of your dashboard you will have enough insight to have a confidence in what you are building and just compare this effort which could be like up to 10 hours in total with a string of recorded and multiple weeks of
8:03
recurring meetings of many people arguing about the design of the dashboard how it might be but they are not the user. Go and ask those people and on the other hand it's not just a chat you need to have at least some script so those interviews are repeatable and again as I mentioned in previous tip dig deeper ask about underlying reason and reasons and try to uncover those needs. And also if a user mentions some kind of pain point focus on that because if you
8:39
are so if you solve pain points for the users they will be pretty happy. And after we have those five sessions evaluate that and now we have all the information you need and in case you need more information just do another round of five interviews and when to do that - at the beginning of the project but it's also possible to do such interview as a prototype testing for example when you have some outline of the dashboard done you can show
9:08
it again to people and evaluate it so this is how this is the tip number two to know your audience.
9:16
Let's move to tip number three to define the dashboard, basically now after those sessions at the very beginning and after the interviews you have a pile of notes and uh you need to from this textual version move to something which is more visual and for that purpose I like to use wireframes because wireframes it's a schematic it's a blueprint and it's very useful to help you and the business technical design basically all stakeholders on the
9:55
project think and communicate about the structure of the dashboard you are building so it's like visual representation. They are definitely fast and cheap to create and easy to change your scrap it's not not a piece of art so you don't have any emotional attachment to wireframe so you can easily scrap it and redo it again. And mainly it's easy to understand so the main point of wireframe
10:21
is that it's great communication tool between all involved parties because as you just think about any project you did wherever involved business stakeholders design stakeholders technical parties all those people speak English but sometimes it might be that they speak little different English and they don't understand each other that well for example if you are trying to get the message across with just text. And this visual representation helps you to uh
10:57
to bridge this gap and to get the message across. And the wireframes they look
11:03
like just just pieces of wires so they make clear that this is not the final design because there is no design it's it's just a structure they convey the message that this is all up for discussion this is not "this is my artwork" but this is this is what I think let's let's talk about it and wireframes also make it clear that no code has been written yet so it's again easy uh and and fast to change it and the level of simplification allows the focus on the selected details because
11:40
I've been to on many projects when and showing at like high fidelity design some of the stakeholders get caught on tiny little detail that did not really matter because they thought that it's already finished product so they were arguing for half an hour about a certain number which was just a placeholder number so this simplification allows you to focus on just on the selected details
12:08
And how to wireframe, how to use it it's we will explore the three levels of fidelity of wireframes and what I want to demonstrate is that the tool does not matter. It's this visual representation of the problem which is important to build the common understanding. So let's start with readily available tools which is like pen and paper or whiteboard, anything you have
12:35
I'm in the office during the meeting you can just stand up go to the whiteboard and just start drawing start visually representing the the problem and trying to solve it.
12:48
The second level would be some kind of specialized wireframing tool something like Balsamic or Whimsical or Miro even Miro is like very universal that it also has this like library of of wireframing elements and this is this is better in certain ways than just the paper because it's digital and allow you faster iterations and allows you to share it with your colleagues and allows you to collaborate on wireframes.
13:19
You can imagine it as a basically a Lego, you have the box of pieces and you just put them together.
13:27
And the third level could be some kind of general purpose graphic design tool like Figma or Sketch. it requires like most work up front to create basically your own library of pieces so you are creating something like your custom Lego but in the end if you have this custom logo it's fastest fastest to work with so if you have some repeating process of creating something, creating software, creating dashboards it could be worth to spend some time on those libraries.
14:04
So this is how it might look just on pen and paper I would say one one tip for this is grab a fake Sharpie because it does not allow you to go into too much details if you have fine liner just like half millimeter thick pen you will end up doing all the details but with thick Sharpie you're not able to so this is this is definitely good for drawing wireframes thick thick pen the same on whiteboard, it's it's perfect tool to get you started.
14:40
The second level would be with the Balsamic this is this screenshot of the same dashboard in balsamic so you can see some date filter and product category filter on top some kpis some basic charts and as you can see all those elements are in the top in this the drawer so you just take them and drag them to the board and reuse those elements this is like this standard Lego set
15:09
and this would be the highest fidelity level - Figma the general purpose graphic design tool which requires you to do most work up front all those charts which are on the left I actually spent some time building them but in the end I have all the all the charts which already for example in in good data for use and they are easiest to modify for example just tweak the complexity from 12 columns to 30 columns
15:41
and group some of those columns and so on so it's really easy to work with and in the end it allows you the most speed in everyday use so this is like the level of customized Lego
15:58
and now we can jump to tip number four because when you are building the dashboard, you are creating those wireframes it's really important to focus users attention. Put the important things first, front and center. Let's look at this dashboard from a car and it's the probably some sports car so you can see the rev counter and and the speed and the remaining information are in the background they are not that important right now and this putting important things first it's it
16:35
sounds obvious but it's it's harder to implement but it depends on the purpose of the dashboard which you can you should already know because you did your research you talk to your stakeholders. So you don't really need here for example I don't know pressure in the engine or amount of gas which goes into the valves during the when as you write but the dashboard like this can warn you when something is wrong and this also works with business intelligence dashboard you don't
17:10
need to put everything up front but only the most important important information like few basic KPIs some trends for those KPIs and allow users to go gradually into more details and also surface when something is wrong for example like engine temperature oil here on the car dashboard so that would be for the tip number four to focusing users attention. So you need to focus it something like a magician but without this the deception part really
17:45
and that brings us to tip number five about choosing the right visualizations
17:52
because it's not about building the exhibitions of charts. your goal and you should always keep that in mind is to choose the best chart type for your data and for your users choosing the visualization that most clearly and efficiently communicates your data and users should be able to understand it fast without the big mental effort and without like long reading of the dashboard so for this reason do not shy away from I would say quote unquote "boring" chart types something
18:28
like bar chart or line chart because they are very effective in communicating the meaning. Humans they are not built for deciphering complicated charts and if you represent the value by the length of the of the bar that's like the easiest to understand for any human being so I will avoid those eye candy chart just for the sake of wow factor. Do not mistake business intelligence dashboard for infographics. They both have us their purpose.
19:05
infographics are mainly for this like entertainment to also be the eye candy but business intelligence dashboard they need to transfer the information effectively
19:19
and how to choose it how to choose the right visualization what do you need to start with a question and this one question is really what helps you to decide what to use and this what do I want to show more to my users and let's start from the beginning. If you are showing just one big number something like a revenue or number of orders number of visitors on the website, it could be just one big KPI one big number. It doesn't need to be a chart.
19:54
If you want to compare values within and between groups those charts which use the length of the bar for example, bar chart or column chart. If you are struggling with the names of this column chart is like based from those Roman columns you can always tell yourself and their variations it's very effective for those comparisons. And there are also variations of those charts like for example bullet chart which allows you to very efficiently display
20:28
for example the budget and how much do I spend, so how much there is left from that budget.
20:35
if you need to show a composition of data there are two kind of obvious choices which would be pie chart and donut chart but be very careful with those because as I said that humans are very good at comparing lengths they are very very bad at comparing angular distances meaning the angles in the in the charts so if you have like two or three pieces of data which you need to show in the in the chart like and no gender between male and female so they had like two that's great for
21:12
pie chart or donut chart but if you have two more than two or three elements for example 10 then it's uh humans cannot really distinguish between the sizes of the slices in the chart so do not use pie or donut chart for more than two or three elements in that case there are other variants for example tree map which is a great uh for comparing those more more elements in in the composition.
21:43
If you want to display a change over time there is one obvious obvious chart and that that's a line chart. It always runs in our culture from on from left to the right. It might be different in different cultures but typically Dinosaurs are on the left Star Trek on the right and this is how many most people perceive time in Western culture. And line chart or area chart they are great for metrics which fluctuates over time. For example imagine your bank account there is
22:20
certain amount of money then you are paying so the line goes down and then you get your salary from the female employer so again the line goes up on different day. And if you need to track day over day things which starts from zero every day for example visitors on the website then it's good to use column chart because they always start from zero and then go up and again some variants like stack column chart if you need to distinguish for example by category.
22:55
If you want to explain relationship between metrics between two or more metrics this is a bit harder to read chart but it's uh best what we have for uh such a thing to display. So a scatter plot or bubble chart where on each axis you have different different metric for the for the data or combo chart which can display a relationship over time so for example number of orders each day versus total revenue so you can see whether you have you are having a lot of small orders or
23:36
less orders but which are which are much bigger. If you want to display a geographical data with one obvious choice and that's a map. I would only warn about using the map which is used for like when you fill the country with a different with the different shades of color because
23:59
sometimes the size of a country does not really represent for example its economic strength so some small countries and very rich for example in in Europe it might be Switzerland,
24:14
might seem to be a little smaller than some other countries which are much larger you know, Ukraine but for example their GDP would be much much lower. And if you want to date display just a lot of data like for example details of a product there is a good old table which is very useful for displaying such a details across many columns they have all the tables definitely have their place on dashboard for displaying those those detailed numbers.
24:49
And that brings us to tip number six and it's about giving your numbers a context because if you just put a number on a dashboard it just floats in space and it needs to have some context because if I just put sales volume 7 million on a dashboard it might be great but maybe not if the previous month was for example sales 23 million or if this dashboard is for some large company which would be expected to have like billions of revenue. So to give context you can
25:30
use for example previous period how this how this change like this month there is previous month. If you work in some seasonal business it might be better to compare to same period last year
25:45
so for example sales between before Christmas they are hard to compare to I don't know December sales how to compare to November sales but December 2022 is easily comparable to December 2021.
25:59
So that might be one one way how to use um context. Another one is that bullet chart I already mentioned so you can see the budget as a vertical vertical line on a chart and how much you spent for example from a budget for your ad campaign. And one more way how to compare would be a benchmark that's for for areas where the comparison is to your peers so for example here it's it might be number of orders for some brand in some online store and you compare it to
26:40
their peers and for example to all the brands in the store so you can see the relative comparison
26:49
and last but not least it's always great or always important to have something like a date range selector on the dashboard so you see to which date range this number refers to. So it's whether it's a day or month month or a year.
27:10
So that would be for tip number six and that brings us to to the last one, to tip number seven to integrate basically making sure the dashboard is used and how to do it definitely about by making it easy for the users
27:31
easy to use because if you build something which is hard to reach no one will use it. So first step would be to use single sign-on so you eliminate one login for the users so they can just click and they are they are in the dashboard. You can integrate it directly to your application so it might be the analytics could be just another tab for example in your application or you might go even a step further and you created as contextual analytics basically.
28:08
For example you can in your system go to the product details of a certain product you create and you displayed side by side with the chart which shows the sales trend for that particular product so you have the context contextual information.
28:29
so that will be it. And in the end it's not that hard. I would say it's not a witchcraft or rocket science to building a dashboard. Let's say it's more like blend of craft some creativity experience and the right pieces of knowledge applied at the right time. So I hope I provided you with little pieces of knowledge today which will be useful for you in the future and so I would recap it that you definitely need to understand the problem first, solving
29:02
the right problem for the right users. That would be the number two - to know your audience. Remember you are not your user, you need to go out and ask those real people what they really need.
29:16
And based on that you define the dashboard with focus on users attention about how they move through dashboard, what they look for. And you choose the right data visualization on a dashboard to represent your data well and to be understandable for the users.
29:39
Make sure you give your numbers a context and in the end make sure your dashboard is used by either integrating it into your application.
29:52
And that would be all from my side. thank you for your attention and I'll hand over the word to my colleague.
30:02
Thank you Vasku, I think we learned a lot and if you are interested to learn more check out our website. You can sign up for a free JL and try to build a dashboard on your own thank you all for your attention and have a nice day thank you
Here to help you learn
Sign in to keep a private conversation with your course tutor.
Ask me anything about the material…
Sign in to chat