ARTICLE DETAIL

建站实战干货

来自一线的建站与推广经验沉淀,每一条都经过真实交付验证。

awesome-gpt-image-2 全解:532 案例、21 套 GPT-Image2 提示词模板与 Agent Skill 落地路径

2026/9/17 19:27:34 拓冰建站 浏览量
awesome-gpt-image-2 全解:532 案例、21 套 GPT-Image2 提示词模板与 Agent Skill 落地路径 awesome-gpt-image-2 全解532 案例、21 套 GPT-Image2 提示词模板与 Agent Skill 落地路径【免费下载链接】awesome-gpt-image-2Prompt as Code | GPT Image 2 / 2.5 提示词与案例库530 个案例、20 套工业级模板与可复用 Skills新增 2.5 同提示词对比专区附完整提示词与生成记录持续更新。项目地址: https://gitcode.com/GitHub_Trending/awe/awesome-gpt-image-2awesome-gpt-image-2 解决的是让 GPT-Image2 出图稳定可复现的问题这个 Prompt as Code 仓库把 532 个逆向工程案例整理成结构化风格库提炼出 21 套 GPT-Image2 提示词模板并附带可安装的 Agent Skill。读完本文你能按分类在画廊里检索案例、用模板填空产出可控提示词并学会把风格库 Skill 装进本地 Agent。问题与解法这个仓库在解决什么GPT-Image2 普及之后真正的瓶颈不再是能不能出图而是三个更具体的痛点提示词不可复现同一段话换个措辞结果就不同好案例里的写法没有可对照的结构只能靠灵感抽卡不可批量做 10 张系列图时散文式提示词没有统一的变量位改一张要重写一遍风格容易漂移不可被 Agent 消费脚本和 Agent 无法解析画一张大气一点的图这种表述自然语言越写越像文学越写越没法进流水线。awesome-gpt-image-2 的解法是把散文式提示词压缩成结构化协议也就是 Prompt as Code提示词不再是一句话而是一份可以填充、校验、批量执行的资产。围绕这个思路仓库有三条设计取向把主体、光照、材质、版式、视觉细节拆成独立部件提示词像组件一样拼装替换局部而不必重写整体内容首先服务于脚本与 Agent 的读取和填充其次才服务于人类阅读用显式字段表达版式、文案与信息层级让文字写什么、图占多大、比例是多少都变成可校验的约束。由此仓库的阅读动线很清晰先用案例定方向再开模板落结构。资产全景一张表定位所有关键路径资产名称仓库内相对路径一句话说明完整案例画廊docs/gallery.md全量 532 个案例的总览入口按画廊分卷与分类索引画廊 Part 1docs/gallery-part-1.md案例 1–165含完整提示词与生成图画廊 Part 2docs/gallery-part-2.md案例 166–532作者原创测试与社区最新收录都在这里工业级模板页docs/templates.md21 套 GPT-Image2 提示词模板与各类目防坑指南Agent Skill 入口agents/skills/gpt-image-2-style-library/SKILL.md风格库 Skill 的工作流与输出约定风格数据源data/style-library.jsonWeb 站点与 Agent 共享的结构化风格知识库开源协议LICENSEMIT License免责声明全文docs/disclaimer.md内容溯源与版权说明仓库同时提供可视化站点 gpt-image2.canghe.ai把画廊做成了产品化体验大图预览、整段提示词一键复制、按风格与场景筛选、Google 登录后在线试生成并支持跳回源案例查看完整提示词与生成记录。案例画廊12 个分类与 532 个逆向样本如何组织画廊是整个仓库的地基按视觉方向划分的分类合计 532 个案例计数来自 README.md 的分类总览表每个案例都带完整提示词、生成图与来源标注。分类案例数典型覆盖场景UI 与界面73App、网页、仪表盘、社媒截图、产品界面图表与信息可视化52信息图、知识图谱、技术讲解、结构化图解海报与排版86活动海报、封面、文字视觉、强排版构图商品与电商41商品图、详情页、包装、卖点、广告品牌与标志27Logo、VI、品牌触点、Campaign 视觉建筑与空间12建筑表现、室内、城市地图、空间概念摄影与写实77人像、手机纪实、胶片质感、商业摄影插画与艺术58插画、艺术风格、材质实验、装饰画面人物与角色29角色设定、动作参考、卡牌、3D 玩具场景与叙事20分镜、故事场景、直播画面、世界观历史与古风题材16古风长卷、历史人物、传统题材、诗词画面文档与出版物10白皮书、手册、百科图鉴、出版页设计其他应用场景28创意实验、特殊任务、混合玩法、实用场景从 532 个样本里挑 5 个教科书级案例适合作为各方向的入门参照Case 1 信息图可视化案例页工程白皮书风格信息图适合学模块结构、信息层级与双语标签设计Case 2 社媒界面截图案例页产品 UI 社媒内容截图混合样本适合学文本块、UI 框架与内容卡片的同时控制Case 6 插画艺术案例页日系奇幻插画适合研究氛围、色彩与大场景构图Case 166 多卡批量生成案例页统一风格的卡牌组是研究批量生成与系列化设计一致性的典型样本Case 310 品牌技术分解图案例页品牌叙事 结构分解 商业展示的强组合适合信息图 品牌视觉双修参考。画廊的更新是双轨的作者苍何的原创测试如 Case 334 RAG 技术讲解图、Case 331 手绘西安水彩城市地图、Case 330 月光直播场景与社区最新收录Case 527–532都持续追加在 docs/gallery-part-2.md 末尾想追新直接看这一卷即可。模板体系把长什么样变成怎么稳定复现案例画廊回答长什么样docs/templates.md 回答怎么稳定复现它从 393 个案例中逆向提炼出21 套工业级提示词模板每套都带防坑指南直接复制填空。模板按 4 页组织锚点均可从模板页顶部跳转设计与信息UI 与界面#tpl-ui、图表与信息可视化#tpl-infographic、海报与排版#tpl-poster商业与空间商品与电商#tpl-product、品牌与标志#tpl-brand、建筑与空间#tpl-architecture影像与角色摄影与写实#tpl-photo、插画与艺术#tpl-illustration、人物与角色#tpl-character叙事与扩展场景与叙事#tpl-scene、历史与古风#tpl-history、文档与出版物#tpl-document、其他应用场景#tpl-other。每套模板通常提供三种形态常规模板自然语言、直接填空、JSON 进阶模板字段结构化、推荐给 Agent 调用、以及面向细分场景的专项模板如截图生成、直播界面、尺度缩放科学信息图。以 UI 与界面为例常规模板长这样为[产品类型]生成一张[平台如 iOS/Android/Web]界面图。 核心功能[功能点A]、[功能点B]、[功能点C]。 视觉风格[极简/科技/拟物]主色[颜色]强调色[颜色]。 布局[顶部导航/双栏/卡片流]信息层级清晰留白充足。 输出高保真UI截图文字清晰可读比例[9:16/16:9]。对应的 JSON 进阶模板把平台、布局、风格、内容卡片与约束全部变成键值对{ type: UI Screenshot, platform: iOS, product: Fitness App, layout: Card-based feed with bottom tab bar, style: { theme: Dark Mode, primary_color: Neon Green, typography: Clean sans-serif }, content: { header: Todays Activity, cards: [ {title: Running, data: 5.2 km, button: Start}, {title: Calories, data: 340 kcal} ] }, constraints: High fidelity, readable text, 9:16 aspect ratio }JSON 形态更适合 Agent 的原因在于程序可以逐字段读取和填充不需要解析自然语言批量生成时循环替换字段值即可保持结构恒定约束条件比例、文字可读性也能作为独立字段被校验和复用。防坑指南模板页里最有价值的是随模板附带的硬性约束以下四条来自 UI 模板的逆向经验几乎适用于所有界面类生成不要给模糊指令必须明确平台 比例 布局三者缺一模型就会自由发挥乱排版强制文字锁定要求文字绝对可读、必须显示指定的中文否则会出现乱码按钮与占位火星文截图区分平台特征X 有蓝勾认证、抖音有音乐碟片、小红书是双列瀑布流不指定平台模型就会混搭中空界面比例前置车机、智能家居等特殊屏如 21:9必须把比例写在提示词最前面否则默认输出手机 9:16。Agent Skill把风格库塞进 Claude Code / Codex / Cursor仓库内置的 Agent SkillGPT-Image2 Style Library让 Agent 直接复用 Web 站点的风格数据它的数据源是 data/style-library.json其中含 13 个分类、19 个视觉风格标签3D、Realistic、Illustration、UI 等附中英文关键词、10 个场景标签Tech、Commerce、Education、Travel 等以及 21 套模板的 ID、锚点、封面、适用场景 guidance 与 pitfalls。匹配工作流按层级收敛先识别用户的输出目标产品 / 海报 / UI / 信息图 / 品牌 / 摄影 / 插画 / 角色 / 场景 / 历史 / 文档 / 特殊任务再按模板分类 → 视觉风格标签 → 场景标签 → 邻近示例案例逐级匹配单个模板明显最优就直接使用候选较多时给出 2–3 个选项附理由让用户选。最终提示词固定按六大模块组装主体与任务、构图与版式、视觉风格与材质、文字与标签要求、宽高比与输出格式、约束与负面细节并附上所选模板名与示例案例 ID。上图就是请求城市生命系统图谱city-life-system-map时 Skill 的产出示例。安装方式一npx skills 快速安装推荐用于 Claude Code、Codex、Cursor 等支持 skills 生态的工具# 安装到指定 Agentclaude-code、codex npx skills add freestylefly/awesome-gpt-image-2 --skill gpt-image-2-style-library --agent claude-code codex --global --yes --copy # 安装到所有受支持的本地 Agent npx skills add freestylefly/awesome-gpt-image-2 --global --all --copy安装方式二Claude Code Plugin Marketplace在 Claude Code 内依次执行/plugin marketplace add freestylefly/awesome-gpt-image-2 /plugin install gpt-image-2-style-libraryawesome-gpt-image-2安装方式三npm CLI 与 GitHub Packages全局安装 CLI 后同步到本地 Agent 目录npm install -g gpt-image-2-style-library gpt-image-2-style-library install all不全局安装、直接用 npx 执行也可以npx gpt-image-2-style-library install all从 GitHub Packages 安装需先登录对应 registrynpm login --scopefreestylefly --registryhttps://npm.pkg.github.com npm install -g freestylefly/gpt-image-2-style-library --registryhttps://npm.pkg.github.com gpt-image-2-style-library install allinstall all会写入~/.codex/skills、~/.claude/skills、~/.agents/skills三个常用目录。源码侧的两件事如果想从源码开发或验证 Skill两个 npm script 值得注意均在 package.json 中注册参考文档是生成的scripts/generate-style-skill.mjsnpm run generate:style-skill会读取 data/style-library.json 与 docs/templates.md校验每个模板锚点在模板页中真实存在、封面图存在且不重复再渲染出 agents/skills/gpt-image-2-style-library/references/style-library.md。这保证了 Web 站点与 Agent 工作流共享唯一数据源风格库改动一处、两端同步安装目标是可配置的scripts/install-style-skill.mjsnpm run install:skill支持all、codex、claude-code、agents等目标别名可用CODEX_HOME、CLAUDE_HOME、AGENTS_HOME环境变量覆盖默认目录执行时先删除旧目录再整体拷贝源目录避免残留文件。安装完成后重启 Agent 会话然后用一句自然语言驱动即可例如使用 gpt-image-2-style-library 技能为介绍 Codex 写一篇信息图风格的 GPT-Image2 提示词。在线生成背后的产品化架构Supabase Vercel站点内置的登录试生成能力技术栈一句话概括Supabase Auth 负责登录、Supabase Postgres 存数据、Vercel Function 代理转发图像 APIVercel Function 是跑在云端的无服务器函数在这里充当密钥不落地、浏览器不直连模型 API 的中转层。环境变量部署到 Vercel 需要配置以下环境变量VITE_SUPABASE_URL VITE_SUPABASE_ANON_KEY SUPABASE_SERVICE_ROLE_KEY SUPER_ADMIN_EMAILS2689458656qq.com,canghe0818gmail.com CIYUAN_API_KEY CIYUAN_BASE_URLhttps://ciyuan.today APP_URLhttps://gpt-image2.canghe.ai STRIPE_SECRET_KEY STRIPE_WEBHOOK_SECRET VITE_GA_MEASUREMENT_ID GA4_PROPERTY_ID GOOGLE_ANALYTICS_CLIENT_ID GOOGLE_ANALYTICS_CLIENT_SECRET GOOGLE_ANALYTICS_REFRESH_TOKEN其中VITE_前缀的变量会随前端构建产物暴露给浏览器SUPABASE_SERVICE_ROLE_KEY、STRIPE_SECRET_KEY、STRIPE_WEBHOOK_SECRET、GOOGLE_ANALYTICS_REFRESH_TOKEN等敏感值必须只放在服务端环境。api/ 目录即按职责划分api/billing/webhook.js 处理 Stripe 回调api/generate-image.js 承担图像生成代理api/_lib/supabase.js 封装数据库访问。部署检查清单依次应用 5 个数据库迁移均在 supabase/migrations/ 下202605090001_user_credits.sql用户积分基础表→ 20260509090000_membership_billing.sql会员套餐、积分包、Stripe 订单与积分调整 RPC→ 20260512090000_google_account_center.sql账号汇总与超管强制扣费→ 20260512143000_pricing_admin_metrics.sql$5 / 300 credits 定价目录与管理指标→ 20260515090000_case_favorites.sql按用户维度的案例收藏在 Supabase Auth 的 Redirect URLs 中加入线上域名https://gpt-image2.canghe.ai与本地开发地址http://127.0.0.1:5173在 Supabase Dashboard 添加 Google OAuth 凭据并启用 Google Provider若要强制 Google 单点登录可禁用 Email Provider将 Stripe Checkout 的 Webhook URL 指向https://gpt-image2.canghe.ai/api/billing/webhook并订阅checkout.session.completed、invoice.payment_succeeded、customer.subscription.updated、customer.subscription.deleted四个事件为目标域名创建 GA4 媒体资源Measurement ID 填入VITE_GA_MEASUREMENT_ID数字型 Property ID 填入GA4_PROPERTY_ID创建 Google OAuth Web Client授权重定向 URI 填http://localhost:8080/oauth2callback将 Client ID 与 Secret 写入本地.env.local执行npm run ga4:oauth对应 scripts/google-analytics-oauth.mjs打开生成的授权 URL 授予analytics.readonly权限并把回调 URL 粘贴回终端将返回的GOOGLE_ANALYTICS_REFRESH_TOKEN作为 Sensitive 环境变量加入 Vercel。三步上手从打开仓库到产出第一张可控的图从精选案例定方向浏览 README.md 的 Featured Cases确定想模仿的输出类型信息图、社媒截图、插画、卡牌组……这一步只定做什么不纠结措辞在完整画廊找最近似样本打开 docs/gallery.md按分类定位与目标最接近的案例先照抄它的结构模块、层级、版式再调整风格与措辞回到模板页填空进入 docs/templates.md把业务变量填入常规模模板或 JSON 模板得到一份可复用、可批量、可交给 Agent 执行的提示词完成从灵感到批量生产的闭环。版权、溯源与使用边界仓库中的所有提示词案例与生成图像最初受公开社区资源启发主要参考 YouMind 与 OpenNana 的公开提示词库用于学习、总结与大模型 Agent 自动化测试项目尽力保留原作者信息与原帖链接第三方内容遵循源仓库声明如CC BY 4.0及相关平台规则并明确不保证第三方内容的商用可用性——商用前须取得原权利方授权完整说明见 docs/disclaimer.md。整个仓库以 MIT License 开源见 LICENSE在保留许可证声明的前提下可自由使用、修改与分发。【免费下载链接】awesome-gpt-image-2Prompt as Code | GPT Image 2 / 2.5 提示词与案例库530 个案例、20 套工业级模板与可复用 Skills新增 2.5 同提示词对比专区附完整提示词与生成记录持续更新。项目地址: https://gitcode.com/GitHub_Trending/awe/awesome-gpt-image-2创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考