用途:根据线程 JSON 生成单帧 ChatGPT 移动端(iOS)浅色模式界面截图,用于广告素材、社交帖子、视频分镜和产品原型。仅输出静态单帧,若需动画视频请使用其他技能。
主要能力:支持状态栏时间与勿扰图标、三种头部样式(model-tag、title-only、plain-title)及右侧图标;消息类型包括用户文本气泡、用户图片附件、助手纯文本回复(可带标题与反馈按钮);助手文本支持有限 Markdown(粗体、斜体、标题、列表、分隔线、引用胶囊、内联图标);输入框支持占位符、已输入文本、光标、流式状态和 GPT chip。
使用方式:先编写符合 schema 的 thread.json,再运行 node render.js --thread examples/01-sunscreen-image.json。可选参数 --output 指定输出目录,--name 覆盖输出文件夹名。首次使用需执行 cd create-chatgpt-mockup、npm install、npx playwright install chromium。输出为带日期的文件夹,内含 index.html、screenshot.png(2250×4002 PNG)和 thread.json 副本。
适用场景:需要快速产出逼真 ChatGPT 手机界面静帧的营销、设计和演示场景。
限制:仅支持浅色模式;不支持轮播卡片、屏幕键盘;Markdown 功能有限,无表格、代码高亮和嵌套列表;emoji 渲染依赖系统字体;图片 src 需为本地相对路径,否则可能超时或显示破图。