THE PROBLEM
A product good enough to earn a Series A had a UI architecture that wasn't built to scale.
Superorder came into the engagement with real traction: 1,500 or more restaurant customers across 180 or more cities, 1.5 million or more orders facilitated, and a product thesis that had convinced Foundation Capital and Y Combinator alumni to write checks. The design foundation that got it there was described internally as having a "decent initial aesthetic" - which is a polite way of saying it was built to ship, not to scale. Each new feature had been added onto existing surfaces rather than pulled from a shared component system, and the compounding effect of that approach was starting to show. The interface was getting cluttered faster than the product was getting better.
Every new feature made the existing experience worse, at exactly the moment the company needed to accelerate.
The core failure mode of fast-shipping startups is not bad design decisions on individual screens - it is a design architecture that doesn't compound. Superorder was shipping reputation management, delivery pipeline consolidation, financial reconciliation, virtual brand tooling, and AI agents all within the same product shell. Without modular components, each new surface added cognitive load to every other surface. Restaurant operators - who are running a physical business and treating the software as a tool, not a destination - were starting to feel that friction. The platform was entering its highest-growth period while the interface was degrading in usability. The two curves were moving in the wrong directions relative to each other.
The previous US-based design agency had introduced a handoff lag that an embedded-model engagement needed to eliminate.
Part of the structural problem was operational, not just visual. The prior agency model created a gap between design decisions and engineering implementation — a cycle of async reviews, revision rounds, and delayed handoffs that slowed down a team that was moving on a growth-stage clock. For a product serving restaurants in 180 cities where delivery platform integrations, review management, and financial reconciliation all had to work reliably and update in real time, slow design cycles were a compounding liability. The engagement model had to change alongside the design system.
THE DESIGN JOURNEY
We replaced the agency model with daily Slack collaboration directly inside the engineering team.
The first decision was structural. We embedded into Superorder's workflow — not as an external reviewer sitting outside the development cycle, but as a daily participant in it. Slack calls with engineers every day, direct collaboration on feature scope before anything went into design, and a handoff discipline that gave developers production-ready specs without a separate review cycle. The design-to-development lag that the previous agency had introduced was eliminated from the first week. This matters because the design system we were building had to be adopted by engineers as a working tool, not accepted as a deliverable. That only happens when the designer is in the room when the engineering decisions are being made.
We audited the existing surfaces before touching a single component.
Before building anything new, we mapped the full product: what was bolted on, what was architecturally clean, what was carrying too many responsibilities in a single component, and where the information hierarchy had been compromised by accumulated feature additions. The reputation management dashboard, the delivery pipeline views, the financial reconciliation surfaces — each one had its own local logic that had never been rationalised against a shared system. The audit produced a clear picture of the architectural debt and a prioritised sequence for migrating it to modular components without breaking the customer experience for 1,500 or more active restaurants in the process.
The component library was built to absorb future product surface area, not just to clean up the current one.
The brief from Raghav was framed as "future-proofing the interface for rapid expansion" — which meant the design system's success metric was not how well it handled today's feature set but how gracefully it handled the next twelve months of shipping. We built modular dynamic components with explicit rules for how they extended under data load, how they composed into new surfaces, and how new feature types (AI agents, virtual brands, financial reconciliation modules) could be added without requiring a redesign of existing patterns. Every component was built with its future variant in mind, not just its current use case. The result was a library that gave the engineering team a predictable, reusable building set for any surface Superorder needed to ship next.
THE SOLUTION
A modern, component-based design system that made the interface a multiplier instead of a constraint.
The delivered design system was not a visual refresh — it was a structural rebuild of how the product was assembled. Modular components replaced bolted-on patterns across every major surface. The reputation management dashboard, the order management pipeline, the delivery analytics views, and the financial reconciliation interfaces all migrated to the new system in a sequence that kept the product live and the customer experience stable throughout. The "premium feel" that came with the new visual language was a secondary effect of the architectural work, not the primary goal. The primary goal was a UI that could absorb new features without degrading — and that is what shipped.
AI agent surfaces were integrated into the existing product without feeling bolted on.
One of the hardest design problems of the engagement was absorbing Superorder's AI agent layer — review management agents, survey and feedback automation, delivery profitability agents — into a product that had been built around human-initiated actions. AI-generated outputs have different UI grammar from user-initiated views: they need confidence signals, override affordances, audit trails, and status indicators that don't exist in a standard B2B dashboard. We designed patterns for each of these that pulled from the shared component library rather than introducing new visual conventions, so the AI surfaces felt native to the product rather than added on top of it.
Feature deployment velocity doubled as a direct consequence of the component architecture.
The 200% faster feature deployment outcome is an engineering metric, but it was produced by a design decision: a component library that gave developers a building set they could trust rather than a spec they had to re-interpret for each new surface. When the design system is modular and the designer is embedded in the development workflow, the handoff is not a document — it is a shared vocabulary. Superorder's engineering team could ship new surfaces faster because the design decisions for those surfaces were pre-resolved at the component level. The design system did not just improve the product's appearance; it changed the rate at which the product could improve.
THE KEY MOMENT
The moment the component library absorbed a net-new AI agent surface without a design conversation was when the system proved itself.
There is a test that every design system either passes or fails as a product scales: can a new feature be built from the existing component set without requiring the designer to invent something new? For most bolted-on systems, the answer is no — novel features expose gaps in the library and the designer gets pulled back into screen-level work. On Superorder, the AI agent surfaces were the test. They were net-new interaction patterns — status indicators for in-progress agents, override controls for automated review responses, confidence-tier visual signals for profitability flags. None of those patterns had existed in the product before. When we built them, they pulled from the existing token architecture, the existing component grammar, and the existing information hierarchy without requiring a new visual language. The surfaces felt native because they were built from the same materials as everything else. That moment confirmed the design system had been built to the right level of abstraction: specific enough to be useful, general enough to survive surface area it had never anticipated.
The work, in detail.
The screens below cover the full engagement: the reputation and delivery management dashboards rebuilt on the new component system, the AI agent interfaces for review management and delivery profitability, the financial reconciliation surfaces, and the virtual brand tooling — all composited from the same modular library.
Superorder
industry:
Food-Tech, B2B SaaS, AI
SCOPE:
Product
,
Creatives
duration:
9 months
key outcome:
65%
cost cut vs prior agency
