P

Gemini Prompt for Creating Mockups

Gemini, Google's artificial intelligence model, offers remarkable capabilities for creating mockups thanks to its multimodal understanding and ability to generate images. Whether you are a UI/UX designer, product manager, or developer, Gemini can help you quickly visualize your interface ideas without spending hours on Figma or Sketch. By crafting precise prompts, you can obtain mockups of mobile apps, websites, dashboards, or software interfaces in seconds. The major advantage lies in the ideation phase: instead of starting from a blank page, you can generate multiple mockup variations to explore different creative directions. Gemini understands modern design conventions — Material Design components, grid systems, typographic hierarchy — and can apply them consistently. This approach significantly speeds up the prototyping process, allowing you to test concepts with stakeholders before investing time in pixel-perfect design. The following prompts are optimized to get the most out of Gemini's visual generation capabilities in a professional mockup creation context.

The prompt

Gemini

Create a high-fidelity mockup for a mobile app for [APP_TYPE, e.g., food delivery]. The screen should represent [SPECIFIC SCREEN, e.g., the home page]. Visual style: modern and clean design, inspired by Material Design 3. Include the following elements: a bottom navigation bar with 4 tabs (Home, Search, Orders, Profile), a top search bar with icon and placeholder, a horizontally scrollable categories section with round icons, and a list of product cards with image, title, star rating, delivery time, and price. Color palette: [PRIMARY COLOR] as accent color, white background, dark gray text. Readable and hierarchical typography. The mockup should look like a realistic screenshot of a real app, with a professional render ready to be presented to a client. Format: iPhone 15 Pro screen, appropriate resolution.

Personalize this prompt with Léa

Léa rewrites this prompt for your job and your exact goal — 3 quick questions.

Why it works

This prompt works because of its extremely detailed structure that leaves no ambiguity about the expected result. By specifying each interface component (navigation bar, cards, categories), the model receives a complete creative brief comparable to what a designer would receive. The explicit mention of visual style, color palette, and target screen format allows Gemini to anchor its generation in real, professional design conventions.

Expected result

You will obtain an image representing a realistic mobile app screen with all requested interface components, arranged in a coherent and professional manner. The mockup will feature a clear visual hierarchy, identifiable interactive elements, and a render that can be used directly in a client presentation or specification document. Proportions, spacing, and font sizes will respect current mobile design standards.

Variants by level

FAQ

Can Gemini create mockups for web applications in addition to mobile apps?
Yes, Gemini can generate mockups for any type of interface: web applications, dashboards, e-commerce sites, landing pages, desktop software interfaces, and more. Just adapt your prompt by specifying the screen format (e.g., desktop screen 1920x1080), the type of layout (sidebar + main content, grid, etc.), and web-specific components like horizontal navigation menus, breadcrumbs, or forms. For best results with complex interfaces like dashboards, describe each section of the screen separately.
How can I get multiple variations of the same mockup with Gemini?
To explore different creative directions, you can explicitly ask Gemini to generate variations by adding to your prompt: 'Propose 3 different versions: a minimalist version, a colorful and playful version, and a corporate and sober version.' You can also rerun the same prompt several times to get different results, then iterate on the one you like best by requesting specific adjustments. Another approach is to modify a key parameter between each generation — for example, change the color palette or component style — to systematically compare options.
Are Gemini-generated mockups directly usable in production?
Mockups generated by Gemini are raster images, not editable vector files. They are perfect for the ideation phase, presentations, and concept validation, but do not replace a professional design tool like Figma for final production. However, they serve as an excellent starting point: you can use them as visual references to recreate the interface in your usual design tool, integrate them into clickable wireframes with prototyping tools, or present them to developers as a visual guide. To maximize their usefulness, request mockups with annotations or specifications visible directly on the image.

Related prompts

How to use this prompt

  1. Copy the prompt with the button above.
  2. Paste it into ChatGPT, Claude or your favorite AI assistant.
  3. Replace the bracketed variables with your details, then refine the result.

About Prompt Guide

Prompt Guide is a free library of 4800+ ready-to-use prompts for ChatGPT, Claude and other AIs, with guides to learn prompting and tools to build and optimize your own prompts.

More prompts to explore

Gemini Prompt for Creating YouTube Thumbnails

YouTube thumbnails are the first visual element that captures viewers' attention in their recommendation feed. A striking thumbnail can mul

Gemini Prompt for Data Analysis

Data analysis has become a fundamental pillar of decision-making in all business sectors. Whether you are a data analyst, project manager, entrepreneur, or researcher, the ability to extract relevant insights from raw datasets represents a major competitive advantage. Google Gemini, with its advanced contextual understanding and ability to process large volumes of structured and unstructured information, positions itself as a particularly powerful analytical assistant. By formulating precise and structured prompts, you can ask Gemini to identify trends, detect anomalies, calculate key metrics, segment your data, and produce actionable summaries. The challenge is no longer simply access to data, but knowing how to ask the right questions to extract value from it. This guide offers an optimized prompt to transform Gemini into a true analytical partner, capable of supporting you from initial exploration to formulating strategic recommendations based on data.

Gemini Prompt for Extracting Data Insights

Extracting insights from raw data is one of the major challenges facing analysts, data scientists, and decision-makers. Gemini, thanks to its

Gemini Prompt for Summarizing a Document

Summarizing a long document is one of the tasks where Gemini excels thanks to its massive context window that can handle up to 1 million tokens. Whether you have...

Gemini Prompt for Writing a Blog Post

Gemini, Google's artificial intelligence model, excels at writing long, structured content thanks to its ability to handle extended contexts and produce fluent text in French. To write an effective blog post, it's not enough to just say "write me an article": a well-constructed prompt must specify the topic, tone, expected structure, target audience, and editorial intent. By providing these elements to Gemini, you get a usable first draft that follows SEO best practices, captures attention from the introduction, and guides the reader to the conclusion. This guide offers one main optimized prompt and three variants tailored to your level of expertise, transforming Gemini into a real writing assistant. Whether you're a beginner blogger looking to publish regularly or an experienced content creator aiming for top rankings, these prompts will save you considerable time while maintaining a high level of quality.

Gemini Prompt for Writing a Business Proposal

Writing a compelling business proposal is a strategic exercise that requires combining a strong argument, clear structure, and personalization.

Go further

Get new prompts every week

Join our newsletter.