Prompting UI: My Experience with AI Tools

Introduction

AI-powered UI tools like Figma and Motiff now let designers generate interfaces from simple text prompts, speeding up ideation and making design more accessible than ever.

For our final project in the Spring 2025 course Design Process for Learning Experience, taught by Professor Maaike, we experimented with Motiff to generate initial UI drafts during the brainstorming phase. It turned out to be a game-changer, helping us kickstart ideas quickly and significantly boosting our design efficiency.

My Experience: Using AI to Generate UI

Our final project was to design a treasure-hunting game app aimed at helping users improve their sense of direction. The game includes multiple levels, with GPS, notifications, and vibration features providing guidance early on. As players progress, these supports gradually fade, encouraging more independent navigation and spatial awareness.

Figure 1

Screenshot of the Motiff AI 1.0 plugin interface in Figma, highlighting features such as AI-generated UI, AI Layout, and the beta release of Motiff AI 2.0.

Figure 2

Screenshot of the “AI Generates UI” panel in the Motiff AI plugin, showing available styling presets for auto-generating user interfaces in Figma.

There are 5 steps of the Treasure Hunting Game

• Step 1: Onboarding Diagnosis

• Step 2: Online Learning Module

• Step 3: Treasure Hunting Challenge

• Step 4: Performance Review

• Step 5: Reflective Journal

To kick off our UI design brainstorming, we used Motiff AI to quickly generate rough interface ideas from simple text prompts. Motiff can generate two UIs based on one prompt. By describing key functions, user goals, and visual styles in plain language, we were able to get multiple layout variations within three minutes. This helped us explore different directions without starting from scratch or getting stuck in the blank-canvas stage. From there, we picked the most promising versions and customized them further, which saved time and sparked new ideas we might not have thought of on our own.

Writing Better Prompts: Lessons Learned

One thing I quickly realized when using AI tools like Motiff is that the quality of your prompt directly shapes the quality of the output. Vague instructions like “design a homepage” often returned generic layouts, while more detailed prompts, such as “design a playful onboarding screen for a GPS-based treasure hunting game with progress tracker and vibration cues,” led to more relevant and usable results.

I also found that breaking down the prompt into key elements, like function, style, user goal, and device, helped the tool generate clearer layouts. For example, including words like “mobile,” “beginner-friendly,” or “map-based navigation” provided important context for the AI to understand the design intent.

Tool Comparison: Figma AI vs. Motiff

Both Figma AI and Motiff now support generating UI from text prompts, but they each have unique strengths.

• Figma AI is great for both starting from scratch and refining designs within existing systems. Its integration with components makes it ideal for fast iteration and polishing. Additionally, both front-end and back-end code are provided.

• Motiff focuses more on early-stage ideation, offering diverse layout options and rapid draft generation. It's especially useful for brainstorming and visual exploration.

In our project, Motiff helped us kick off ideas quickly, while Figma AI was better for refining and aligning designs later on.

Pros & Cons of AI-Powered UI Design

• Pros:

  • Fast ideation: Great for getting unstuck and generating layout ideas quickly

  • Creative inspiration: Helps explore directions you might not think of

  • Time-saving: Reduces repetitive layout work during early-stage design

  
  

• Cons:

  • Generic outputs: Some designs felt templated or lacked personality

  • Limited control: Hard to enforce brand consistency or specific interaction details

  • Learning curve: Requires practice to write effective prompts and refine AI output

Overall, AI is a powerful assistant, but not yet a replacement for design thinking and human judgment.

Reflection & What’s Next

Using AI tools like Motiff really changed how I approach the early stages of UI design. It helped me move faster, iterate more freely, and focus my energy on higher-level decisions instead of getting stuck on layout basics.

That said, I’ve also learned to treat AI as a collaborator, not a final designer. Going forward, I want to keep experimenting with how AI fits into my workflow, especially as these tools get smarter. I’m also curious to explore how prompt design can become its own creative skill, much like wireframing or user flow mapping.

Figure 3

Overview screenshot of multiple UI design frames generated with the Motiff AI plugin in Figma, showcasing the complete flow of interface screens from login to results display.