ARTICLE DETAIL

资讯详情

深耕网站视觉设计与运营推广的一线实战洞察。

GPT-Image2 工业级提示词引擎:awesome-gpt-image-2 的 Prompt-as-Code 架构、案例画廊与 Agent Skill 实战指南

GPT-Image2 工业级提示词引擎:awesome-gpt-image-2 的 Prompt-as-Code 架构、案例画廊与 Agent Skill 实战指南 GPT-Image2 工业级提示词引擎awesome-gpt-image-2 的 Prompt-as-Code 架构、案例画廊与 Agent Skill 实战指南【免费下载链接】awesome-gpt-image-2Prompt as Code | GPT-Image2 工业级提示词引擎与模板库530 个案例逆向工程20 套工业级模板并提炼出Skills持续更新中项目地址: https://gitcode.com/GitHub_Trending/awe/awesome-gpt-image-2awesome-gpt-image-2 是一个面向 GPT-Image2 的Prompt as Code开源仓库它将 500 社区公开案例逆向工程为 13 大分类的案例画廊并提炼出 20 套可复用的工业级提示词模板最终沉淀为可供 Claude Code、Codex 等 Agent 直接调用的gpt-image-2-style-library技能包。本文以仓库中文 README 为主体脉络结合源码与配置深入讲解这套从散文式提示词到结构化协议的完整工程化体系读者可以据此掌握案例检索、模板填空、Agent Skill 安装与站点配置的完整工作流。项目定位为什么需要 Prompt as CodeGPT-Image2 全量开放后AI 画图的核心矛盾从能不能出图转变为能不能稳定、可控、可复用地出图。本项目的核心目标是把散文式提示词压缩成结构化协议——当需要批量出图、搭建模板系统、接入生产流程时结构化整理比单纯堆叠案例更有工程价值。围绕这一目标仓库确立了三条设计原则见 README.zh-CN.md原子化 Schema把主体、光影、材质、排版等视觉要素拆成可组合组件而非整段散文工作流友好面向 Agent、脚本和自动化系统设计而不是只给人肉复制结构化控制尽量提高版式、文案、信息层级的可控性降低随机抽卡成本。仓库配套的可视化站点 gpt-image2.canghe.ai 将这套资产产品化支持查看大图、复制完整 Prompt、按风格或场景筛选、登录后测试生成并可跳回 GitHub 源案例。站点预览图见上文。案例资产532 个案例的逆向工程画廊案例画廊是整套体系的事实来源source of truth完整存放在 docs/gallery.md考虑到 GitHub 渲染体积拆分为两册案例画廊 Part 1例 1-165案例画廊 Part 2例 166-532每个案例均按统一结构组织标题、来源如小红书号、提示词全文。以画廊开篇的例 1信息图可视化设计docs/gallery-part-1.md#case-1为例其提示词本身就是一份可复用的结构化样本Vertical 9:16 isometric cutaway infographic 城市生命系统图谱 / Urban Metabolism Atlas. Smart city from sky to bedrock: skyscrapers, streets, subway, utility tunnels, water/sewage/gas/heating pipes, fiber, data center, flood tanks, aquifers, geothermal wells, bedrock. Color-coded flows for power/water/data/traffic/waste. 12 numbered panels bilingual CN/EN: 能源/水循环/交通/数据/垃圾/建筑/公共服务/物流/气候韧性/生态/地质/治理看板. 24h timeline at bottom. Style: engineering white paper scientific atlas, light paper bg, crisp lines, 8K. No cyberpunk, no gibberish text, must show both above AND below ground.可以观察到这类高质量案例提示词的共同特征明确画幅9:16、明确视角isometric cutaway、逐项列出结构元素管道/地铁/数据中心等、锁定双语标签、指定风格engineering white paper scientific atlas并以 No cyberpunk, no gibberish text 这类负面约束收尾。这正是结构化协议取代散文式描述的典型示范。13 大分类体系全部案例按视觉类型划分为 13 个分类数据见 README.zh-CN.md 分类画册结构与 data/style-library.json 中的categories字段一一对应分类案例数典型内容UI 与界面73App、网页、仪表盘、社媒截图与产品界面图表与信息可视化52信息图、知识图谱、技术解释与结构化图解海报与排版86活动海报、封面、字体视觉和强排版画面商品与电商41商品图、详情页、包装卖点和商业广告品牌与标志27Logo、VI、品牌触点和 Campaign 视觉系统建筑与空间12建筑表现、室内空间、城市地图和空间概念摄影与写实77人像、手机纪实、胶片质感和商业摄影插画与艺术58插画、艺术风格、材质实验和装饰画面人物与角色29角色设定、动作参考、卡牌和 3D 玩具场景与叙事20分镜、故事场景、直播画面和世界观叙事历史与古风题材16古风长卷、历史人物、传统题材和诗词画面文档与出版物10白皮书、手册、百科图鉴和出版页设计其他应用场景28创意实验、特殊任务、混合玩法和实用场景工业级提示词模板21 套模板与防坑指南如果说画廊回答长什么样模板页则回答怎么稳定复现。仓库作者基于案例逆向工程提炼出21 套工业级提示词模板全部收录在 docs/templates.md每个分类均提供三种形态常规模板自然语言填空、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 模板双轨制贯穿全部 13 个分类是Prompt as Code的直接体现文本模板供人阅读填空JSON 模板供 Agent 或脚本读取生成。分类模板速览UI 与界面docs/templates.md#tpl-ui常规模板 截图生成模板指定 X/抖音/小红书等平台特征 直播界面模板带货/才艺直播 UI 差异核心是锁定平台、比例、布局和可见文字。图表与信息可视化docs/templates.md#tpl-infographic强调 3-5 个模块、模块间逻辑箭头/色块/连接线、图表类型与短文案附尺度缩放科学信息图专项模板。海报与排版docs/templates.md#tpl-poster覆盖运动商业 Campaign、概念字体海报中英双语版、水墨双重曝光人物海报、Apple 风格自然科普海报等专项模板。商品与电商docs/templates.md#tpl-product电商主图模板 个人化美妆推荐报告模板先分析肤色/气质/唇部基础再输出试色矩阵。品牌与标志docs/templates.md#tpl-brand完整品牌身份包模板战略基础 → Logo 概念 → 配色 → 字体 → 触点 → 品牌规则、品牌触点系统视觉板、品牌包络产品广告模板。建筑与空间docs/templates.md#tpl-architecture空间类型、风格、材质、动线、光线时间五要素。摄影与写实docs/templates.md#tpl-photo用f/1.4、50mm、Kodak Portra 400这类参数化摄影语言替代模糊的浅景深/半身照。插画与艺术docs/templates.md#tpl-illustration锁定笔触厚涂/水彩晕染提取大师特征而非直接写大师名。人物与角色docs/templates.md#tpl-character动作分解参考表4×4 网格 编号 角色一致性前置、参考图转 3D 收藏玩具模板。场景与叙事docs/templates.md#tpl-scene强调动词驱动事件、镜头语言Low angle shot / Dutch angle制造冲突。历史与古风题材docs/templates.md#tpl-history明确朝代 强制 No modern elements 排雷。文档与出版物docs/templates.md#tpl-document栏数、留白优先于风格词正文用 Simulated text blocks 占位只写死大标题。其他应用场景docs/templates.md#tpl-other概念产品研发拆解板模板通用场景要求主方案 备选方案的 A/B 输出。防坑指南中的共性经验纵览各分类的避坑清单可归纳出几条跨场景通用的工程经验先锁定结构性参数再谈风格平台、比例、布局、模块数量、栏数这类骨架参数必须前置否则模型会自由发挥排版。文字必须硬编码主标题、副标题、画面内中文一律写死并强调文字绝对可读否则极易出现乱码按钮与火星文。负面约束要具体No cyberpunk、No gibberish text、No modern elements、No moodboard这类显式排除项能大幅收敛输出空间。身份一致性前置动作序列、试色矩阵等需要多图一致性的任务必须把同一角色、同一服装、同一张脸写在动作列表之前。Agent Skillgpt-image-2-style-library 的架构与安装仓库的进阶形态是把上述模板库与风格库打包成标准 Agent Skill——gpt-image-2-style-library让 Claude Code、Codex、Cursor 等 Agent 能够用同一份风格库数据选择模板、分类、风格和场景标签。Skill 源码位于 agents/skills/gpt-image-2-style-library/SKILL.md。Skill 的工作流程从 SKILL.md 可以看到Skill 内定义了一套确定的匹配与生成流程检测用户语言并用该语言作答识别目标输出类型product、poster、UI、infographic、brand、photo、illustration、character、scene、history、document 或特殊任务按模板分类 → 视觉风格标签 → 场景标签 → 最近案例的优先级匹配请求若多个模板都成立给出 2-3 个候选并请用户选择按固定块结构组装最终 Prompt主体与任务、构图与版式、视觉风格与材质、文字与标签要求、画幅与输出格式、约束与负面细节输出中附带所选模板名称与参考案例 ID方便溯源。Skill 的详细索引由仓库自动生成位于 agents/skills/gpt-image-2-style-library/references/style-library.md其中每条模板条目都包含 ID、Category、Styles、Scenes、Tags、Cover、模板源锚点、示例案例以及中英双语的使用时机Use when、引导Guidance与避坑Pitfalls。SKILL.md 明确要求 Agent 在选模板前优先读取这份 reference 而非依赖记忆。一键安装方式方式一npx skills 安装推荐。为 Claude Code、Codex 指定安装npx skills add freestylefly/awesome-gpt-image-2 --skill gpt-image-2-style-library --agent claude-code codex --global --yes --copy或安装到所有支持的本地 Agentnpx skills add freestylefly/awesome-gpt-image-2 --global --all --copy方式二Claude Code 插件市场。在 Claude Code 会话中依次执行/plugin marketplace add freestylefly/awesome-gpt-image-2 /plugin install gpt-image-2-style-libraryawesome-gpt-image-2方式三npm CLI。全局安装后同步到本地技能目录npm install -g gpt-image-2-style-library gpt-image-2-style-library install all也可以不全局安装直接运行npx gpt-image-2-style-library install all若需从 GitHub Packages 安装npm 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 和 Claude Code 常用的本地技能目录~/.codex/skills、~/.claude/skills、~/.agents/skills安装后需重启 Agent 会话。这一行为在源码 scripts/install-style-skill.mjs 中有直接印证脚本从agents/skills/gpt-image-2-style-library复制技能到CODEX_HOME/CLAUDE_HOME/AGENTS_HOME默认回退到~/.codex、~/.claude、~/.agents下的skills目录并支持all、codex、claude-code、agents等目标别名。安装完成后直接向 Agent 发起自然语言请求即可例如使用 gpt-image-2-style-library 技能帮我生成介绍 Codex 的信息图本地源码开发与数据管道若要在本地从源码构建与安装 Skill仓库提供了两条 npm 脚本见 package.jsonnpm run generate:style-skill npm run install:skillgenerate:style-skill对应 scripts/generate-style-skill.mjs其作用是从单一数据源data/style-library.json渲染生成references/style-library.md。值得关注的是脚本内置的多重校验逻辑这保证了Prompt as Code资产的可靠性锚点校验每个模板的anchor必须真实存在于 docs/templates.md 的a name.../a锚点中防止文档与索引脱节封面校验每个模板与分类的cover图片必须存在且不重复缺失即抛错唯一性校验templates / categories / styles / scenes 的value与模板id均不允许重复文案风格校验reference 文案中禁止出现不是……而是……这类中文对比句式保证生成文档的一致性。而install:skill对应 scripts/install-style-skill.mjs即前文所述写入各 Agent 技能目录的安装逻辑。从 data/style-library.json 的结构可以看到这份单一数据源聚合了version、templateDocument指向docs/templates.md、tagLabels中英双语标签、categories分类含 id/value/anchor/templateAnchor/cover/中英标题与描述等字段网站与 Agent 工作流共用同一份风格库数据从而保证网站看到什么Agent 就推荐什么。可视化网站登录、生成测试与支付体系配置站点提供登录后生成测试图能力技术栈为Supabase Auth Supabase Postgres Vercel Function 代理 GPT Image 2 API并接入 Stripe 会员/积分计费、支付宝网站支付、GA4 分析与付费交流群。自托管部署时需要在 Vercel 配置以下环境变量完整清单见 README.zh-CN.mdVITE_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数据库迁移清单仓库在 supabase/migrations 下按功能拆分了迁移脚本需要按需依次应用202605090001_user_credits.sql用户积分表202605090002_auth_policy_lints.sql认证策略20260509090000_membership_billing.sql会员套餐、积分包、Stripe 订单记录与积分调整 RPC20260509091500_membership_plan_index.sql会员套餐索引20260512090000_google_account_center.sql账户用量统计与超级管理员强制扣积分20260512143000_pricing_admin_metrics.sql$5 / 300 credits价格体系与管理员数据看板指标20260513095141_admin_metrics_charts.sql看板图表20260515090000_case_favorites.sql用户案例收藏表20260528090000_watcha_oauth_accounts.sql第三方 OAuth 账号20260721090000_alipay_webpay.sql支付宝网站支付启用前需为积分包配置经业务确认的人民币价格详见 docs/alipay-web-payment.md20260722090000_paid_community.sql付费交流群在新群码、支付宝签约与退款验收完成前保持COMMUNITY_PAYMENT_ENABLEDfalse详见 docs/paid-community.md。平台配置要点在 Supabase Auth Redirect URLs 中加入https://gpt-image2.canghe.ai以及http://127.0.0.1:5173等本地开发地址在 Supabase Dashboard 填入 Google OAuth 凭据并启用 Google Provider如需强制 Google 登录可在 Auth settings 关闭 Email ProviderSUPABASE_SERVICE_ROLE_KEY、STRIPE_SECRET_KEY、STRIPE_WEBHOOK_SECRET只放在 Vercel Environment Variables 这类服务端环境中绝不暴露到前端配置 Stripe Checkout Webhook 为https://gpt-image2.canghe.ai/api/billing/webhook订阅checkout.session.completed、invoice.payment_succeeded、customer.subscription.updated、customer.subscription.deleted四个事件GA4为域名创建 property把 measurement ID 填入VITE_GA_MEASUREMENT_ID数字版 property ID 填入GA4_PROPERTY_ID创建 Google OAuth Web ClientAuthorized redirect URI 为http://localhost:8080/oauth2callback将 Client ID/Secret 写入本地.env.local然后运行npm run ga4:oauth完成授权并获取GOOGLE_ANALYTICS_REFRESH_TOKEN。前端与 API 层同样可以在仓库中找到实现站点前端入口为 src/main.jsxSupabase 客户端封装在 src/supabaseClient.js生成图接口为 api/generate-image.js积分与计费逻辑位于 api/_lib 与 api/billing。本地开发时执行npm run dev启动 Vitepredev会自动先执行数据与 Skill 的生成脚本支付宝沙箱调试可运行npm run dev:alipay-sandbox对应 scripts/alipay-webpay-sandbox-server.mjs单元测试通过npm test运行api/_lib/*.test.js。实战工作流怎么用这个库README 给出了简洁的三步使用法定类型先在精选案例里确定你要模仿的输出类型UI、信息图、海报……抄结构去完整画廊找相近案例抄结构而非只抄风格词——重点学习其画幅、模块、标签与负面约束的组织方式填变量回到模板页把你的业务变量填进常规模板或 JSON 模板。推荐起点包括 docs/gallery.md 的推荐入口例如例 1 信息图可视化设计docs/gallery-part-1.md#case-1、例 166 十二黄金圣斗士卡牌合集docs/gallery-part-2.md#case-166适合批量生成与系列化设计参考、例 310 零食品牌技术分解图docs/gallery-part-2.md#case-310信息图 品牌视觉混合参考、例 338《赤壁怀古》长卷图docs/gallery-part-2.md#case-338长卷尺寸与整篇文字排版参考等。声明与开源协议仓库所整理的提示词与示例图片均来自公开社区主要参考 YouMind 与 OpenNana 的公开提示词库仅用于学习、归纳与方法论研究项目不主张对第三方原创内容的任何所有权并尽最大努力保留原始来源。若权利人对某条内容有异议可在仓库发起 Issue 附上条目链接申请下架第三方内容不保证可用于商业用途商业使用前需自行取得原权利方授权。详细说明见 docs/disclaimer.md。项目采用 MIT License 开源可在保留许可声明的前提下自由使用、修改、分发与二次开发。【免费下载链接】awesome-gpt-image-2Prompt as Code | GPT-Image2 工业级提示词引擎与模板库530 个案例逆向工程20 套工业级模板并提炼出Skills持续更新中项目地址: https://gitcode.com/GitHub_Trending/awe/awesome-gpt-image-2创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表