P
🎨CreativiteIntermediateGemini

Gemini Prompt for Creating Mockups

Gemini, Google's artificial intelligence model, offers remarkable capabilities for creating mockups thanks to its multimodal understanding and image generation ability. Whether you're 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 accelerates 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.

Paste in your AI

Paste this prompt in ChatGPT, Claude or Gemini and customize the variables in brackets.

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 categories section with horizontally scrollable round icons, a list of product cards with image, title, star rating, delivery time, and price. Color palette: [MAIN_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 rendering ready for client presentation. Format: iPhone 15 Pro screen, appropriate resolution.

Personalize this prompt with Léa

Answer 3 questions and Léa tailors the prompt to your situation.

Why this prompt 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.

Use Cases

Creating Mockups

Variants

Expected Output

You will get an image representing a realistic mobile app screen with all requested interface components, arranged cohesively and professionally. The mockup will display clear visual hierarchy, identifiable interactive elements, and a rendering that can be used directly in a client presentation or specification document. Proportions, spacing, and font sizes will follow current mobile design standards.

Frequently Asked Questions

Can Gemini create mockups for web apps in addition to mobile apps?

Yes, Gemini can generate mockups for any type of interface: web apps, dashboards, e-commerce sites, landing pages, desktop software interfaces, and much more. You just need to adapt your prompt by specifying the screen format (e.g., 1920x1080 desktop screen), the layout type (sidebar + main content, grid, etc.), and web-specific components like horizontal navigation menus, breadcrumbs, or forms. For the best results on complex interfaces like dashboards, describe each section of the screen separately.

How do 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: 'Provide 3 different versions: a minimalist one, a colorful and playful one, and a sleek corporate one.' You can also run the same prompt multiple times to get different results, then iterate on the one that suits you best by requesting specific adjustments. Another approach is to change a key parameter between each generation — for example, switching the color palette or component style — to systematically compare the options.

Are the mockups generated by Gemini production-ready?

The mockups generated by Gemini are raster images, not editable vector files. They're perfect for the ideation phase, presentations, and concept validation, but they don't replace a professional design tool like Figma for final production. However, they are an excellent starting point: you can use them as a visual reference 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 visible specifications directly on the image.

Learn more

Check the full skill on Prompt Guide to master this technique from A to Z.

View on Prompt Guide

📬 Get new prompts every week

Join our newsletter and never miss a prompt.

Similar Prompts

🎨CreativiteAdvancedAll AIs

Evaluate Climate Impact on Architectural Design

Analyze climate impact on your architectural projects and integrate resilience strategies from the design phase.

247255
🎨CreativiteIntermediateAll AIs

Write Impactful Advertising Copy

Writes persuasive advertising copy by exploring multiple creative angles using the AIDA method.

278261
🎨CreativiteIntermediateAll AIs

Midjourney Prompt for Creating Mockups

Mockups have become an essential part of the creative process, whether to present a logo on packaging, visualize a website design on a screen, or stage a product in a realistic context. Midjourney revolutionizes this step by generating photorealistic mockups in seconds, without the need for complex PSD files or expensive stock images. Thanks to its advanced understanding of materials, lighting, and perspectives, Midjourney produces professional-quality staging that rivals studio photography. Whether you are a graphic designer presenting a visual identity to a client, an entrepreneur looking to visualize packaging before production, or a marketer creating visuals for a campaign, mastering mockup prompts will save you considerable time. The main challenge lies in the precision of the instructions: type of support, viewing angle, lighting, environment, and level of realism must be carefully described to obtain a usable result. This guide provides optimized and tested prompts for creating compelling mockups with Midjourney, from simple product previews to ultra-realistic renders worthy of a professional shoot.

00
🎨CreativiteIntermediateClaude

Claude Prompt for Creating YouTube Thumbnails

YouTube thumbnails are the first visual element viewers see before clicking on a video. An effective thumbnail can double or triple your click-through rate, making it one of the most powerful growth levers on the platform. Claude excels at thumbnail design thanks to its ability to generate precise visual descriptions, balanced compositions, and catchy text tailored to your niche. By using Claude as a creative assistant, you can quickly iterate on thumbnail concepts, get high-contrast color recommendations, structure visual hierarchy, and write short, emotionally impactful text. Whether you are a beginner creator or an established YouTuber, Claude helps you systematize your thumbnail creation process to produce visuals that are consistent with your brand, optimized for mobile, and designed to trigger the click. This guide provides ready-to-use prompts to turn Claude into a true art director for your YouTube thumbnails.

00