Case Study
From Design System to ReBrand Studio
Leading Overture Promotions' web store design practice from Adobe XD to an AI-generated storefront tool
Role:
Company:
Timeline:
Tools:
Scope:
Design Lead / Manager
Overture Promotions
Ongoing, from tool migration through design system build to AI app development
Figma, Figma Make, Claude (Claude Code), BrandFetch, Supabase, Git
Design systems, UX/UI strategy, AI-assisted design tooling, solo-built internal application
Overview
Overture Promotions builds branded e-commerce "web stores" for clients. Basically, custom online catalogs of branded promotional products. As design lead, I was responsible for how the team designed and produced these stores, from choosing our tools to, eventually, building a piece of internal software that generates them automatically. This case study traces that arc: modernizing our design toolchain, building a reusable design system, and then designing and solo-developing an AI-powered application that lets our sales team generate a branded web store in minutes.
All images used for the presentation of the application are from an early alpha build and do not illustrate the final product.
The Problem
When I stepped into the design lead role, the team was still producing web stores in Adobe XD. A software Adobe had already announced it would stop supporting. Every store was built close to from scratch, which made output slow and inconsistent, and the team's UX/UI skills varied widely. On top of that, the rise of generative AI was rapidly resetting client expectations for turnaround time. Overture needed a faster, more consistent way to produce web stores; without those two goals working against each other. Speed for its own sake risked sending clients "AI slop" that undersold the brand; consistency without speed meant losing pitches to competitors who could turn something around same-day.
The Process
1. Closing the skills and tooling gap
Rather than quietly working around Adobe XD's end-of-life, I raised it directly with the Art Director and proposed investing in the team's UX/UI education; I offered to pursue courses and certifications on my own time if Overture would cover the cost. That conversation led him to a different, better solution: he found and hired a UX/UI consultant based in India, and the team completed roughly 60 hours of structured workshops together. That shared foundation made the next phase possible. meaning the whole team, not just me, was fluent enough in UX/UI practice to build a real design system rather than another set of one-off templates.
2. Building the design system
With that training in place, the team moved into Figma and built a proper design system: a shared brand component library, defined styles and variables, and a set of reusable templates. This took a typical web store from a from-scratch build down to an 8–10 hour turnaround. This was a major jump in consistency, speed, and the direct predecessor to everything that came after.
A webstore example using our design system.
3. Testing AI as a production tool
As generative AI tools matured, I led several months of hands-on experimentation with AI-assisted design generation, including Figma Make, to find where AI could reliably contribute to production and where it fell short. The conclusion I reached was that AI could accelerate parts of the process convincingly, but it could not be trusted, on its own, to produce a finished, on-brand deliverable for a paying client.
4. Reframing the problem as two products, not one
That conclusion mattered because Overture's leadership was pushing for something specific: the ability to generate a rough web store in two to three hours so sales could use it as a cold-outreach asset. I made the case that a single AI-only pipeline couldn't responsibly serve both that use case and Overture's largest, highest-paying clients. Who were expecting, and paying for real, intentional final products. I split the problem into two explicit tracks:
-
A fast, disposable path - quick, AI-assisted storefronts sales could generate on demand for cold outreach, where imperfection was an acceptable trade-off for speed.
-
A robust, design-system-driven path - the Figma-based system, reserved for real client deliverables where brand quality couldn't be compromised.
Rather than build the fast path as a lesser, disconnected hack, I proposed something more ambitious: a full internal application that could generate a genuinely usable web store on demand, combining speed with enough design rigor to actually stand in for the manual process.
5. Building the application - solo, from the ground up
I got buy-in from the Art Director to pursue this as a real build, was set up with a Claude account and Claude Code, and built the application myself; as a solo, "vibe-coded" project. I'm not a developer by training, and I don't present myself as one; this was a deliberate bet that AI tooling had reached a point where a design lead could responsibly own the full build of an internal tool, not just its interface. That included the fundamentals I hadn't needed before: installing Git, sourcing and managing API keys across services (BrandFetch, Adobe, OpenAI, and others), and standing up Supabase as the hosting layer for generated stores.
The resulting workflow lets a salesperson:
-
Choose a pre-built template, or build and save their own, from a dropdown.
-
Type in the brand they're pitching; the app pulls the brand's identity via a BrandFetch integration.
-
Click generate, and receive a fully templated, on-brand web store populated with products generatively re-skinned to match the client's branding and pricing.
-
Click through from any product on the generated store to the live purchase page, so the demo is a working store, not a mockup.
Early example of application output (Before Adobe Firefly API integration)
Outcome & Current State
The application is functional but I'm still filling it out with features and making the templates fluid enough to sell the branding. I'm about a month or two out from sending this out to our dev team. Soon, the app will give Overture's sales team a way to generate a realistic, branded storefront for a prospective client in a fraction of the time the manual process requires. Without resorting to unvetted AI output as a final product. It sits alongside, rather than replaces, the Figma design system, which remains the standard for Overture's largest and highest-value clients. Together, the two tracks give Overture a tiered answer to the speed-versus-quality tension that generative AI created across the industry: a defensible fast path for pipeline-building, and a protected high-quality path for revenue-critical work.
Next Steps
-
A login and account system so individual salespeople can manage their own generated stores, rather than seeing the full shared volume across the team.
-
Expanded template variants, to support multi-page layouts and category pages needed for pitches to larger prospective clients with bigger, more complex catalogs.
-
Completing the integration into our Overture internal network and hosting the webstores on our own servers as an added security measure.
Reflection
The throughline across this project was recognizing that a single solution (whether "more Figma" or "more AI") wasn't going to satisfy Overture's actual range of needs. Rather than picking a side in the AI-versus-craft debate, splitting the problem into two deliberately different tracks let each one be judged on its own terms: speed where speed was the point, and design integrity where a client's brand and Overture's reputation were on the line. It also pushed my own role further than I expected. From advocating for team training, to leading a design system build, to independently scoping, designing, and building a production application, learning the engineering fundamentals as I went.