Case Study - Fiddler DS

Overview

Fiddler is an explainable AI Platform that enables enterprise organizations to monitor, explain and analyze enterprise AI models at scale, with actionable insights which are trustworthy, transparent, and understandable.

Fiddler has created some amazing features on the platform which change the way people can monitor and analyze their monitors. As the Fiddler platform continued to add features, one of the challenges we faced has been being able to surface the correct model to a user at the right time. We went too far along without adding the necessary navigational features into our navigation with little regard to discoverability or a course data science user mental model.

The main goal of this project w to "Build a consistent way to increase the speed and efficiency of design and development cycles while also delivering quality user experiences across a broad platform."

role

Product Designer

UX, UI, Prototyping
and Testing.

TEAM MATES

Rob Harrell
‍product manager

Jack Reidy, Andrew MacDonald
‍Front end engineers

DURATION

April 2020 - June 2020
‍(3 Months)

LAUNCHED

July 2020

The challenge

As the product gained complexity, we realized that neglecting to invest in our design system was coming back to haunt us.

A year ago Fiddler remained small and didn’t have much turnover. It had been relatively easy to keep the design and user experience consistent and for everyone to be on the same page. However, as we began to grow and feature the development, multiple team members were at a crossroads as the solution became apparent: We needed to create an efficient model in order to scale our product while keeping our platform cohesive and consistent.

We saw that it made sense to align components from a visual and interaction standpoint in order to create a single source of truth in aesthetics, behavior, build, and experience.

Our objectives were to:

Empower autonomous cross-functional teams
Deliver new features while increasing overall cohesiveness of the platform
Speed up feature delivery
Increase shared understanding

Hypothesis

We hypothesized that if we codified our design system and processes, we could empower autonomous teams to deliver solutions faster while increasing the quality and cohesiveness across all experiences.

Constraints:

We had no dedicated Design Ops or tools team to create and maintain the system
Proposed changes to existing designs could only be applied through other feature releases
The solution must be easily maintained and amendable by others

process

At this stage of the project, we only focused on ‍3 core things to our design system :

Design principles (design principles existed in order to guide the process and output of work being done), design patterns, and the component library. Once these were established, I directed my focus to the delivery and maintenance of the design system.

Old components

Challenges with navigation using old components.

Redundancy in the nav elements
No clear hierarchy
Users does not know where to start from
Existing workflows are silo
Navigation is nor self-explanatory

new components

Navigation redesign with new components

Menu items are grouped to reflect the true value of similar actions
Grouping caters to the needs and workflow of a citizen data scientist
Each module has a clear call to action with a contextual description for user's to better understand
Existing workflows are not cilo
Frequently used modules or navigation elements are grouped for efficient navigation

outcomes

Did the design system help us achieve our objectives? Yes..

We did achieve our objectives.* While I saw significant improvements in sprint velocity, improved platform cohesiveness, these achievements could not be attributed to the design system itself — but rather to the habits and process of conversation. The documented design system was simply a recorded artifact of that work.

Scaling Fiddler ML platforms as one unified
design system