BuildShip - Interactive flowchart

Overview

BuildShip is a no-code platform for visually creating and managing backend systems. When I joined, the product was already functional, actively used, and growing quickly. Like many early-stage products, it had been developed at high speed to deliver value to users, which meant some deeper architectural considerations had not yet been fully established. This created both challenges and opportunities as the product matured.

The Problem

The editor was central to the product and already delivering impact for users. But under the hood, its structure reflected the fast pace of early development. Patterns weren't yet consistent, logic was sometimes tightly coupled, and parts of the system had grown organically. As a result, extending or modifying the editor required extra care, and even small changes risked introducing side effects.

What I Built

To strengthen the foundation, I led a migration of the editor to React Flow, a purpose-built library for building node-based editors. On top of it, I built a declarative abstraction layer for defining nodes and edges, which introduced consistency and flexibility across the codebase.

I then addressed layout issues by developing a custom node positioning algorithm. This system calculated placement based on node dimensions and connections, automatically generating clean, structured layouts. It resolved overlapping issues and replaced scattered, ad-hoc positioning logic with a centralized solution.

Finally, I introduced a Model-View-Controller (MVC) architecture around the editor. The model managed graph state, the view rendered through React Flow, and the controller handled user interactions such as drag-and-drop. This separation of concerns made the editor easier to understand, extend, and maintain.

Results

The migration delivered a more stable, maintainable, and extensible editor. Layout issues were eliminated, architectural clarity replaced scattered logic, and the system became a stronger foundation for supporting future growth and advanced features.

Takeaway

This project taught me how to make strategic technical decisions and improve core systems under pressure. It reinforced the importance of abstraction, separation of concerns, and architectural clarity when scaling real-world applications.