The mobile dashboard allows you to monitor the real-time business performance, check what is going on, query the business data anytime and anywhere.
However, mobile dashboards are designed differently from regular dashboards because they need to fit on a small screen adaptively.
This article will use the app design idea to help you design an attractive mobile dashboard for your managers.

NOTE: All the mobile dashboard in the article are made by the dashboard software FineReport.

1.The design of basic elements in the mobile dashboard 

Numbers and graphics are the main elements of the dashboard. They occupy most of the report. In the mobile dashboard, to achieve a better display effect, you need to take advantage of the strengths of different elements.

(1) Number 

The expression of numbers is intuitive, concise, and takes up little space, which is the most direct way to display. 

The number is the best choice for displaying key business indicators in the mobile dashboard. Putting critical figures in the most prominent position of the report can help you quickly have a comprehensive view of your business.

The disadvantage is that it is impossible to gain a deeper understanding of the trends, proportions, and distributions behind the numbers.

For example, the numbers are applied to the digital display in Apple’s “health.” 

(2) Graphics

Graphics make the expression of data more abundant.

In the mobile dashboard, graphics are suitable for the performance of sales achievements and trends of key indicator, so that users can more intuitively track the performance and trends.

However, the graphics take up screen space a lot in the APP. Three graphics in the vertical screen already occupy the full screen. Therefore, it is necessary to start with the design to discover how to place more data. 

Waterfall flow

The waterfall flow layout means arranging the charts from top to bottom. In this layout, you should highlight the critical data with a larger space, weaken the secondary data. Trying to make the chart types of primary and secondary data different is another key point. However, you can use the same chart type in each module, which makes the page level clear, reducing the user’s fatigue of data display.

Carousel 

That is, rotate the contents of the diagram within the same graphics display area, which can effectively save the display space of the mobile terminal and avoid a lot of longitudinal sliding.

(3) Table

Due to the size of the mobile phone screen, the mobile terminal is only suitable for some tables with fewer fields. In the case of a vertical screen, it is not advisable to exceed six columns but also depends on the content of each column. If there is a lot of data, it will appear very crowded, and visual effects will be affected.

(4) The linkage between numbers and graphics

As mentioned above, the picture takes up space but can express rich content, and the numbers are intuitive but lack interpretation. We need to combine them to make the data content expression relevant through various functions.

When you use the linkage of numbers and graphics, you need to consider the convenience of use. The general user’s idea is that when you see the value, you also want to see more specific content, such as trends, proportions, comparisons, etc., These effects need a chart linkage method.

2.The design of the mobile dashboard layout

We have had presentation elements of the report, and now we need a reasonable layout to integrate them together so that users can intuitively and quickly get the data they need. And considering the design principles of hierarchy, it can decompose and drill different data objects.

Based on the elements of hierarchical design and reasonable layout, we provide four kinds of homepage design solutions to let the data reflect the sense of depth in various arrangements.

(1) Flow Layout

Prototype:

Demo:

All key indicators are placed in a tiled manner, which is simple to develop and provides a quick overview of data content. The content that the user cares about in each indicator needs to be fully expressed. This mode is simple, but users must keep sliding to access all content information because there is no jump action such as navigation, which leads to overwhelmed content and worse experience.

Application scenario: There are not many indicators, and the data content is a high-granularity summary

(2) Business Card+Drill down 

Prototype:

Demo:

This kind of mode classifies the ‘business card’ according to business or scenario; each business card represents a business or scenario. The business cards reflect the most important indicators to help you see the overall situation of the business and scenarios. After clicking on the hyperlink, you can go to the next page to view the status of the indicators under the current business or scenario classification. 

The difference with the flow layout is adding the hierarchical design idea. The first-level, indicator summary layer does not need to be comprehensive, and users can obtain more information about the indicator by drilling down. 

Application Scenario: all scenarios

(3)Sudokus

Prototype:

Demo:

The way of using the sudokus is similar to the way of business card + drill down. Every nine boxes is an entrance. It can be an index item of a module and an entry of an application.

Application Scenario: all scenarios

(4) Tab

Prototype:

Demo:

Data content can be segmented into several parts. The logic of segmentation can be at the same or different levels.

Application scenario: Multiple business modules, each with its own data analysis requirements

Example 1: Can be summary, subdivision mode analysis (as shown in the prototype)

Example 2: It can be the data analysis of X different business modules of the company (as shown in the demo)

Example 3: Can be sales, production, financial and other business categories of data analysis

3. How to choose the data for the mobile dashboard?

IT department customized mobile dashboard for managers. The report’s layout and beauty are essential, but the validity of the data is still the priority. If the dashboard is separated from the value of the information itself, there is no meaning, no matter how attractive the design is.

However, it should be emphasized that the maximum time granularity of data should be day; otherwise, users will not have the desire to pay attention to data, and app stickiness cannot be generated.

At Last

Before you start designing, choosing a dashboard software that supports the mobile display is also of great importance. Here, I would recommend FineReport. FineReport provides a mobile app called FineMobile. Its function experience is as cool as of the PC side. Besides, FineMobile supports unique features such as drilling&linkage, parameter query, message push, scanning&inputting, mobile data entry, annotation sharing, photo uploading, offline viewing, pinch-zoom gesture, and security guarantee. If you are interested, you can download it for a free trial.