MESOSPHERE: SCALING TABLES FOR ENTERPRISE

 

OVERVIEW

Mesosphere builds modern software infrastructure tools that help companies to quickly deliver data-driven services on any datacenter or cloud. DC/OS is a platform, built by Mesosphere, that helps developers and data center operators easily run and maintain their software applications.

In May 2018, Mesosphere was at a significant crossroads. Should they continue to work on new features in their product, DC/OS, or should they double down make sure DC/OS is performant, stable and scalable for large enterprise customers? They chose the later and this paved the path for new wave of customers.

MY ROLE

I led the design of the new, scalable tables UI component in Mesosphere DC/OS.

THE BUSINESS PROBLEM

The largest US financial customer was using our product, DC/OS, to run about 15 percent of their software infrastructure. This customer wanted to scale our product to run 75 percent of their software infrastructure. However, they had major hesitation to increase usage of DC/OS as the product had reported issues of performance, stability and scalability.  A renewal contract was in jeopardy if we did not increase the number by to 50%. At the same time, Mesosphere was shifting their market strategy to target large enterprise customers, like their large US financial customer, who are trying to shift from on-prem to cloud service providers.

THE DESIGN CHALLENGE

Within DC/OS’s UI, developers and data center operators use our tables to help manage their software infrastructure.

How might we make DC/OS UI tables scalable for large enterprise companies that want to run and manage 1,000s of services?

Video Block
Double-click here to add a video by URL or embed code. Learn more

USER GOALS

First, I set out to understand the goals that developers and data center operators are trying to achieve with the tables.

1. Troubleshoot: They want to drill down into problem areas in their system and tackle infrastructure critical problems as fast as possible.
2. Manage: They want to configure and optimize all their applications that are running on their infrastructure.
3. Monitor: They want to know the health of their applications.

USER PROBLEMS

Then, I tried to understand some of the problems with the current tables in DC/OS.

Problem #1: Search behavior was different across tables.
Problem #2: Group actions are hard to find and inconsistent across tables.
Problem #3: No rules on how table actions should behave.
Problem #4: The UI breaks when there is more than 100 rows in the table.
Problem #5: The user can’t customize the table for their specific needs.
Problem #6: There were general readability issues in the table that made it hard for user’s to read and understand the text.

THE PROCESS

  1. Defining scope and process for the project

  2. Conducting cursory competitive research

  3. Research of industry standards

  4. Sketches

  5. Design Workshop

  6. Designing table components to include in a design system

  7. Using those table components and designing tables in areas of the product that are very robust

  8. Documenting our tables design system and working in code with frontend to implement the solution.

OUTCOMES

  1. Mesosphere gained loyalty and trust of their customers and paved the path for new customers.

  2. I was able to sell the business value of creating a design system.

  3. Customers can now scale with our product.

CHALLENGES

  1. Clearly breaking up the table into small components for frontend engineers to build.

  2. Clearly communicating to backend architects the flexibilities that are needed to achieve optimal user experience.