Flagsmith | Niall Quinn

About Flagsmith

Flagsmith (formerly Bullet Train) is an open-source feature flagging and remote configuration platform that helps teams manage feature rollouts, A/B testing, and dynamic app configurations. Originally built as an internal Solid State Group tool, it evolved into a fully fledged commercial SaaS business.

I led the redesign of the web app's navigation and contributed to refactoring the UI codebase. The goal was to simplify workflows, improve scalability, and support the company's transition from internal tool to successful open-source product.

The Problem

As Flagsmith grew, its original navigation system became increasingly difficult to scale and confusing for users.

Key issues identified:

Complexity and Clutter: The menu structure struggled to accommodate new features and overwhelmed users.
Inconsistency: Navigation patterns and visual hierarchy lacked consistency across sections.
Findability Challenges: Users couldn't easily locate projects or environments and terminology created additional friction.

It’s not immediately clear what’s a project vs. an environment. I spend more time finding things than configuring them.

User feedback / GitHub discussion thread

01 / Discovery & Research

Research & Insights

Working with Flagsmith's founders and development team, I led a rapid discovery phase to understand user pain points and business needs.

Methods included:

User interviews and surveys with active open-source contributors and paying customers.
Behavioral analytics via FullStory to identify rage clicks, misclicks, and friction points.
Competitor benchmarking of other configuration platforms such as LaunchDarkly and ConfigCat.

A key insight from this research:

Users wanted more clarity, fewer clicks and a clearer hierarchy that would result in less cognitive load.

Design Goals

Improve findability of core features and navigation clarity.
Enable scalability for future feature growth.
Modernise the UI with consistent typography, color, and iconography.
Increase front-end efficiency through code modularisation.

IA & Wireframes

I mapped the existing user flows and proposed a restructured IA centered around Projects and Environments as distinct, top-level entities.

Wireframes explored various sidebar patterns and content hierarchy approaches, validated through quick internal usability tests.

02 / Design Exploration

Navigation Redesign

Introduced a persistent left sidebar for key navigation items.
Added collapsible menus to reduce clutter and allow scalable sub-navigation.
Integrated a global "Create" button for quick access to key actions such as adding flags or environments.

Visual & Interaction Design

Established a refined UI system for typography, color tokens, and spacing variables.
Rebranded the old Bullet Train interface with the new Flagsmith visual identity. Introduced a more modern UI with improved hierarchy, contrast, and focus on clarity.
Improved contrast and legibility to meet accessibility standards while aligning with the new brand's visual tone.

03 / UI Implementation

UI Development & Code Refactoring

At Solid State Group, designers also implemented their work in production code alongside full-stack developers. I built out the redesigned interface in React, refactoring the CSS and component library to make the front-end more modular. This allowed full-stack engineers to focus on the core application logic and APIs, while ensuring design consistency across the product.

Testing & Validation

The new navigation was tested through: Internal user testing with existing customers and open-source contributors. Post-launch analytics (FullStory) to monitor navigation success rates and engagement. Continuous feedback loops via GitHub issues, leading to further refinements.

The redesign makes navigating Flagsmith so much faster! Everything feels exactly where it should be.