Behind the scenes of Server Density’s dashboard design: In conversation with David Mytton
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.
I recently caught up with David Mytton, Founder & CEO of Server Density, to discuss what went into building their dashboard, their technical considerations and the future of the data visualization industry. Here are the excerpts from the interview:
What is Server Density and how does it solve user problems?
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.
What were the primary reasons behind incorporating a dashboard in your product?
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.
Who is your primary target user and how does the dashboard help him perform his job better?
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.
The Ops dashboard is a recent addition to your product. Tell us something about its added functionality.
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?
How did you go about building the dashboard? What were the technical decisions you had to make?
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 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.
What were your design considerations for the dashboard?
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 dashboardabsolutely needed to support from the get-go:
- Multiple, named dashboards
- User-specific dashboards
- Customizable layout
Any specific business benefit (in terms of growth) you observed by adding a dashboard?
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.
Do you think information dashboards are important in software products?
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.
Where do you see the data visualization industry in 2014?
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 ofRescueTime and FacileThings.
Have someone you’d like to see featured in this series? Add them in the comment section below.
