Live Stream App UI Mockup

Original document

GPT Image 2 · en

{
  "type": "Side-by-side mobile UI models",
  "theme": "{argument name=\"app style\" default=\"China Mobile Live Streaming App\"}",
  "panels": [
    {
      "position": "Left side",
      "subject": "{argument name=\"streamer appearance\" default=\"Young Asian woman, beautiful, smiling.\"} Long, wavy hair, holding a handwritten sign.",
      "sign_content": "{argument name=\"sign text\" default=\"Thanks for the big rocket, Ray!\"} Featuring small rockets and heart-shaped graffiti",
      "ui_elements": {
        "top_bar": "Personal profile information, follow button, 3 viewer avatars,{argument name=\"viewer count\" default=\"100,000+\"} Number of viewers, close button",
        "overlays": "Popularity ranking badges, gift bar widgets, display{argument name=\"gift name\" default=\"Big Rocket\"} The floating gift animation of x1",
        "chat_stream": "7 different chat message bubbles",
        "bottom_bar": "Text input box, 4 operation icons, floating like heart"
      }
    },
    {
      "position": "right side",
      "subject": "The same streamer, with her hair in a high ponytail and a hair tie, was holding a handwritten sign.",
      "sign_content": "{argument name=\"sign text\" default=\"Thanks for the big rocket, Ray!\"} It features graffiti with stars, hearts, and rockets.",
      "ui_elements": {
        "top_bar": "App Logo, LIVE Badge, 126,000 Viewers, Profile Information, Follow Button",
        "overlays": "Hourly ranking badge, gift goal widget, and two floating gift animations (1 rocket and 10 roses).",
        "chat_stream": "6 different chat message bubbles",
        "bottom_bar": "Text input box, 4 operation icons, follow button, floating like heart."
      }
    }
  ]
}

How to use

1. Copy the complete original prompt, including any parameters.
2. Replace the subject, text and composition with your own requirements.
3. Use a compatible external tool; check its current access conditions and review the result.

Before you start

• Check whether a reference image is required. A compatible model label does not mean this example was generated with that model.
• Keep names, figures and visible text accurate; results can vary between model versions.