Case Study — Shaping AI Product Vision
Defining the AI vision for a tool product teams already trust
Summary
I defined product vision and design strategy for AI-powered design generation at Balsamiq, driving the initiative from discovery through concept demos that aligned the company around a new direction.
The Challenge
Balsamiq Wireframes had served 1.4M+ users for over a decade. The question wasn't whether to add AI. It was how to do it without betraying the philosophy that made it an approachable, reliable and trusted tool.
The wireframing landscape was shifting fast. AI code generation tools were letting people skip wireframing entirely, going straight to working interfaces. Balsamiq needed a response that honored its low-fidelity, thinking-first philosophy while embracing what AI could offer. The answer was moving from drag-and-drop to describe-and-draft.
It was an existential product strategy question. I took ownership of the initiative as design lead, driving it from early discovery through shipped beta.
Discovery & Strategy
Before designing anything, I needed to understand what AI-powered wireframing should actually mean for Balsamiq's users.
I led competitive research across the emerging AI design tool landscape, mapping capabilities, interaction patterns, and user expectations. The UX team explored how Balsamiq users thought about ideation vs. execution, and where AI could genuinely help vs. where it would get in the way.
The key insight: Balsamiq users were already using generative tools and wanted AI to help them explore more possibilities faster while keeping the low-fidelity, thinking-oriented workflow that made Balsamiq fast and powerful for early ideation.
Through iterative sessions, the product team explored different user approaches to starting design, from converting attached images, urls, and natural language text to wireframes. These explorations helped to define the scope, interface and experience for users.
Chat-driven interaction
I designed a conversational interface where users describe what they need and the AI generates wireframe suggestions. This preserved the exploratory, low-fidelity spirit of Balsamiq rather than creating a "magic button" that generates finished designs.
Rules and guardrails over open-ended generation
I developed chat rules, logic, and test scenarios mapped to different use cases. The AI needed to produce wireframes, not polished UI, maintaining the tool's philosophy that low-fi intentionally focuses discussion on functionality and content.
Prototyping & Pitching
I built working prototypes to make the vision tangible, then wrote the PRDs that turned concepts into an engineering roadmap.
Rather than merely presenting static mockups, I built functional prototypes using Claude Code and other AI tools that demonstrated the actual conversational flow of AI wireframe generation. These prototypes let stakeholders and a select group of customers experience the concept firsthand—interacting with it, not just looking at it—in order to gather feedback and motivate the product team.
For each implementation phase, I updated the requirements as Shape Up-style pitches. Each pitch framed the problem, proposed a solution with clear boundaries, and identified risks. This gave engineering a clear path from concept to code.
From concept to shipping
Research & competitive audit
Mapped the AI design tool landscape, interviewed users, identified strategic positioning for AI within Balsamiq’s philosophy.
Working demos, not decks
Built functional prototypes. Presented interactive concept demos that let the team experience the vision.
PRDs and design review
Wrote Shape Up-style pitches as PRDs. Led design review throughout development.
The demo
The presentation
The Impact
Speed
Idea-to-design cycles dropped from hours to minutes for non-designer users.
Confidence
The output matched what users intended and got them past the blank screen.
Collaboration
PMs could show up to design reviews with something real, accelerating team alignment.
higher trial-to-paid conversion for qualified users who engaged with the feature, measured after launch. The number validated the bet on iteration over blank-canvas generation.
Reflection
What driving an AI initiative inside a mature product taught me.
Vision needs a vehicle
Concept demos were the turning point. Discussions hadn’t created alignment—but putting a working prototype in front of staff and real customers did. The medium is the message when you’re pitching innovative features.
Identity is a product decision
AI tools shouldn’t replace your judgment. They should speed up the work, so you can find the right solution. Balsamiq gained a capability without losing its identity, and the discipline was knowing what to protect.
PRDs as design artifacts
Writing pitches forced sharper design thinking than wireframes alone. Defining boundaries, risks, and tradeoffs revealed gaps that visual artifacts could miss.
AI fluency is a leadership skill
Being able to prototype interactions rather than just describing changed the quality and speed of conversations with engineering. When the design lead can demo working code, the whole team moves faster.
Ship the narrow version, not the whole demo
We generated one perfectly laid-out screen on the first try and held the rest—including prototype generation, the loudest wow in every session. A reliable first shot earns the trust that funds the ambitious work.
Let the model output HTML
Having the LLM generate HTML and letting the application handle layout—instead of placing elements directly from text output—was the technical call that unlocked reliable, predictable screen generation.
The AI wireframe generation feature I conceived and drove is the most significant product direction change in Balsamiq’s history, and it started with a designer who could prototype the future rather than just talk about or wireframe it.
Previous Case Study
← Design LeadershipNext Case Study
Building an AI-Powered Design Product from Scratch →