提示词
gpt-image-2
YouTube 深色模式桌面端 UI 原型
生成一份高度详细、准确的 YouTube 桌面端首页深色模式原型，包含完整的侧边栏、筛选标签以及 12 个视频网格，并展示知名教育和娱乐频道的缩略图。
提示词
{ "type": "desktop UI mockup", "application": "YouTube homepage", "theme": "{argument name=\"theme\" default=\"dark mode\"}", "browser_window": { "url_bar": "{argument name=\"browser URL\" default=\"youtube.com\"}", "tabs": 1, "elements": ["back/forward buttons", "refresh", "extensions", "profile avatar"] }, "layout": { "sidebar": { "position": "left", "sections": [ { "title": "Main", "count": 3, "items": ["Home", "Shorts", "Subscriptions"] }, { "title": "You", "count": 6, "items": ["Your channel", "History", "Playlists", "Your videos", "Watch later", "Liked videos"] }, { "title": "Subscriptions", "count": 8, "items": ["Linus Tech Tips", "MrBeast", "Kurzgesagt - In a...", "ColdFusion", "3Blue1Brown", "Khan Academy", "Veritasium", "Show more"] }, { "title": "Explore", "count": 7, "items": ["Trending", "Music", "Films", "Live", "Gaming", "News", "Sport"] }, { "title": "More from YouTube", "count": 3, "items": ["YouTube Premium", "YouTube Music", "YouTube Kids"] } ] }, "top_filter_bar": { "count": 11, "labels": ["All", "Gaming", "Music", "Live", "Podcasts", "Mixes", "Science", "Lo-fi", "Thrillers", "Recently uploaded", "Watched"] }, "video_grid": { "layout": "4 rows by 3 columns", "count": 12, "videos": [ { "title": "Why Build Your Own GPU is Almost Impossible", "channel": "Linus Tech Tips", "thumbnail": "GPU chip with red arrow" }, { "title": "Survive 100 Days In Circle, Win $500,000", "channel": "MrBeast", "thumbnail": "MrBeast smiling with contestants in background" }, { "title": "What If We Nuke an Asteroid?", "channel": "Kurzgesagt - In a Nutshell", "thumbnail": "Missile approaching an asteroid in space" }, { "title": "How Dubai Became a $10 Billion City", "channel": "ColdFusion", "thumbnail": "Man next to Dubai skyline with text '$0 TO $10B'" }, { "title": "The Beautiful Math of Euler's Identity", "channel": "3Blue1Brown", "thumbnail": "Math equation and spiral graph on black background" }, { "title": "The World in 2040 - Population, Climate & More", "channel": "Veritasium", "thumbnail": "Lush green forest with text 'The World in 2040'" }, { "title": "I've Been Using Linux For 12 Years, This Is What Finally...", "channel": "DistroTube", "thumbnail": "Laptop and smartphone with a blue arrow connecting them" }, { "title": "Black Holes Explained - From Birth to Death", "channel": "Khan Academy", "thumbnail": "Glowing orange accretion disk of a black hole" }, { "title": "The Problem With Diet Advice", "channel": "Andrew Huberman", "thumbnail": "Man in black shirt with text 'the problem with diet advice'" }, { "title": "How to Learn Anything (Evidence-Based)", "channel": "Ali Abdaal", "thumbnail": "Flat illustration of a man reading a book surrounded by colorful leaves" }, { "title": "The Last of Us Part 2 is a Masterpiece", "channel": "Naughty Dog", "thumbnail": "Gritty portrait of Ellie with game logo" }, { "title": "lofi hip hop radio - beats to relax/study to", "channel": "Lofi Girl", "thumbnail": "Anime girl studying at a desk with city view at sunset" } ] } }, "os_environment": { "os": "{argument name=\"operating system\" default=\"Windows 10\"}", "taskbar_position": "bottom", "visible_icons": ["Start", "Search bar", "Task View", "File Explorer", "Edge", "Spotify"], "system_tray": ["network", "volume", "battery", "clock showing 08:34 03/04/2024"] } }
提示词结构
- 模型gpt-image-2
- 用途app-ui-mockup
- 风格editorial, anime, watercolor, luxury
- 画幅Flexible
适用场景
- 用途app-ui-mockup
- 风格editorial, anime, watercolor, luxury
- 推荐规格1:1, 4:5, 16:9, or 9:16
- 模型GPT Image 2
如何修改
把这个 YouTube 深色模式桌面端 UI 原型 提示词当作起点。替换主体、产品细节、场景、光线、品牌颜色和输出画幅，同时保留 app-ui-mockup 的用途和 editorial, anime, watercolor, luxury 的视觉方向。
可替换变量
- 主体替换成你的产品、人物、场景或界面对象。
- 用途保留或改写为 app ui mockup、广告图、封面、海报或电商主图。
- 画幅按投放位置选择 1:1、4:5、16:9 或 9:16。
- 品牌线索补充颜色、材质、道具、文案安全区和最终使用平台。
推荐规格
先按目标平台选择画幅，再根据用途选择 1K、2K 或 4K。产品图和海报通常适合更高清晰度。
生成前检查
- 检查主体、光线、构图和画幅都足够明确。
- 检查如果图片要承载标题或广告文案，已经预留文字安全区。
- 检查生成前确认分辨率、额度成本和最终使用位置。
为什么有效
YouTube 深色模式桌面端 UI 原型 的重点是先固定图片用途，再用主体、构图、光线、风格和画幅控制生成结果。它适合 app ui mockup，并保留 editorial, anime, watercolor, luxury 的视觉方向。
常见问题
- 能直接用吗？可以。先替换主体、品牌线索和画幅，再进入 Image2Studio 生成。
- 适合什么比例？按平台选择 1:1、4:5、16:9 或 9:16。
相关提示词
继续查看相似方向
UI Mockups
视频流媒体平台主页 UI
{ "type": "web browser UI mockup", "platform": "{argument name=\"platform name\" default=\"YouTube\"}", "browser_window": { "style": "macOS light mode", "tab": "YouTube", "url_bar": "youtube.com" }, "layout": { "header": { "components": ["hamburger menu", "platform logo", "search bar", "create video icon", "notifications bell", "user profile avatar"] }, "sidebar": { "position": "left", "item_count": 11, "sections": [ { "name": "Main", "items": ["Home", "Shorts", "Subscriptions", "Originals", "YouTube Music"] }, { "name": "Explore", "items": ["Trending", "Shopping", "Music", "Movies", "Live", "Gaming"] } ] }, "main_content": { "category_tags": { "count": 10, "labels": ["All", "Gaming", "Music", "Live", "Podcasts", "AI", "Cars", "Mixes", "News", "Recently uploaded"] }, "video_grid": { "card_count": 5, "cards": [ { "position": "top left", "size": "large", "thumbnail_description": "Sam Altman and Greg Brockman sitting on a stage next to a standing humanoid robot, text overlay 'OpenAI Introducing Our Humanoid Robot', LIVE badge", "video_title": "{argument name=\"featured live stream title\" default=\"Introducing Our Humanoid Robot\"}", "channel_name": "{argument name=\"featured live stream channel\" default=\"OpenAI\"}", "metadata": "482K watching now" }, { "position": "top right", "size": "large", "thumbnail_description": "surprised man's face on the left, a large mansion hidden in a forest with an explosion on the right, bold yellow text overlay '{argument name=\"top right thumbnail text\" default=\"TOTAL SECRECY\"}'", "video_title": "{argument name=\"top right video title\" default=\"I Bought 100 Million Dollar Secret House!\"}", "channel_name": "MrBeast", "metadata": "4.1M views, 19 hours ago, 20:49 duration" }, { "position": "bottom left", "size": "small", "thumbnail_description": "Steve Carell holding a laptop showing a scene from The Office", "video_title": "Steve Carell Breaks Down His Most Iconic Characters | GQ", "channel_name": "GQ", "metadata": "987K views, 2 days ago, 17:46 duration" }, { "position": "bottom middle", "size": "small", "thumbnail_description": "man looking through a spyglass at a sailing ship on the ocean at sunset", "video_title": "Black Sails Is Beautiful!", "channel_name": "Savage Books", "metadata": "606K views, 2 days ago, 17:46 duration" }, { "position": "bottom right", "size": "small", "thumbnail_description": "creepy masked killer character from a video game with text overlay 'DEAD OF DAYLIGHT'", "video_title": "Playing As The Seekers In Dead By Daylight", "channel_name": "Unknown", "metadata": "806K views, 1 day ago, 28:39 duration" } ] } } } }
摄影
日本新闻广播模拟
A photorealistic television news broadcast scene featuring a {argument name="anchor appearance" default="young Japanese female with shoulder-length dark hair wearing a light beige blouse"} and a small black lapel microphone, sitting at a news desk and speaking directly to the camera. The studio background is modern with blue and white lighting and a blurred nighttime city skyline on the right. In the top left corner, there is a dark blue graphic with the white text "{argument name="channel logo text" default="NEWS TODAY"}". To the anchor's left is a large presentation monitor displaying a news graphic with a white background and light blue network nodes. The monitor features a dark blue "最新情報" tag, the text "{argument name="subheadline" default="OpenAIの新しい画像生成モデル"}", a large prominent headline "{argument name="main headline" default="「GPT-image-2」"}", the text "がリリース", an OpenAI logo, and a dark blue bottom banner reading "より高精細に より正確に 画像生成の可能性がさらに広がる". Across the bottom of the entire screen is a news ticker lower third with a dark blue "速報" box and the scrolling text "{argument name="ticker text" default="OpenAI 画期的な新画像生成モデル「GPT-image-2」をリリース"}".
海报
AI 编程助手宣传信息图
{ "type": "app promotional infographic poster", "style": "clean, modern, glassmorphism, soft shadows, 3D icons", "theme": "{argument name=\"primary color theme\" default=\"blue and white\"}", "header": { "title": "{argument name=\"app name\" default=\"CodePilot\"}", "subtitle": "{argument name=\"subtitle\" default=\"你的 AI 编程副驾驶\"}", "features_list": "智能补全 · 代码生成 · 问答调试 · 代码解析", "main_icon": "glossy 3D rounded square, blue gradient, white {argument name=\"main icon symbol\" default=\"</>\"} and sparkles" }, "layout": { "sections": [ { "title": "feature_cards", "position": "middle grid", "count": 4, "items": [ { "label": "智能代码补全", "icon": "blue lightning bolt", "description": "上下文感知, 精准补全 让编码更快一步", "ui_element": "macOS style code window with Python calculate_total function" }, { "label": "AI 代码生成", "icon": "purple magic wand", "description": "根据自然语言描述 一键生成函数 & 脚本", "ui_element": "chat prompt bubble and code window with Python quick_sort function" }, { "label": "对话 & 调试助手", "icon": "green chat bubble", "description": "自然语言提问、定位 Bug 边聊边改, 高效解决问题", "ui_element": "chat interface with user question and green AI resolution bubble" }, { "label": "代码解析 & 注释", "icon": "orange document with magnifying glass", "description": "快速理解复杂代码 自动生成注释与说明", "ui_element": "code window with JS fetchData function and 3 floating action tags: 自动注释, 逻辑解析, 一键复制" } ] }, { "title": "为什么选择 CodePilot?", "position": "bottom left", "count": 4, "labels": ["提升效率", "精准可靠", "隐私安全", "易于集成"], "icons": ["clock", "checkmark", "shield", "puzzle piece"] }, { "title": "立即体验", "position": "bottom right", "count": 1, "elements": ["GitHub 开源项目", "{argument name=\"github link\" default=\"github.com/op7418/CodePilot\"}", "QR code"] } ] } }
UI Mockups
深色模式 AI API 定价页面模型
{ "type": "dark mode web page UI mockup", "theme": "sleek, modern, dark theme with white and light grey text", "header": { "logo": "{argument name=\"company name\" default=\"OpenAI\"}", "navigation": ["Research", "Products", "Safety", "Company"], "actions": ["Search icon", "Log in", "Try ChatGPT button"] }, "layout": { "left_column": { "label": "PRICING", "headline": "{argument name=\"model name\" default=\"GPT-8\"}", "subheading": "{argument name=\"main tagline\" default=\"Our most powerful model yet.\"}", "description": "GPT-8 is designed for intelligence, reliability, and real-world impact. Built with multimodal reasoning, long-context understanding, and advanced tool use.", "button": "GET STARTED", "features": { "count": 3, "items": [ {"icon": "brain", "title": "Frontier intelligence", "desc": "State-of-the-art reasoning, coding, and problem solving."}, {"icon": "shield", "title": "Trusted by design", "desc": "Stronger safety, more steerability, and enterprise-grade reliability."}, {"icon": "lightning bolt", "title": "Built for builders", "desc": "Native tool use, structured outputs, and long-context workflows."} ] } }, "right_column": { "type": "pricing card", "header": "PRICING - Simple, token-based pricing. No hidden fees.", "toggle": ["INPUT", "CACHE READ"], "token_pricing": { "count": 5, "rows": [ {"name": "Text tokens", "unit": "Per 1M tokens", "price": "{argument name=\"text token price\" default=\"$3.00\"}"}, {"name": "Image tokens", "unit": "Per 1M tokens", "price": "$10.00"}, {"name": "Audio tokens", "unit": "Per 1M tokens", "price": "$6.00"}, {"name": "Video tokens", "unit": "Per 1M tokens", "price": "$15.00"}, {"name": "Output tokens", "unit": "Per 1M tokens", "price": "{argument name=\"output token price\" default=\"$12.00\"}"} ] }, "additional_features": { "count": 2, "rows": [ {"name": "Caching", "desc": "Save on repeated inputs with caching.", "price": "$0.30 / 1M tokens"}, {"name": "Batch API (50% discount)", "desc": "Lower costs for asynchronous workloads.", "price": "-50%"} ] }, "footer_links": ["LEARN MORE", "Model docs", "Pricing details"] } }, "footer": "Prices are in USD. View the full pricing table in our docs." }
摄影
社交媒体视频 App UI 模型
{ "type": "social media short video app interface mockup", "main_image": { "subject": "{argument name=\"subject description\" default=\"young Asian woman with long dark hair wearing a white off-the-shoulder top\"}", "pose": "looking back over her shoulder at the camera, gentle smile, hair blowing slightly in the wind", "setting": "{argument name=\"background location\" default=\"riverside promenade at sunset with a tall modern tower and city skyline\"}", "lighting": "golden hour, warm sunlight reflecting on the river" }, "ui_layout": { "top_bar": { "status_icons": ["time 9:41", "cellular signal", "wifi", "battery 100"], "navigation": { "left": "menu icon", "center_tabs": ["经验", "团购", "关注", "{argument name=\"active top tab\" default=\"推荐\"}"], "right": "search icon" } }, "right_sidebar": { "count": 6, "elements": [ "profile picture with pink plus button", "heart icon with text '23.6万'", "chat bubble icon with text '1.6万'", "star icon with text '2.8万'", "share arrow icon with text '3.7万'", "spinning music record icon" ] }, "bottom_left_overlay": { "username": "{argument name=\"username\" default=\"@小鹿的日常\"}", "caption": "{argument name=\"caption text\" default=\"吹着晚风，看着日落，这一刻好治愈~ 🌅\"}", "audio_track": "🎵 原声 @小鹿的日常创作的原声" }, "bottom_navigation_bar": { "count": 5, "tabs": [ "首页", "朋友 (with red badge '2')", "central plus button in rounded square", "消息 (with red badge '5')", "我" ] } } }