gstack /design-shotgun实战4-6个AI设计变体浏览器对比板品味记忆让AI设计迭代闭环跑起来【免费下载链接】gstackUse Garry Tans exact Claude Code setup: 23 opinionated tools that serve as CEO, Designer, Eng Manager, Release Manager, Doc Engineer, and QA项目地址: https://gitcode.com/GitHub_Trending/gs/gstackgstack 是 YC CEO Garry Tan 开源的 Claude Code 技能包把 AI 变成一支虚拟工程团队。其中/design-shotgun是设计探索技能一次生成 4-6 个风格迥异的 AI 设计变体在浏览器对比板上打分挑选并靠品味记忆持续迭代——你越用它越懂你的审美。核心能力说明 4-6 个 AI 设计变体并行生成方向互不雷同️ 浏览器对比板打分、评论、Remix结构化反馈 品味记忆跨会话记住你的偏好偏好按周衰减它是 gstack 中 23 个专家角色之一扮演Design Explorer设计探索者。无论你是独立开发者、设计师还是产品经理都能用它快速把我不知道该长什么样变成就这个。为什么是 4-6 个变体而不是一个向 AI 描述一个界面通常只能收到一个答案。问题不在 AI 不够努力而在没有参照系你说不清自己到底喜欢什么只能反复改提示词碰运气。这是典型的用文字描述视觉的信息损耗。/design-shotgun的解法是把 AI 当成一个批量出方案的设计团队每个变体是一个明确的设计方向不是微调你在真实图片上选择品味从你的批准动作中自动沉淀。这就是它名字里shotgun霰弹枪的含义——撒出去看哪颗子弹上靶。完整循环 6 步步骤做什么1️⃣ 收集上下文读 DESIGN.md、扫项目结构、读最近设计文档2️⃣ 读取品味记忆用你的历史偏好给生成加偏置3️⃣ 并行生成 4-6 个变体每个方向必须字体、配色、布局全不同4️⃣ 打开浏览器对比板打分、评论、Remix5️⃣ 按反馈迭代同一标签页热刷新直到你点 Submit6️⃣ 保存批准结果approved.json存档可衔接 /design-html第一步30秒装好 gstack先装 gstack然后在 Claude Code 里输入/design-shotgun加一句需求即可例如/design-shotgun — 开发者工具落地页的 hero 区域安装方式详见项目 README 的 Quick start 章节在 Claude Code 中粘贴一段安装指令由 Claude 自动完成 clone 与 setup。第一步细节AI 先摸清你的上下文最多问两轮技能定义见 design-shotgun/SKILL.md。启动后 AI 会自动读取项目根部的DESIGN.md——如果存在默认按你的设计系统约束生成除非你明说要放飞扫描src/、app/、components/等目录了解已有组件和模式调取最近的 office-hours 设计文档理解产品背景然后用一个问题补齐缺失信息面向谁、这一屏完成什么任务、要几个变体默认 3 个、上限 8 个4-6 个是重点屏幕的推荐档位。规则很克制最多两轮提问拿不到就带着假设往下走绝不审问。品味记忆越用越懂你偏好还会保鲜这是/design-shotgun最有粘性的部分。每个项目有一份持久品味档案~/.gstack/projects/$SLUG/taste-profile.json按字体、配色、布局、美学风格四个维度记录你批准和拒绝过的设计并带置信度分数。关键机制置信度按周衰减 5%——半年前你选过的字体权重已远低于上周的选择。偏好不会僵化冲突会主动提示——你的档案强烈偏好极简这次却想要活泼一点AI 会问这是一次性需求还是更新品味档案每次批准调用gstack-taste-update approved拒绝调用rejected自动写入档案效果第 3 轮迭代它记得你上个月喜欢哪个变体。你不再需要反复解释我不要渐变留白多一点。生成阶段反收敛指令 并行出图先出 N 个文字概念每个方向一句话描述确认后再生成避免浪费 API 额度。这里有一条硬性的反收敛要求每个变体必须使用不同的字体族、配色方案和布局方式。检验标准如果能把两个方案的标题互换而你察觉不到它们就太像了——较弱的那个直接重新生成。变体应该像来自三个不同的设计团队而不是同一团队在三种咖啡摄入水平下的产出原文如此 。生成阶段由多个子代理并行调用 GPT Image 接口单个失败不影响其他遇到 429 限流自动指数退避重试2s → 4s → 8s单次超时 4 分钟。相关实现在 design/src/variants.ts内置了 7 种风格偏置更戏剧化的高对比、更留白的极简、更圆润的友好风、更克制的商务网格、深色主题、不对称的 playful 风等。浏览器对比板把我比较喜欢这个感觉变成结构化反馈生成完成后AI 在终端内联展示全部变体同时启动本地 HTTP 服务在浏览器打开对比板。页面把图片内嵌成 base64完全自包含实现见 design/src/compare.ts。每个方案卡片提供✅Pick——单选你偏好的方向⭐五星评分——A: 4 / B: 3 / C: 2 这类量化信号评论框——留白舒服、标题太弱More like this——多来点像 B 的️Remix——跨方案混搭比如布局用 A、配色用 B提交后反馈落成结构化 JSON偏好、评分、逐条评论、整体方向AI 先复述我理解的是……经你确认才把approved.json存档到~/.gstack/projects/$SLUG/designs/屏幕名-日期/。对比板服务是常驻 daemonURL 形如http://127.0.0.1:端口/boards/板ID/上午开的板下午还在同一天开第二块板各占独立 URL互不干扰也没有 10 分钟失效倒计时实现见 design/src/serve.ts。迭代循环Regenerate / Remix / More Like This点了 Regenerate 或 Remix反馈先写进feedback-pending.json技能按你的组合规格如{layout:A,colors:B}生成新一轮变体再通过热更新接口在同一标签页原地刷新循环往复直到你点 Submit。批准后的设计资产会写入项目档案方案、反馈、日期、当时分支一应俱全。下次再运行技能会列出历史记录让你选择回顾旧板 / 全新探索 / 换个方向。批准之后提取设计语言再交给 /design-html 变成代码想继续探索可运行视觉语言提取design/src/memory.ts用 GPT-4o 视觉从批准图中提取色板具体 hex 值、字体排版、间距规范、布局约定和整体气质自动写回DESIGN.md。之后所有设计工作都站在你的品牌语言上而不是每次都回到 Inter 灰。最后一步把approved.json交给/design-html把批准的 mockup 变成生产级 HTML/CSS——文本随视口真实重排、高度自适应内容而不是在一个屏幕尺寸上好看、换个尺寸就崩。完整链条shotgun 选方向 → design-html 变成可交付的页面常见问题 FAQQ变体数量可以自定义吗A可以默认 3 个上限 8 个重点屏幕建议 4-6 个。Q设计产物会污染我的项目目录吗A不会。所有 mockup、对比板、approved.json强制存放在~/.gstack/projects/$SLUG/designs/跨分支、跨会话保留永不进代码库。Q需要额外配置吗A需要 OpenAI API Key图像生成走 GPT Image。DESIGN.md 与品味档案都是可选增强没有也能跑。Q它和 /design-review 有什么区别Ashotgun 是探索给你选项design-review 是审计找问题并修复。一个在前一个在后。小结环节价值4-6 个变体用选项代替描述降低说不清想要什么的损耗浏览器对比板把模糊的喜欢变成可执行的评分与评论品味记忆偏好按周衰减、持续学习越用越准设计语言提取审美从会话资产沉淀为项目资产项目文件索引技能定义与流程design-shotgun/SKILL.md模板design-shotgun/SKILL.md.tmpl对比板生成与 HTML 实现design/src/compare.ts多风格变体并行生成、限流退避design/src/variants.ts视觉语言提取并写回 DESIGN.mddesign/src/memory.ts对比板常驻服务与热刷新接口design/src/serve.tsUX 行为原则用户如何真实使用界面design-shotgun/sections/doctrine.md对比板与反馈往返测试design/test/feedback-roundtrip.test.tsgstack 全技能深度解读docs/skills.md项目介绍与安装README.md版本演进日志CHANGELOG.md【免费下载链接】gstackUse Garry Tans exact Claude Code setup: 23 opinionated tools that serve as CEO, Designer, Eng Manager, Release Manager, Doc Engineer, and QA项目地址: https://gitcode.com/GitHub_Trending/gs/gstack创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
gstack /design-shotgun实战：4-6个AI设计变体+浏览器对比板+品味记忆，让AI设计迭代闭环跑起来
gstack /design-shotgun实战4-6个AI设计变体浏览器对比板品味记忆让AI设计迭代闭环跑起来【免费下载链接】gstackUse Garry Tans exact Claude Code setup: 23 opinionated tools that serve as CEO, Designer, Eng Manager, Release Manager, Doc Engineer, and QA项目地址: https://gitcode.com/GitHub_Trending/gs/gstackgstack 是 YC CEO Garry Tan 开源的 Claude Code 技能包把 AI 变成一支虚拟工程团队。其中/design-shotgun是设计探索技能一次生成 4-6 个风格迥异的 AI 设计变体在浏览器对比板上打分挑选并靠品味记忆持续迭代——你越用它越懂你的审美。核心能力说明 4-6 个 AI 设计变体并行生成方向互不雷同️ 浏览器对比板打分、评论、Remix结构化反馈 品味记忆跨会话记住你的偏好偏好按周衰减它是 gstack 中 23 个专家角色之一扮演Design Explorer设计探索者。无论你是独立开发者、设计师还是产品经理都能用它快速把我不知道该长什么样变成就这个。为什么是 4-6 个变体而不是一个向 AI 描述一个界面通常只能收到一个答案。问题不在 AI 不够努力而在没有参照系你说不清自己到底喜欢什么只能反复改提示词碰运气。这是典型的用文字描述视觉的信息损耗。/design-shotgun的解法是把 AI 当成一个批量出方案的设计团队每个变体是一个明确的设计方向不是微调你在真实图片上选择品味从你的批准动作中自动沉淀。这就是它名字里shotgun霰弹枪的含义——撒出去看哪颗子弹上靶。完整循环 6 步步骤做什么1️⃣ 收集上下文读 DESIGN.md、扫项目结构、读最近设计文档2️⃣ 读取品味记忆用你的历史偏好给生成加偏置3️⃣ 并行生成 4-6 个变体每个方向必须字体、配色、布局全不同4️⃣ 打开浏览器对比板打分、评论、Remix5️⃣ 按反馈迭代同一标签页热刷新直到你点 Submit6️⃣ 保存批准结果approved.json存档可衔接 /design-html第一步30秒装好 gstack先装 gstack然后在 Claude Code 里输入/design-shotgun加一句需求即可例如/design-shotgun — 开发者工具落地页的 hero 区域安装方式详见项目 README 的 Quick start 章节在 Claude Code 中粘贴一段安装指令由 Claude 自动完成 clone 与 setup。第一步细节AI 先摸清你的上下文最多问两轮技能定义见 design-shotgun/SKILL.md。启动后 AI 会自动读取项目根部的DESIGN.md——如果存在默认按你的设计系统约束生成除非你明说要放飞扫描src/、app/、components/等目录了解已有组件和模式调取最近的 office-hours 设计文档理解产品背景然后用一个问题补齐缺失信息面向谁、这一屏完成什么任务、要几个变体默认 3 个、上限 8 个4-6 个是重点屏幕的推荐档位。规则很克制最多两轮提问拿不到就带着假设往下走绝不审问。品味记忆越用越懂你偏好还会保鲜这是/design-shotgun最有粘性的部分。每个项目有一份持久品味档案~/.gstack/projects/$SLUG/taste-profile.json按字体、配色、布局、美学风格四个维度记录你批准和拒绝过的设计并带置信度分数。关键机制置信度按周衰减 5%——半年前你选过的字体权重已远低于上周的选择。偏好不会僵化冲突会主动提示——你的档案强烈偏好极简这次却想要活泼一点AI 会问这是一次性需求还是更新品味档案每次批准调用gstack-taste-update approved拒绝调用rejected自动写入档案效果第 3 轮迭代它记得你上个月喜欢哪个变体。你不再需要反复解释我不要渐变留白多一点。生成阶段反收敛指令 并行出图先出 N 个文字概念每个方向一句话描述确认后再生成避免浪费 API 额度。这里有一条硬性的反收敛要求每个变体必须使用不同的字体族、配色方案和布局方式。检验标准如果能把两个方案的标题互换而你察觉不到它们就太像了——较弱的那个直接重新生成。变体应该像来自三个不同的设计团队而不是同一团队在三种咖啡摄入水平下的产出原文如此 。生成阶段由多个子代理并行调用 GPT Image 接口单个失败不影响其他遇到 429 限流自动指数退避重试2s → 4s → 8s单次超时 4 分钟。相关实现在 design/src/variants.ts内置了 7 种风格偏置更戏剧化的高对比、更留白的极简、更圆润的友好风、更克制的商务网格、深色主题、不对称的 playful 风等。浏览器对比板把我比较喜欢这个感觉变成结构化反馈生成完成后AI 在终端内联展示全部变体同时启动本地 HTTP 服务在浏览器打开对比板。页面把图片内嵌成 base64完全自包含实现见 design/src/compare.ts。每个方案卡片提供✅Pick——单选你偏好的方向⭐五星评分——A: 4 / B: 3 / C: 2 这类量化信号评论框——留白舒服、标题太弱More like this——多来点像 B 的️Remix——跨方案混搭比如布局用 A、配色用 B提交后反馈落成结构化 JSON偏好、评分、逐条评论、整体方向AI 先复述我理解的是……经你确认才把approved.json存档到~/.gstack/projects/$SLUG/designs/屏幕名-日期/。对比板服务是常驻 daemonURL 形如http://127.0.0.1:端口/boards/板ID/上午开的板下午还在同一天开第二块板各占独立 URL互不干扰也没有 10 分钟失效倒计时实现见 design/src/serve.ts。迭代循环Regenerate / Remix / More Like This点了 Regenerate 或 Remix反馈先写进feedback-pending.json技能按你的组合规格如{layout:A,colors:B}生成新一轮变体再通过热更新接口在同一标签页原地刷新循环往复直到你点 Submit。批准后的设计资产会写入项目档案方案、反馈、日期、当时分支一应俱全。下次再运行技能会列出历史记录让你选择回顾旧板 / 全新探索 / 换个方向。批准之后提取设计语言再交给 /design-html 变成代码想继续探索可运行视觉语言提取design/src/memory.ts用 GPT-4o 视觉从批准图中提取色板具体 hex 值、字体排版、间距规范、布局约定和整体气质自动写回DESIGN.md。之后所有设计工作都站在你的品牌语言上而不是每次都回到 Inter 灰。最后一步把approved.json交给/design-html把批准的 mockup 变成生产级 HTML/CSS——文本随视口真实重排、高度自适应内容而不是在一个屏幕尺寸上好看、换个尺寸就崩。完整链条shotgun 选方向 → design-html 变成可交付的页面常见问题 FAQQ变体数量可以自定义吗A可以默认 3 个上限 8 个重点屏幕建议 4-6 个。Q设计产物会污染我的项目目录吗A不会。所有 mockup、对比板、approved.json强制存放在~/.gstack/projects/$SLUG/designs/跨分支、跨会话保留永不进代码库。Q需要额外配置吗A需要 OpenAI API Key图像生成走 GPT Image。DESIGN.md 与品味档案都是可选增强没有也能跑。Q它和 /design-review 有什么区别Ashotgun 是探索给你选项design-review 是审计找问题并修复。一个在前一个在后。小结环节价值4-6 个变体用选项代替描述降低说不清想要什么的损耗浏览器对比板把模糊的喜欢变成可执行的评分与评论品味记忆偏好按周衰减、持续学习越用越准设计语言提取审美从会话资产沉淀为项目资产项目文件索引技能定义与流程design-shotgun/SKILL.md模板design-shotgun/SKILL.md.tmpl对比板生成与 HTML 实现design/src/compare.ts多风格变体并行生成、限流退避design/src/variants.ts视觉语言提取并写回 DESIGN.mddesign/src/memory.ts对比板常驻服务与热刷新接口design/src/serve.tsUX 行为原则用户如何真实使用界面design-shotgun/sections/doctrine.md对比板与反馈往返测试design/test/feedback-roundtrip.test.tsgstack 全技能深度解读docs/skills.md项目介绍与安装README.md版本演进日志CHANGELOG.md【免费下载链接】gstackUse Garry Tans exact Claude Code setup: 23 opinionated tools that serve as CEO, Designer, Eng Manager, Release Manager, Doc Engineer, and QA项目地址: https://gitcode.com/GitHub_Trending/gs/gstack创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
