Welcome!

Blog Feed Post

Dissecting the Ideal Dashboard

A web-based dashboard is similar in function to a vehicle dashboard in many ways. A vehicle dashboard typically features tools and symbols to will help the driver monitor multiple items at once like speed, fuel, engine functioning, etc. Not only do these meters and indicators help ensure a safe and pleasant drive, it also confirms that the vehicle is running properly.

http://blog.catchpoint.com/wp-content/uploads/2017/08/smart1-300x96.png 300w" sizes="(max-width: 700px) 100vw, 700px" />

Similarly, a well-defined IT dashboard helps the user view, understand, and analyze the data, which in turn boosts the success of the website or application.

http://blog.catchpoint.com/wp-content/uploads/2017/08/smart2-300x136.png 300w, http://blog.catchpoint.com/wp-content/uploads/2017/08/smart2-768x349.png 768w, http://blog.catchpoint.com/wp-content/uploads/2017/08/smart2-1024x466.png 1024w" sizes="(max-width: 1871px) 100vw, 1871px" />

So, what exactly is a dashboard? A dashboard is a collection of data (i.e. production data, financial data, etc.) displayed in a graphical layout (a graph or chart). These are used by businesses to gauge its overall health, adjust production levels, determine financial stability, and many other forms of business analysis.

Let’s look at some basic guidelines to follow when trying to build the ideal dashboard.

Focus on the end user, not data

Know your customer; it’s very important to understand your target audience before building a dashboard. For example, the CEO of a company probably isn’t interested in a summary of test failures, while the DevOps team won’t benefit by using a high-level summary dashboard.

Thus, it’s very important to know who will be using the dashboard. By looking at the user’s perspective, you can determine the critical functions and what exactly the end user expects when they access the dashboard.

Group data logically and use space wisely

A well-designed dashboard will ensure the data is displayed in logical groups. The data should be grouped into relevant categories; for example, sales or revenue data should be grouped together while website performance statistics and related data will be in a separate group. This will ensure the different data sets are visually separate and easy to interpret.

Another important factor in designing a dashboard is utilizing the page space. The real estate of the webpage must be used wisely – the dashboard should not look empty or too cluttered.

Most western languages are read from top to bottom and left to right, so our eyes will naturally start its journey from the top-left corner to the bottom-right corner. The top-left corner, in most dashboards, is reserved for the company logo or advertisement, but this isn’t a recommended dashboard practice. Instead, move the most important features, like filters or other important information, to the top-left corner so that this is the first thing your eye will catch when the dashboard is opened.

The different visual components on the page must be placed based on its relevance to the user, starting from the most important (chart, graph, or dataset) to the least.

Help the user drill down data

A good dashboard should be like a quality newspaper. You can pick up the newspaper, glance at the front page and get a gist of everything happening around you. If you wish to know more about any incident or news, then you can continue reading. The front page of the newspaper offers a pretty good summary of everything it contains.

Similarly, it is good to provide a concise overview on the first page of the dashboard so the user can see what is important and drill down to the data to understand it better.

Design insightful visualization

It is always better to display a graph, chart, or any visual representation of the data instead of listing it out line by line. The user will be able to interpret the data easily without having to read through all of the content.

http://blog.catchpoint.com/wp-content/uploads/2017/08/smart4-300x176.png 300w" sizes="(max-width: 643px) 100vw, 643px" />

http://blog.catchpoint.com/wp-content/uploads/2017/08/smart5-300x175.png 300w" sizes="(max-width: 650px) 100vw, 650px" />

The data visualization should be flexible and the user should be able to customize and filter the data as needed. The charts/graphs should also be insightful and interactive.

Along with the charts, the dashboard should display other important data. This data can be integrated into the dashboard using dialog boxes, overlays, tooltips, etc. These features will add to the visual appeal of the dashboard and make it easy to navigate.

http://blog.catchpoint.com/wp-content/uploads/2017/08/smart6-300x136.png 300w, http://blog.catchpoint.com/wp-content/uploads/2017/08/smart6-768x348.png 768w, http://blog.catchpoint.com/wp-content/uploads/2017/08/smart6-1024x464.png 1024w" sizes="(max-width: 1315px) 100vw, 1315px" />

Use color-based visualization

A dashboard should use different colors to indicate errors, warnings, and other messages. For example, a data point or value in red could indicate an error with the data. Similarly, text highlight in orange could indicate a warning message or in green to indicate a success message.

http://blog.catchpoint.com/wp-content/uploads/2017/08/smart7-300x240.png 300w" sizes="(max-width: 399px) 100vw, 399px" />

It is important to maintain the same color scheme on all the dashboard pages so that the user is not confused. For example, all errors must be displayed in red on all sections of the dashboard.

http://blog.catchpoint.com/wp-content/uploads/2017/08/smart8-300x136.png 300w, http://blog.catchpoint.com/wp-content/uploads/2017/08/smart8-768x349.png 768w, http://blog.catchpoint.com/wp-content/uploads/2017/08/smart8-1024x466.png 1024w" sizes="(max-width: 1322px) 100vw, 1322px" />

The color scheme you pick for the dashboard must be professional; you wouldn’t want your dashboard to look like a kid’s drawing board. The image below illustrates how a dashboard can look with the wrong choice of colors.

 

Keep the dashboard clear and uncluttered

Avoid adding too many charts and images to the dashboard. It is easier to navigate a dashboard that is not cluttered with graphs, videos, and other data. Limit the number of visualizations on the page to no more than seven.

 

According to cognitive psychology, the human brain can only comprehend around 7 (+/- 2)  different data patterns at a time and this is the number of items that should ideally be in a dashboard. Adding more visualization will only make the dashboard more difficult to interpret and distracts the user from the dashboard’s intended purpose.

http://blog.catchpoint.com/wp-content/uploads/2017/08/smart11-300x148.png 300w, http://blog.catchpoint.com/wp-content/uploads/2017/08/smart11-768x379.png 768w, http://blog.catchpoint.com/wp-content/uploads/2017/08/smart11-1024x505.png 1024w" sizes="(max-width: 1884px) 100vw, 1884px" />

To avoid crowding the dashboard, you can add multiple pages instead of clubbing all the visualization into a single page.

Smartboard

Catchpoint recently introduced Smartboard. This dashboard has been designed around the same guidelines we discussed above. All the features in Smartboard have been added to enhance the user experience.

http://blog.catchpoint.com/wp-content/uploads/2017/08/smart12-300x140.png 300w, http://blog.catchpoint.com/wp-content/uploads/2017/08/smart12-768x359.png 768w, http://blog.catchpoint.com/wp-content/uploads/2017/08/smart12-1024x479.png 1024w" sizes="(max-width: 1347px) 100vw, 1347px" />

  • Catchpoint Smartboard presents all important features on a single screen. In the left corner, we have the main navigation panel with the Test ID/Name selector right next to it, this allows you to search for any test by Name or ID. Below the selector panel, you will find some important data listed like the Time Filter Selector, DownTime/TestTime, and test run indicators.
  • The dashboard features an Infinite Timeline with Brush and zoom feature that lets you select any period to drill down the test data. There is also an Error display section that shows errors, exceptions, downtimes, test failures etc occurred during that time frame.
  • The Trending Chart and Histogram chart show different data-points.

Conclusion

Building a dashboard is more than just putting together a summary of the collected data, but it’s important to arrange this data in a way that it is easy to interpret. User experience should be your priority when designing a dashboard; a user will not be able to analyze the data if it is not presented properly. Keep it simple, keep it clear, and keep it user-friendly.

The post Dissecting the Ideal Dashboard appeared first on Catchpoint's Blog - Web Performance Monitoring.

Read the original blog entry...

More Stories By Mehdi Daoudi

Catchpoint radically transforms the way businesses manage, monitor, and test the performance of online applications. Truly understand and improve user experience with clear visibility into complex, distributed online systems.

Founded in 2008 by four DoubleClick / Google executives with a passion for speed, reliability and overall better online experiences, Catchpoint has now become the most innovative provider of web performance testing and monitoring solutions. We are a team with expertise in designing, building, operating, scaling and monitoring highly transactional Internet services used by thousands of companies and impacting the experience of millions of users. Catchpoint is funded by top-tier venture capital firm, Battery Ventures, which has invested in category leaders such as Akamai, Omniture (Adobe Systems), Optimizely, Tealium, BazaarVoice, Marketo and many more.

Latest Stories
SYS-CON Events announced today that Massive Networks, that helps your business operate seamlessly with fast, reliable, and secure internet and network solutions, has been named "Exhibitor" of SYS-CON's 21st International Cloud Expo ®, which will take place on Oct 31 - Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA. As a premier telecommunications provider, Massive Networks is headquartered out of Louisville, Colorado. With years of experience under their belt, their team of...
SYS-CON Events announced today that Fusic will exhibit at the Japan External Trade Organization (JETRO) Pavilion at SYS-CON's 21st International Cloud Expo®, which will take place on Oct 31 – Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA. Fusic Co. provides mocks as virtual IoT devices. You can customize mocks, and get any amount of data at any time in your test. For more information, visit https://fusic.co.jp/english/.
21st International Cloud Expo, taking place October 31 - November 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA, will feature technical sessions from a rock star conference faculty and the leading industry players in the world. Cloud computing is now being embraced by a majority of enterprises of all sizes. Yesterday's debate about public vs. private has transformed into the reality of hybrid cloud: a recent survey shows that 74% of enterprises have a hybrid cloud strategy. Me...
SYS-CON Events announced today that MIRAI Inc. will exhibit at the Japan External Trade Organization (JETRO) Pavilion at SYS-CON's 21st International Cloud Expo®, which will take place on Oct 31 – Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA. MIRAI Inc. are IT consultants from the public sector whose mission is to solve social issues by technology and innovation and to create a meaningful future for people.
With the rise of DevOps, containers are at the brink of becoming a pervasive technology in Enterprise IT to accelerate application delivery for the business. When it comes to adopting containers in the enterprise, security is the highest adoption barrier. Is your organization ready to address the security risks with containers for your DevOps environment? In his session at @DevOpsSummit at 21st Cloud Expo, Chris Van Tuin, Chief Technologist, NA West at Red Hat, will discuss: The top security r...
SYS-CON Events announced today that Enroute Lab will exhibit at the Japan External Trade Organization (JETRO) Pavilion at SYS-CON's 21st International Cloud Expo®, which will take place on Oct 31 – Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA. Enroute Lab is an industrial design, research and development company of unmanned robotic vehicle system. For more information, please visit http://elab.co.jp/.
IBM helps FinTechs and financial services companies build and monetize cognitive-enabled financial services apps quickly and at scale. Hosted on IBM Bluemix, IBM’s platform builds in customer insights, regulatory compliance analytics and security to help reduce development time and testing. In his session at 21st Cloud Expo, Lennart Frantzell, a Developer Advocate with IBM, will discuss how these tools simplify the time-consuming tasks of selection, mapping and data integration, allowing devel...
SYS-CON Events announced today that Mobile Create USA will exhibit at the Japan External Trade Organization (JETRO) Pavilion at SYS-CON's 21st International Cloud Expo®, which will take place on Oct 31 – Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA. Mobile Create USA Inc. is an MVNO-based business model that uses portable communication devices and cellular-based infrastructure in the development, sales, operation and mobile communications systems incorporating GPS capabi...
SYS-CON Events announced today that Keisoku Research Consultant Co. will exhibit at the Japan External Trade Organization (JETRO) Pavilion at SYS-CON's 21st International Cloud Expo®, which will take place on Oct 31 – Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA. Keisoku Research Consultant, Co. offers research and consulting in a wide range of civil engineering-related fields from information construction to preservation of cultural properties. For more information, vi...
There is huge complexity in implementing a successful digital business that requires efficient on-premise and cloud back-end infrastructure, IT and Internet of Things (IoT) data, analytics, Machine Learning, Artificial Intelligence (AI) and Digital Applications. In the data center alone, there are physical and virtual infrastructures, multiple operating systems, multiple applications and new and emerging business and technological paradigms such as cloud computing and XaaS. And then there are pe...
Today traditional IT approaches leverage well-architected compute/networking domains to control what applications can access what data, and how. DevOps includes rapid application development/deployment leveraging concepts like containerization, third-party sourced applications and databases. Such applications need access to production data for its test and iteration cycles. Data Security? That sounds like a roadblock to DevOps vs. protecting the crown jewels to those in IT.
SYS-CON Events announced today that Interface Corporation will exhibit at the Japan External Trade Organization (JETRO) Pavilion at SYS-CON's 21st International Cloud Expo®, which will take place on Oct 31 – Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA. Interface Corporation is a company developing, manufacturing and marketing high quality and wide variety of industrial computers and interface modules such as PCIs and PCI express. For more information, visit http://www.i...
SYS-CON Events announced today that SIGMA Corporation will exhibit at the Japan External Trade Organization (JETRO) Pavilion at SYS-CON's 21st International Cloud Expo®, which will take place on Oct 31 – Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA. uLaser flow inspection device from the Japanese top share to Global Standard! Then, make the best use of data to flip to next page. For more information, visit http://www.sigma-k.co.jp/en/.
SYS-CON Events announced today that B2Cloud will exhibit at SYS-CON's 21st International Cloud Expo®, which will take place on Oct 31 – Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA. B2Cloud specializes in IoT devices for preventive and predictive maintenance in any kind of equipment retrieving data like Energy consumption, working time, temperature, humidity, pressure, etc.
Agile has finally jumped the technology shark, expanding outside the software world. Enterprises are now increasingly adopting Agile practices across their organizations in order to successfully navigate the disruptive waters that threaten to drown them. In our quest for establishing change as a core competency in our organizations, this business-centric notion of Agile is an essential component of Agile Digital Transformation. In the years since the publication of the Agile Manifesto, the conn...