AI Image Generator UI Mockup

AI Image Generator UI Mockup

Document original

GPT Image 2 · en

{
  "type": "UI/UX Web Application Prototype",
  "theme": "Dark mode",
  "sidebar": {
    "logo": "{argument name=\"app name\" default=\"ChatGPT\"}",
    "navigation_items": 5,
    "recent_chats_count": 8,
    "user_profile": "Users, Free Version"
  },
  "main_content": {
    "header": "image",
    "input_bar": {
      "placeholder": "{argument name=\"input placeholder\" default=\"Describe a new image...\"}",
      "model_selector": "{argument name=\"model name\" default=\"GPT Image 2\"}"
    },
    "sections": [
      {
        "title": "{argument name=\"hero title\" default=\"New feature: GPT Image 2 is now available!\"}",
        "description": "Our next-generation image models are designed to achieve greater realism, better typography, and deeper understanding of the world.",
        "feature_tags_count": 4,
        "hero_images_count": 3,
        "hero_images_descriptions": [
          "Mountain lake landscape",
          "Neon Cyberpunk Streets",
          "Poster layout"
        ]
      },
      {
        "title": "Apply styles to images",
        "style_thumbnails_count": 8,
        "style_labels": [
          "cartoon",
          "painting",
          "Cinematic",
          "3D rendering",
          "Line Art",
          "Pixel Art",
          "watercolor",
          "Cyberpunk"
        ]
      },
      {
        "title": "Explore new features",
        "feature_cards_count": 6,
        "feature_labels": [
          "Advanced text rendering",
          "Consistent roles and scenes",
          "Greater sense of realism",
          "World Knowledge",
          "Precise editing",
          "More creative styles"
        ]
      },
      {
        "title": "My Image",
        "recent_images_count": 6,
        "recent_images_descriptions": [
          "Anime boy portrait",
          "tabby kitten",
          "tabby kitten",
          "Sleeping Arctic fox",
          "Wedding Invitation",
          "Code editor terminal"
        ]
      }
    ]
  }
}

Mode d’emploi

  1. Copiez le prompt original complet, paramètres compris.
  2. Adaptez le sujet, le texte et la composition à vos besoins.
  3. Utilisez un outil externe compatible ; vérifiez l’accès et le résultat.

Avant de commencer

  • Vérifiez si une image de référence est nécessaire. La compatibilité ne prouve pas le modèle utilisé pour cet exemple.
  • Vérifiez noms, chiffres et textes ; les versions du modèle peuvent produire des résultats différents.

Exemples similaires

E-commerce Product Page Generator
GPT Image 2en

One{argument name="platform" default="Taobao"} of{argument name="robot model" default="T-800 robot"} The product details page displays the robot's front, side, and rear views, as well as product price, product details, features, and usage scenarios.

Live Stream App Screenshot Generator
GPT Image 2en

{ "type": "Screenshot of mobile live streaming app", "aspect_ratio": "9:16", "subject": { "description": "{argument name=\"subject description\" default=\"A beautiful young Asian woman with long black hair, wearing an off-the-shoulder white top.\"}", "action": "Smil

AI Image Generator Collage Failure Screenshot
GPT Image 2en

Goal: Create a dark-mode mobile chat screenshot showing an AI image generator response that incorrectly combines four requested images into one 2x2 collage. Canvas: Square screenshot, approximately 768×768 px, black background, cropped like a smartphone app interface in dark mod