Behind the scenes of dashboard design is a series of interviews with Product Managers, Developers and Designers of software products with kick-ass information dashboards to help you get an insider’s view into their making. This is the third part of the series.
Imagine a typical day in a system admin’s life. He has to keep a continuous check on the server load so that the site remains functional at its optimum speed. Now what if you have multiple websites or you are hosted on multiple cloud servers? What does he do when he faces some performance issue on any of his websites or servers? Frantically click one cloud status page after another to check where exactly the issue lies.
Well, Server Density tries to simplify his life a bit. By syncing with major cloud providers, it provides the user a single console to monitor his websites and servers. It monitors websites from locations across the world and combines it with internal server metrics so that the user knows when his site is down and have the metrics to figure out why. It also helps to identify those trends which may become a problem in future.
Table of Contents
Server Density is a SaaS tool which helps you run your infrastructure. It syncs with the major cloud providers and allows you to monitor your websites and servers from a single console, an API and mobile app so you can diagnose problems, maintain uptime and maximize performance.
The core functionality of Server Density has always been (and will continue to be) monitoring. We have fantastic historical graphing to explore any problem areas, but the basis for using our software in the past has been in the instance that something just went wrong (i.e. you got an alert)―this use case is very reactive. Our dashboard represents a greater shift towards visibility across the whole infrastructure. It helps to identify negative trends before they become a problem. Server Density is becoming a management solution for your entire infrastructure, and expanding our use case away from simple reactive monitoring.
Traditionally our customer is a system admin, now the game is changing with the shift towards Development Ops teams who we target as well. Our target user is anyone who has a website (and a server) and who’s passionate about keeping it ‘online’.
Our dashboards allow our users to identify trends and provide a snapshot from a single moment in time across any number of metrics that our user configures. They aim to provide users with a platform for problem solving. They offer insight at the highest level, and present a starting point when you simply don’t know what part of the pipeline is causing trouble.
Server Density has always had a full featured dashboard but the new release broadens the functionality to pull in relevant data from 3rd parties. If you’re using different vendors and hosting services then it’s important to understand their status alongside your internal metrics and alerting. It helps answer questions like are all my alerts being caused by AWS US-East, again?
We use CoffeeScript and Backbone across the whole app UI, mostly because they make development faster and easier. A lot of the dashboard was completely customized to our users’ needs, but the customizable grid layout for positioning was done usingGridster, a jQuery chart plugin that allows building intuitive draggable layouts from elements spanning multiple columns. After that the individual widgets were styled according to the rest of our app UI.
We had initially anticipated needing a couple of external libraries to do what we wanted with the dashboards, but it turned out that Gridster, combined with our existing CoffeeScript/Backbone setup, did everything.
As with any feature, our primary concern when designing the dashboard was to create a solid foundation that affords us the flexibility to develop a wide range of functionality further down the line. Users of Server Density know their systems well and often have particular ways they like to view their infrastructure. For this reason, we realized there would be a few things the dashboard absolutely needed to support from the get-go:
It’d be hard to attribute our growth down to one feature like our dashboards because we’ve been able to ship so many so quickly over the last 6 months. It would be fair to say though that everything that is on our roadmap is because our customers are asking for ‘it’―we’ve seen a very positive increase in paid conversions since we introduced our dashboards back in November.
Absolutely! Businesses are looking to maintain and improve uptime, and dashboards are a very powerful way for an organization to passively see trends and issues in real time. A dashboard available in an office will allow multiple team members to pick up on issues, rather than relying on one or two people having the right thing open at just the right time.
With the constant growth of technology, we’ve seen an explosion in so-called “big data”. Everything around us is constantly producing data, and we need a way to make sense and relate the numbers to the real world. Data visualization is going to be the key to this, helping us make sense of an increasingly connected world.
If you liked reading this, you may also want to check out the behind the scene dashboard story of RescueTime and FacileThings.
Have someone you’d like to see featured in this series? Add them in the comment section below.
You can build complex web applications easily with Angular. But it’s a challenge to present…
JavaScript charts help transform raw data into clear, interactive visualizations that users can easily understand.…
Modern web applications depend on data visualization to transform complex information into clear, actionable insights.…
Data is a big part of modern software. Companies use charts to track sales, monitor…
Every day, businesses get more data than ever before. Looking at endless rows and columns…
Building interactive React charts from scratch can quickly become complicated. It becomes even more challenging…