When the world’s most complex technical systems create a tsunami of information and powerful functionality, don’t try hold it back, just catch the wave.
The cloud is expanding. Cisco’s 2018 Global Cloud Index reports that by 2021, 95 percent of the 19.5 zettabytes that move through global data centers annually will come from the cloud. (1) The applications generating this huge amount of data include hundreds and even thousands of individual, distributed components..
To monitor applications in this complex environment, developers need smart, efficient and effective analytics. Our client, SignalFx, who was just acquired by Splunk for $1B, was designed to offer an interactive, system-wide view of web applications and infrastructure data. We worked with the company from its earliest development stage, getting a first-hand experience of how SignalFx allows customers to find meaningful patterns among the signals generated by dynamic, distributed applications.
SignalFx founders knew that they wanted design as part of product development from the start and they met with several design firms, both large and small, before hiring DesignMap.
“The larger firms we talked to had very defined processes that we weren’t sure would work for us,” explains the company’s co-founder Karthik Rau. “We wanted more creativity and deeper insight than that. DesignMap’s seasoned designers had the experience and inventiveness we needed to help establish a foundation for the product.”
The first phase of our engagement with SignalFx spanned several months, during which we formed a tight partnership with the company’s engineering team working with them both on- and off-site.
“The level of collaboration on this project was a new experience,” explains DesignMap’s project lead Rob Gardziel. “We’ve worked on-site with other clients, but not as intensively as we did with SignalFx. Being at their offices once or twice a week was critical to this project.”
“Our work together was a highly engaged and interactive process. DesignMap felt like an extension to our team” agrees SignalFx’s Rau.
Our starting point was completely “blue sky:” SignalFx had no customers, no users and no set features. The company’s complex, leading-edge technology and radically different approach to monitoring required a lot of effort to understand. DesignMap’s first task was to interpret the goals and intentions for the product through our designer’s communication lens.
“We expended a lot of energy ramping up on what SignalFx was trying to do,” explains Gardziel.
“Initially, it was a struggle to talk about the product in a way that resonated with us. We kept at it, creating scenarios of realistic user interactions so that we could start visualizing the application. It was in the art of the explaining and interpreting that everyone began to understand what the product was,” he concludes.
Working closely with engineers, DesignMap’s team helped to define the product’s workflow, created wireframes to visualize concepts and worked on design as prototypes came together. At times, this work included white board sessions during which designers would sketch and engineers would write code showing how development would evolve to support UX directions.
Creating a charting system for the huge amount of complex, aggregated data collected by SignalFx was a key element of the product design. As we ran though typical use scenarios, new UX elements for the charting system would emerge.
For example, developers typically use percentile calculations to exclude outliers. By looking at the 98th percentile of a response time metric across a population, they exclude the worst 2% of responses. In some scenarios, users might want a simple way to dump anomalous results (the 2% outliers) to allow a quick picture of application performance norms to emerge. Or, conversely, they might want to focus in on the anomalous 2%. Either way, once we understood how users might interact with this “98th percentile” we knew we needed to support all use cases with design elements that would allow typical users to interact with percentile choices.
After three months of work, SignalFx had a solid product foundation, design direction in hand and was ready to hire an in-house design team to start development.
“We had the skeleton and were ready to get the meat built around it,” comments Rau. “When we put the product in front of customers, we started getting feedback right away on what was working, what wasn’t and how to make the experience more usable.
“We started making incremental UX changes based on that feedback, but even incremental changes can have a huge impact on the overall product. At that point, it made a lot of sense to us to bring DesignMap back to work on the UX because they knew us and the product so well,” Rau explains.
Our design team started this second phase with a complete heuristic review to capture any and all areas of the design that needed attention. Our analysis reviewed consistency, components, visual hierarchy, style and function.
For each design issue we uncovered, we offered a fix. On the simplest level, we recommended keeping grid design and light box placement consistent throughout the design as well as including both labels and icons on menu flyouts, among other fixes. We also provided style revisions for navigation hierarchy and behaviors (see example below).
“DesignMap came back to us with great ideas,” concludes Rau. “When we implemented their revisions to the UX, we got immediate positive feedback from our customers.”
“We were pleased to have an opportunity to look at the final product design for fit and finish,” concludes Gardziel. “Everyone at SignalFx was committed to high-quality product design from beginning to end.”