# Teaching AI Prototyping: Lessons from the University Classroom

Shifting from static Figma mockups to dynamic AI-driven app development reveals critical design trade-offs.

- **Source:** [UX Collective - Medium](https://brifing.si/source/5c6bdc88-e150-4203-af43-069801e37dd9)
- **Published:** 2026-11-03
- **Topic:** [Product Management](https://brifing.si/c/product)
- **Original article:** <https://uxdesign.cc/what-i-learned-teaching-ai-prototyping-at-university-b9fff222625e?source=rss----138adf9c44c---4>
- **On Brifing:** https://brifing.si/s/04e042c6-5649-41df-b4fe-752d32380404

## The Shift to Vibe-Coding

Moving from static Figma mockups to AI-based tools like Google AI Studio and Lovable fundamentally changed the prototyping process. Students stopped building simple interconnected screens and began creating functional web applications. This transition allowed for complex logic and persistent storage, moving prototypes much closer to real, production-ready software products.

## The Illusion of Magic

Students often mistakenly assumed that AI prototyping tools possessed inherent intelligence. They expected features like image recognition or semantic search to function out of the box without additional setup. I had to clarify that these tools generate standard web apps, reinforcing the golden rule: fake the experience, don't over-engineer.

## Defining Product Vision

Generic prompts consistently led to disappointing, low-quality results. To overcome this, I required students to document their product vision before touching any AI tool. By detailing specific user actions and page sections, students gained the clarity needed to communicate their intent effectively, resulting in significantly faster and more accurate progress.

## Mental Model Misalignment

AI tools frequently generated outputs that contradicted the students' original intent. To bridge this gap, we utilized conceptual grammars to map objects, attributes, and relationships. This disciplined approach helped students translate their mental models into precise prompts, ensuring the AI understood the specific logic required for their unique, complex app concepts.

## Prompting as a Barrier

Initial confidence in prompting quickly turned into frustration when results failed to match expectations. Some students fell into the trap of endlessly refining prompts in LLMs like ChatGPT instead of evaluating the actual prototype. I had to intervene, reminding them that iteration must focus on the prototype's output, not just the prompt.

## The Power of Vocabulary

Using standard design terminology significantly improved AI output quality. Terms like modal dialog, accordion, and splash screen provided the precision necessary for the AI to understand interface structure. This confirms that technical literacy remains essential, as the internal currency of these generative tools is language, requiring precise definitions for consistent results.

## Language Bias in AI

Classes conducted in Madrid showed that prompts written in English consistently outperformed those in Spanish. This suggests an implicit bias in AI training data, which favors English-language resources. This creates a significant inclusive design challenge, as users of less-represented languages face a steeper barrier to achieving high-quality results with current tools.

## Targeted Element Refinement

Broad prompts often caused unintended changes across the entire application. I taught students to select specific on-screen elements—such as a single card or button—before prompting. This targeted approach minimized errors and reinforced the principle that clearer, narrower context leads to more predictable and accurate outcomes during the prototyping phase.

## Educational Pricing Barriers

The lack of academic pricing for tools like Lovable and Base44 created a major hurdle for student experimentation. University funding was denied due to unpredictable, credit-based costs. This highlights a systemic issue where current pricing models penalize the trial-and-error process, which is a fundamental component of effective design education.

## Vibe Coding Quality Assurance

AI prototyping introduced the need for regression testing, as modifying one feature often broke unrelated parts of the app. Students learned to perform broader reviews after every change and utilized version history to recover from catastrophic updates. This reality of vibe coding is currently a significant, frustrating challenge for developers.

## The Speed Paradox

Surprisingly, creating prototypes with AI tools took longer than using Figma. Because students were building functional applications rather than simple facades, the process required more decision-making, debugging, and testing. While the tools are fast, the complexity of the final output demands a deeper, more time-consuming engagement with the product's core logic.

## Risk of Designer Deskilling

While AI enabled students to build more ambitious apps, it reduced time spent practicing foundational UI skills like layout, spacing, and visual hierarchy. Relying on AI to handle these tasks may hinder the development of critical design thinking. Future education must balance AI-assisted productivity with the mastery of essential design principles.

## Sources covering this story

- https://uxdesign.cc/what-i-learned-teaching-ai-prototyping-at-university-b9fff222625e?source=rss----138adf9c44c---4 — 

---

_Summary written by Brifing from the original reporting. Copyright in the original article belongs to its publisher; read the full piece at the link above._
