Flow Builder Redesign
The original builder was so complex that no merchant could use it without help. How we redesigned it so they could work independently.
HelloRep, Structuring an AI Automation Platform
HelloRep,Structuring an AI Automation Platform
HelloRep lets Shopify merchants automate customer conversations with AI. Over two years the product went through a complete rethink,from a manual logic builder nobody could use on their own, to an AI that merchants train simply by talking to it.
What HelloRep does
HelloRep is a chatbot for Shopify stores. It lives on the merchant's storefront and handles customer conversations,product questions, order status, returns, anything the merchant has configured. Routine support happens automatically. The merchant doesn't need a team watching the inbox for questions the AI can already answer.
The product sounds simple. Building it well wasn't.
How the product evolved
When I joined, HelloRep had a Flow Builder,a canvas where merchants designed the AI's conversation logic themselves. The idea was right: give merchants control. The execution meant that in practice, nobody could set up a flow without help from the HelloRep team. The canvas was too freeform, the logic too abstract, the interface too close to programming. Most merchants gave up before finishing their first flow.
Redesigning the Flow Builder was the first phase of work. Then, while that work was ongoing, AI language models improved dramatically,to the point where merchants no longer needed to write the logic themselves at all. The AI could handle open-ended conversations without explicit rules, as long as you could teach it about your store. That shift made the entire Flow Builder paradigm optional, and led to the second major piece of work: Test & Train. Instead of building a flowchart, a merchant opens a simulation, talks to the AI as if they're a customer, and corrects it when it's wrong. No logic trees. No programming. Just conversation.
Running alongside both of these was a third thread: the platform itself had grown fragmented. Navigation didn't match how merchants thought about the product. Four teams had built four corners of the product in slightly different visual languages. So we rebuilt the information architecture, and built a design system to hold it together.
My role
I worked across the full product,not as a feature designer but as the person responsible for how the pieces fit together. That meant defining the information architecture, redesigning the Flow Builder, designing Test & Train from scratch, shaping the chat widget experience, and building the design system the team works from now.
The Conversations view. Merchants can filter by date, platform, customer tag, and topic. Live and past conversations are both accessible, with the full thread and AI context visible on the right.
Deep dives
Each piece of this project has its own story. Below are the four areas where the most substantial design thinking happened.
Explore
Test & Train
When AI improved enough to replace explicit logic entirely, we needed a completely new way for merchants to shape how the AI behaves.
Core Platform Structure
The product had grown without a coherent structure. How we defined the architecture and rebuilt the navigation so everything finally made sense.
Design System
Four teams, four different visual languages. How we built a layered system that brought consistency without stopping anyone from moving fast.