Flagsmith
Release features with confidence
Web Application
- Role
- Product Designer & UI Developer️
- Year
- 2020
- Disciplines
- UX Design, UI Design, Interaction Design, Frontend Development
Overview
About Flagsmith
Flagsmith (formerly Bullet Train) is an open-source feature flagging and remote configuration platform, enabling teams to efficiently manage feature rollouts, A/B tests, and dynamic configurations. The project originated as an internal initiative at the agency Solid State Group. With available capacity not being fully allocated to a client project, I took the opportunity to spend a few weeks as the sole product designer tackling the navigation redesign. Additionally, I contributed to UI development by removing duplicate code and unused CSS while making the UI more modular with reusable components.
As Flagsmith evolved, its web app navigation became a growing challenge for users, leading to inefficiencies, usability frustrations, and a barrier to business scalability. This case study explores the redesign of Flagsmith’s core navigation to improve usability, enhance user satisfaction, and support future growth.
Problem
Through user feedback and analytics, several key pain points emerged in Flagsmith’s existing navigation:
- Complexity & Clutter: The existing navigation structure was overwhelming for new users and cumbersome for power users. As the platform grew in features and capabilities, the navigation was struggling to accommodate new functionalities.
- Inconsistencies: Users reported inconsistencies in navigation patterns, leading to confusion and increased cognitive load.
- Findability Challenges: Essential features and settings were not easily discoverable, resulting in wasted time and frustration. There was particular confusion in the UI regarding a “project” and an “environment” with not enough clear differentiation between the two.
Old Flagsmith (formerly Bullet Train) interface
Improvements needed
Goal
Based on discussion with the Flagsmith founders and having reviewed our findings, the quick win redesign aimed to:
- Improve Findability & Discoverability: Enhance the visibility of core features and settings in the primary navigation.
- Ensure Scalability: Design a flexible navigation system that can accommodate future product expansions.
- Improve Code Modularity: Refactor the UI code by componentizing core elements such as buttons to create a more scalable and maintainable front-end system.
Solution
Solution & Design Process
Research & Insights
To better understand user needs, we conducted:
- User Interviews & Surveys: Gathering feedback from existing customers and prospects to identify major navigation pain points.
- Behavioral Analytics: Analyzing click heatmaps, session recordings, and frustration signals (rage clicks, error clicks) in Fullstory to uncover inefficiencies.
- Competitor Analysis: Reviewing navigation patterns from leading feature flagging and configuration tools to identify best practices.
Solution & Design Process
Enhancing Usability with a Modern Navigation Pattern
- Sticky Sidebar Navigation: An improved persistent left sidebar navigation, allowing for quick access to key areas.
- Collapsible Menus: Secondary and tertiary navigation elements were nested in collapsible menus, reducing visual clutter.
- Quick Action Button: Commonly used actions (e.g., creating feature flags) were made accessible with a prominent action button.
Processes:
- Sketching
- UX Design
- Clickable prototypes
- UI Design
Solution & Design Process
From open source project to commercial open source business
Flagsmith (formerly Bullet Train) was initially built as an internal feature flagging tool. After growing revenue to enough to support themselves the founders decided to go full time and bring the commercial open source feature flag and remote config product to market. As part of this, the product was rebranded from Bullet Train to Flagsmith. This would establish the brand, and potentially have a big impact on their ability to grow through organic search (it turns out that Bullet Train returns, well, more trains than feature flags).
I worked with the Flagsmith brand designer to ensure the new brand was reflected in the updated UI.
Solution & Design Process
Improving Visual Hierarchy & UI Consistency
We optimised the user experience by standardising typography, spacing, and iconography for a more cohesive design. We enhanced the navigation with clear distinction between entities to improve orientation and minimise cognitive load. Colour-coded indicators were introduced to distinguish between different environments and projects, ensuring clearer visual differentiation.
Solution & Design Process
UI Development & Code Refactoring
Beyond design improvements, I optimised the UI codebase by removing duplicate and unused CSS, streamlining styling for better efficiency. I also componentised key UI elements such as buttons, inputs, and modals, enhancing maintainability and scalability. Additionally, I refactored layout structures to ensure consistency across different views, creating a more cohesive and adaptable interface.
Solution & Design Process
Iterative Testing & Validation
We validated the new navigation by testing it with real users through post-launch behavioural analytics, tracking event funnels, frustration signals such as rage clicks and error clicks, and overall user engagement metrics. Additionally, we established a post-launch feedback loop via GitHub, enabling continuous user input to refine and enhance the experience further.
Impact
The redesigned navigation and UI improvements delivered measurable benefits:
Redesigning Flagsmith’s navigation was a strategic move to enhance usability and support the platform’s growth from open source project to commercial open source business. Since the rebrand and UX improvements, Flagsmith have onboarded some high profile clients such as Citi, Wistia and Okta. They continue to be one of the most popular open source feature flag repositories on Github with over 5 thousand stars and counting.
28%
Reduction in Task Completion Time: Users completed common tasks significantly faster due to improved findability.
25%
Increase in User Engagement: Higher feature adoption rates and reduced drop-offs.
5.3k
Github stars: One of the most popular open source feature flag repositories on Github.
LOVE the new design. Great job. HIGH FIVES TEAM.
Ben Rometsch / Co-founder, Chairman of the Board @Flagsmith
Niall Quinn 2025