7+1 Steps of Dashboard Design
? Duygu Nas
Senior Art Director | UX UI Designer | Master's Media Design | MSc | Creative & Critical Thinker ?? Executor ?? Tech Savvy & Certified in IT
7+1 Steps of Dashboard Design
“Dashboard”. This word, which has taken its place in our lives as an indispensable element of portals today, was first used in 1846 for the wooden or leather plate used by the horse’s hooves to prevent mud from splashing on the vehicle. In the 1900s, it evolved as the panel under the windshield where control panels and indicators are mounted. Although it does not show functional similarity with its first use, its relation with the transportation factor and ahead seems to have remained intact throughout its evolution, right? So, what is the instrument panel in the sense that we will examine?
And here are your must-haves for a promised clear dashboard:
1 - Understand the purpose of the dashboard
When the purpose is not properly defined, it can lead to a bad experience. Understand your purpose well.
For example, an operational panel that shows shorter timeframes and operational processes, an analytical panel to display large amounts of data, or a Strategic panel that focuses on long-term strategies and high-level metrics?
Or do you need a tactical panel used to monitor performance.
Your goal is to represent inner meanings, outer appearance is a proponent.
2 - Show your priority order on placement
When designing information architecture, keep these in mind:
At first glance the rectangular screen may seem perfectly even, but according to UX this is not the case. A screen has different priority points. Probably the F-shape is naturally in your mind. Compared to the F shape, the upper left corner of the screen is the area that will attract more attention. We scan the screen from left to right according to the way we read information. After completing the first line, readers will move from the right end of the screen to the left end, moving on to the next. Again, it should be noted that this depends on the users for which the product is designed. :)
Create a content repository and flag or reposition content based on priority.
For blurry ideas, there is no point in giving clear images.
3 - Use the cards
Using the card-based layout can be beneficial for responsiveness. A dashboard will basically have many widgets to represent data. Easy to edit and rearrange, cards can be used to contain these widgets so that all layouts are rearranged for screen sizes.
Also, the use of cards makes the overall layout clean and uniform as the spacing between neighboring cards is even.
Clarity enables focus.
4 - Take advantage of the spaces
Use well-defined margins and padding areas.
A clean layout, good white space, uniform margins will put the user at ease. We all agree that the feeling of being stuck is not a pleasant feeling, right? :)
Spaces provide for you to see what’s important.
领英推荐
5 - Avoid making the clipboard page too long
The purpose of the dashboard page is to provide a glimpse into the functionality of the entire application.
But what will you do if an app has many features?
Agree that setting all of the properties on the dashboard will not only lengthen the scrolling length of the dashboard but will also complicate the user’s experience. Avoid prolonging your page by setting your priorities.
Too much cognitive effort will not produce a positive emotional experience.
The delicacy is to touch on the necessary points without losing the user.
6 - Express the hierarchy of content or items
a- Use clean and readable titles
Headlines are readable and neat, with no clutter around them, making them more appealing to the eye, and the user will definitely want to read more of the page and spend more time on the page.
b- Understand the language of colors
As the building block of visual language, color directs attention. Combines or separates elements.
Randomness leads to loss.
7- Add emotion with Animations and Micro-Interactions
Think about Emotional Design. Pay attention to the fact that the products that look nice have an undeniable effect on the user. Wouldn’t it come as a surprise to you that users are more error-tolerant when they come across something nice?
Give your users a memorable moment in their product journey.
Art is in the details.
7+1 - Don’t underestimate customization capabilities
You can give users the power to reconfigure the features they want to see in the dashboard, or even certain parts of the layout.
You may also need to implement some machine learning algorithms, such as “The most interacting data is placed in the upper left position and the least interacting data is placed in the lower right position.” to reconfigure the layout based on user interaction with the data. You can get help from your teammates in this regard, so you create an area where you can get the data you need to understand the user and their interaction activities.
Take the concept of democracy in UX.
stay with love…
DNas / Bertha Bella