UX Design with AI: Does it Help or Hinder?

This article is part of our ongoing series on harnessing LLMs to deliver real-world value in product development. Through the Mission Control project, we aim to provide a transparent view of how AI accelerates high-performing product teams. My core strengths are in product management, leadership, and some engineering, but UX design has always been an area where I’ve relied on seasoned partners to turn vision into meaningful user experiences.

With Mission Control, I intentionally worked solo—a deliberate test of how much productivity could be achieved by leveraging an LLM as a dedicated UX design assistant.

The objective was clear: could AI efficiently bridge my expertise gap and deliver a production-ready design?

The AI Design Shootout: From Prompt to Prototype

Every product design project needs a solid foundation—the product requirements document (PRD). Generated with the support of ChatPRD, our PRD captured strategic statements on the core problem, solution, vision, high-level requirements, and essential features. This served as our single source of truth for what needed to be built.

With the requirements in place, I kicked off a “shootout” among leading AI tools. I fed the PRD into Claude, CoPilot, ChatGPT, and Figma’s AI-driven prototyping features, asking each to generate a visual concept for the Mission Control dashboard. This let me objectively compare how each platform translated complex product needs into coherent, actionable interfaces.

Iteration and Refinement: Finding the Winning Workflow

The initial concepts from each platform were starting points. Real progress began with focused, iterative cycles—review, critique, revised prompts, and new outputs. The differences in output quality and practical utility quickly became clear.

Through this process, I narrowed my toolkit to Claude and Figma.

Claude consistently generated mockups with visual impact and efficiency, aligning with the Mission Control audience and requirements. Its workflows made it possible to go from requirements to high-fidelity ideas quickly, without compromising on clarity.

Figma, meanwhile, was indispensable for structure and version control. While Claude drove creative output, Figma provided the rigor required to organize and manage design iterations. The resulting workflow was a two-step process:

1. Generate top-level visual concepts and mockups in Claude.
   
2. Organize, refine, and version those assets in Figma.
   

This “1-2 UXD” approach combined AI’s creative speed with the reliability and professionalism of a best-in-class design platform.

From Design to Code: The Implementation Challenge

With finalized designs in Figma, the next challenge was implementation: translating those designs into robust Dart/Flutter code for our front end. This is often a critical pain point, so I evaluated two main approaches.

• Use an automated exporter to turn Figma designs directly into Dart code. While this promises speed, the downside is often messy, unoptimized code that hampers scalability and maintenance.
  Work with VS Code Copilot, prompting it with targeted screen grabs of UI components from Figma. By generating code for each widget—cards, buttons, nav bars—individually, the result is far cleaner.
  
• Building out the UI widget by widget produced a scalable and well-structured codebase, aligning with Flutter best practices. Although more hands-on, this manual, AI-assisted approach set a high standard for implementation quality and long-term maintainability.

The Results: A 2–5x Gain in Design Efficiency

The final workflow took us from product requirements, through interactive mockups, to a production-ready front end. Leveraging LLMs as a UX design partner, I saw a 2–5x improvement in efficiency compared to tackling the process without AI support.

This system enabled me to deliver a user-centric design that fully supported the project’s objectives, despite not having formal UX training. Here, AI served as a true force multiplier, transforming product vision into validated design at speed.

Process Improvements for Next Time

Is this approach a “silver bullet” for UX design? Not quite. Mission Control was a time-boxed effort, so I was limited in how far I could refine process and tooling. That said, I see clear paths for optimization in future engagements:

• Explore more advanced automation and Figma-Futter integrations (e.g., FlutterFlow, Rocket, FlutterViz) to streamline the coding of individual frontend components.
  
• Bring experienced UX design professionals into the AI-augmented workflow. My productivity gains were limited by my own gaps. With expert oversight, I’d expect results closer to 5–20x improvements—truly transformative.
  
• Strengthen our Figma asset management with versioning tools and tighter integration into source control, enhancing team workflows and design traceability.
  

Conclusion: Expertise Defines the Exponential Gain

This experience reinforces what we see again and again: expertise shapes the ROI of LLM-powered product development. When applied in areas of deep knowledge—like product strategy or backend architecture—AI can enable exponential acceleration.

In UX design, where my experience is lighter, gains were significant but not game-changing. Relying more on the LLM meant more iterations and adjustments. While this isn’t “the blind leading the blind,” it underscores that AI is at its best when paired with capable human leadership. The more you bring to the table, the more powerful your results with AI will be.

Stay tuned: Post 5 spotlights the AI-accelerated approach we used for architectural design that helped shape our technology stack.