Live Streaming App Interface Mockup

Back to inspiration

1 / 1

Live Streaming App Interface Mockup

Source: 伟豪学长AI

UI Designopenai/gpt-image-2#UI Design#UX Design#Interface#layout

Realistic mobile live stream UI overlay with host, chat, icons, and floating effects.

8.5wpeople using it

4:5Recommended size

4.5wSaves

Prompt template

{
  "type": "移动端直播 App 界面模型",
  "subject": {
    "description": "年轻亚裔女性，留着黑色长发，对着镜头微笑",
    "outfit": "{argument name=\"broadcaster outfit\" default=\"白色 V 领开衫\"}",
    "background": "温馨的房间，暖色调灯光，粉色花朵，粉色毛绒玩具"
  },
  "layout": {
    "top_bar": {
      "time": "20:32",
      "broadcaster": {
        "name": "{argument name=\"broadcaster name\" default=\"小鹿 🦌\"}",
        "stats": "12.8 万本场点赞"
      },
      "action_button": "关注",
      "viewers": {
        "avatar_count": 3,
        "total": "{argument name=\"viewer count\" default=\"1.2 万\"}"
      },
      "close_button": "X"
    },
    "floating_widgets": [
      "小时榜第 23 名",
      "更多直播 >",
      "礼物展馆 4/24"
    ],
    "chat_area": {
      "message_count": 4,
      "gift_alert": "加油鸭 送出人气票 x1",
      "messages": [
        "不吃香菜: {argument name=\"chat message 1\" default=\"主播唱歌真好听~\"}",
        "小透明: 来了来了",
        "晚风: 主播是哪里人呀",
        "晴天: 关注了主播"
      ]
    },
    "bottom_bar": {
      "input_placeholder": "{argument name=\"input placeholder\" default=\"说点什么...\"}",
      "icon_count": 5,
      "icons": [
        "笑脸",
        "链接符号",
        "带光环的心形",
        "礼盒",
        "三个点"
      ]
    },
    "overlay_effects": "右下角有 6 个彩色心形垂直飘动特效"
  }
}