
How we are using AI to reshape the first mile of digital product design and development.
For all of the designers out there, or people who have been privy to a true design program, you will know that the most successful solutions are not born from a linear process. Ideas evolve as new insights emerge, and even the most structured methodologies rely on iteration, feedback, and adaptation. But in practice, time and resource constraints often force teams to formalize ideas early—locking into wireframes or flows before they’ve had a chance to explore the full range of possibilities.
We are now experiencing a paradigm shift, catalyzed by a new generation of AI-powered tools. These platforms make it possible to generate interactive prototypes from simple prompts, helping teams test rough ideas before they're polished and engage stakeholders earlier in the process. Call it what you will…vibe coding, rapid prototyping, whatever new term will inevitably be coined for this process.
To explore the potential of these emerging AI design tools, we challenged ourselves to build a fully functional app for Foamcore, our in-house café and community lab. The goal: create a simple digital experience where team members could order coffee, browse company swag, and send Slack notifications for orders in real-time—all wrapped in a brand-forward UI. The twist? We gave ourselves just three days to go from idea to working prototype, relying on AI to accelerate the build without cutting corners.
As part of this sprint,we put six leading AI-powered prototyping tools to the test:
Replit, Lovable, Anima, Builder.io, Cursor, and V0.dev.
Here’s what we found:
Best for: Developers who want to co-pilot with AI in building functional apps fast.
Replit works like an AI-powered Integrated development environment (IDE). You can describe a product idea and watch the tool generate a working React-based app complete with screens, forms, and logic. We loved the speed and the live preview—but hit limits when we tried to integrate Figma assets or enforce consistent styling.
Pros:
Cons:
Best for: Small speculative prototypes with a polished visual look.
Lovable sits in the conversational AI category that emphasizes visual quality. Its results were some of the more aesthetically refined we saw—clean layouts, modern design components, and responsive elements. It also supports Figma imports through Builder.io but with some setup friction.
Pros:
Cons:
Best for: Designers handing off visual mockups to engineers.
Anima is laser-focused on one task: turning Figma screens into code. If your designs are ready to go, Anima generates HTML, React, or Vue components for quick front-end development. But it doesn’t support co-creation or conversational AI functionality—so it’s not helpful in the ideation or exploration phase.
Pros:
Cons:
Best for: Designers who want responsive layouts built from their Figma designs.
Builder.io impressed us with its Figma plugin—one of the best we tested. It translated screens into responsive, editable layouts quickly and with high fidelity. However, the integration with other tools (like Lovable) is still a bit clunky, and it’s unclear how scalable it is for larger projects.
Pros:
Cons:
Best for: Engineers who want to rapidly scaffold apps using natural language.
Cursor is an AI-enhanced code editor that supports multiple languages, including Swift and Python. It’s particularly useful when you’re working with platform-specific APIs (like Apple’s ARKit), and its conversational interface makes it easy to scaffold complex functionality. But it's not for the faint of heart—this is a tool built for people who already know how to code.
Pros:
Cons:
Best for: Conversational UX, Figma integration, code editing, and speed
V0 balances flexibility, usability, and fidelity. It combines conversational prompts with a visual editor and live code preview, making it approachable for designers but powerful enough for technical collaborators. For these reasons it became our main build environment.
Over three days, we built and iterated a fully functional coffee-ordering app with Slack integration, a branded UI, even a dynamic “swag shop” with rotating 3D sticker galleries. V0 handled complex back-and-forths like bug fixing, API connections, styling issues, and UI tweaks—albeit with some limitations (more on that below).
Pros:
Cons:
Of all the tools we tested, V0.dev hit the sweet spot for our specific needs: building a real, working prototype for a digital experience that reflected brand, logic, and UX nuance—all on a tight timeline.
V0 gave us:
It wasn’t perfect. Visual precision remains a pain point, and the back-and-forth to fix bugs and styling was time-consuming. But when in a generative phase—sketching with code instead of a pencil—V0 allowed us to build, test, and evolve ideas in ways that traditional workflows can't match.
What stood out most wasn’t just the tools—it was the shift in mindset they invited.
Instead of treating prototyping as a late-stage validation artifact, we used it as a participatory research method— rapidly co-creating with users, showing interactive ideas instead of static mockups, and gathering feedback rooted in real interactions. We didn’t need to perfect every pixel to start the conversation. And that, in itself, made our design process more human. So in full, the promise is real: with the right tools and approach, we can move faster, explore broader, and design with more imagination—starting from the very first prompt.
The pace of change is dizzying, and the question on everyone’s mind is: what’s next? What happens to the designer, the PM, the engineer? We won’t pretend to know the future—but here’s what we do know: deciding what to build, why it matters, and whether it’s any good is still a deeply human act. No matter how powerful AI gets, it can’t replace human instinct, taste, or judgment. Insight doesn’t come from scraping data—it comes from generative unexpected connections. The future belongs to those who don’t just analyze patterns, but who dream beyond them—connecting the dots in ways no algorithm can predict.