Librato

Founding Team
Overview
In 2010, an exciting collaboration began. A budding designer crossed paths with two talented Computer Science graduates from VT—one based in San Francisco and the other in Virginia. Together, they embarked on an enlightening journey, diving into the intricacies of the Linux operating system, checkpoint restart technology, the burgeoning world of "The Cloud", and the complexities of time-series data. Out of this rich tapestry of knowledge, the first designs for the Librato SaaS product emerged. By the time SolarWinds acquired the venture five years later, Librato had grown into a thriving distributed team. This article serves as a testament to some of the Design work I had the privilege of contributing to at Librato. I hope you enjoy exploring it as much as I enjoyed creating it!
Role
I had the unique opportunity to lay the foundation for the Librato brand, leading the design of our MVP product. In addition, I oversaw the creation of our marketing, blog, and knowledge base platforms. In the early days prior to our Series A funding, I wore many hats—including diving deep into front-end development. Believe it or not, I even picked up "Javascript for Dummies" in 2011 to bolster my skills! As Librato blossomed, my role transitioned. I pivoted towards hiring and Design Direction, curating a distributed team of remarkably talented designers.
Concept
Librato
Remember when gradients were all the rage in 2011?
Enter Librato—a 'Software as a Service' product, built to devour 'Time Series Data' through its API. In its most basic form, time series data is a pairing of a numeric value and its timestamp, streamed to an endpoint at consistent intervals. Imagine a sensor in a field, diligently measuring soil temperature. Every minute, like clockwork, it logs the temperature and the precise moment of capture before sending it to its destination. If that sensor had internet access, Librato could easily be its digital home.

Although we recognised the potential of IoT devices, our primary focus at Librato was on monitoring servers and web applications. Often referred to as metrics, these time series could be anything from a server's 'average CPU utilisation' to an app's 'request volume'. Librato's magic touch involved ingesting these metrics, performing intricate calculations and aggregations, storing, and then alerting based on the data.
MVP
Librato
Metrics, Dashboards, and Alerts
The Librato user interface wasn't just an add-on; it was at the heart of our product offering. Through it, users could bring their data streams to life, visualizing each metric and seeing how they interconnected.

To paint a clearer picture, let's revisit the temperature sensor analogy. Instead of just one, imagine a field dotted with numerous sensors, each dutifully sending temperature readings. Every sensor, equipped with a unique identifier—be it a serial number or ID—transmits its data to Librato. Our platform then weaves these individual strands of data into a coherent tapestry.

While observing each data stream can be insightful, the true beauty often lies in the aggregated view. Users could delve into the average, min, max, sum, and other metrics of all the data combined. Quite frequently, these aggregate perspectives unveiled trends and patterns more compelling than the individual data points.
Delving into Dashboards with Librato
Librato provided users with a robust dashboarding tool, acknowledging that data exploration is not a one-size-fits-all experience. Actively engaging with the interface, users could click and hover over chart data points. Simultaneously, a passive engagement allowed for quick glances at dashboards, instantly absorbing critical information.

Our brain is a marvel in recognizing patterns. But where it truly shines is in spotting when a familiar pattern shifts or becomes irregular. This ability isn't just a cognitive quirk; it's rooted in our very survival instincts, alerting us when something isn't quite "normal" and could potentially be a threat.

Given this inherent human trait, it's no surprise that our users were fond of dashboards. Harnessing insights about cognitive function, Librato ensured that our dashboards were not only user-friendly but also aligned with our natural inclinations. Features like consistent color assignment, chart position locking, and swift auto-refresh intervals were all meticulously crafted to cater to the brain's knack for pattern recognition.
Empowering Action: The Alert System in Librato's UI
Completing the initial Librato UI suite was our Alerts feature. It's one thing to gather metrics, but turning that data into actionable insights is the game-changer. Taking the temperature sensor as an example, should it register a reading potentially detrimental to crops, immediate notification becomes crucial. With Librato, users could set specific thresholds, promptly acknowledge triggered alerts, and access relevant information related to an alert condition, all seamlessly integrated within our intuitive user interface.
Spaces
Librato
Responding to Change: The "Spaces" Journey in Librato's UI
As Librato's user base expanded, there was a growing demand for a lighter theme within the application. While we recognised the challenges of a predominantly white theme—especially when large screen displays are involved, potentially reducing the colour contrast on chart lines—we also understood the appeal of a less "intense" experience for laptop users.

This feedback catalyzed the birth of a significant redesign in the Librato UI, a project we affectionately termed "Spaces." The outcome was a brighter, more contemporary interface. Yet, interestingly, there's been a noticeable shift back to dark UIs in many modern products.

Striking a balance, we later innovated a feature within our dashboards: the ability for users to craft "profiles." One standout attribute of this feature was the option to toggle between light and dark themes, ensuring a tailored experience for every user.
Embedding Charts
Librato
Seamless Integration: The Librato Javascript SDK
Knowing that our users monitored a vast array of items crucial to their specific businesses, we believed it was vital to enable users to effortlessly display data sent to Librato alongside data from other sources or products. Consequently, Librato offered a JavaScript SDK, allowing users to embed their graphs on any webpage. I played a central role in the development of this library, which, interestingly, was penned in Coffeescript at the time. This SDK also underpinned all the charts within the Librato product. This ensured that users embedding charts externally enjoyed the same experience and visualisations that we provided within our own internal dashboards and UIs. Embedding a chart was as straightforward as incorporating the JavaScript SDK and a few lines of uncomplicated HTML code.
Documentation
Librato
Crafting Clarity: The Vital Role of Documentation in API-Driven Products
Constructing an API-driven product necessitated meticulous attention to its accompanying documentation. If users struggled to navigate the process of inputting data into the platform, the remaining experience would prove futile. Collaborating with our customer support and success teams, I took the helm in designing and cultivating these invaluable knowledge repositories.