@openprd/cli 0.1.11 → 0.1.19

package/.openprd/design/active/selected-direction.md

@@ -5,6 +5,8 @@
 - lens: 待填写
 - theme: 待填写
 - layout: 待填写
+- aesthetic: 待填写
+- memory-point: 待填写
 - components:
   - 待填写
 - follow-up risks:

package/.openprd/design/anti-slop.md

@@ -1,12 +1,31 @@
 # Anti-Slop
 
-## 禁区
+## 目标
+
+这份文件不是“审美偏好清单”，而是拦住通用 AI 页面味的实现前自检。
+每次界面任务都要先有具体审美主张，再用字体、色彩、动效、构图和素材把它执行出来。
+
+## 禁区：通用 AI 味
 
 - 三版候选都只是浅色留白加点缀色
 - 内容型页面没有真实图，只用大面积占位块
 - 工具型页面做成营销站
 - 页面里出现多个互相冲突的圆角、阴影和边框体系
 - 不核实事实就写产品页
+- 默认紫色/蓝紫渐变、玻璃卡、光晕背景、白底圆角卡片阵列，且没有品牌或参考图依据
+- 默认使用 Inter、Roboto、Arial 或 system-ui 作为审美选择；除非它服务于系统一致性、可访问性或高密度扫描
+- 三个方向共享同一个 hero、同一组卡片、同一个视觉重心，只换颜色、插图或按钮文案
+- 落地页总是“左侧大标题 + 右侧插图/截图 + 下方三卡片”
+- 用纹理、噪点、渐变、阴影或动效掩盖事实、素材、信息层级或任务路径缺失
+- 页面只有一个颜色家族的深浅变化，没有清晰的主次色、功能色和情绪色分工
+- 极简页面缺少精确排版、比例、边距和文本节奏；复杂页面缺少秩序、层级和可扫描路径
+- 所有页面都像同一个安全模板，没有与用户、场景、内容和品牌相关的记忆点
+
+## 允许例外
+
+- 用户、品牌规范、参考图或现有设计系统明确要求某种颜色、字体或布局时，以这些约束为准。
+- 工具型、企业型、合规型界面可以保持克制，但必须通过密度、对齐、状态、表格、控件和信息结构体现设计质量。
+- 中性字体可以用于正文和高密度 UI，但标题、数字、标签或关键模块仍应有明确角色分工。
 
 ## 优先替代
 
@@ -14,3 +33,9 @@
 - 用 theme lock 代替边写边试色
 - 用 layout skeleton 代替从空白页硬搭
 - 用真实内容资产代替装饰性占位
+- 用“用途 / 受众 / 气质 / 约束 / 记忆点”代替“现代、简洁、高级”
+- 用有角色分工的标题字体、正文字体、数字字体和标签样式代替单一通用字体栈
+- 用具体色彩角色代替默认紫色渐变：主动作色、情绪强调色、功能信息色、弱化背景色要各司其职
+- 用一段有节制的入场、滚动或状态动效代替到处散落的 hover 小把戏
+- 用不对称、密度变化、图文节奏、真实截图/图片和局部重点放大代替均匀卡片堆叠
+- 用 `visual-compare` 检查实现是否保住气质、层级和记忆点，而不只是检查有没有摆对位置

package/.openprd/design/assets/surface-presets.md

@@ -9,13 +9,19 @@
 - 低强度网格
 - 真实摄影背景
 - 真实产品渲染图
+- 与主题一致的细线、压纹、材质层或局部光感
+- 只在关键区域出现的一次性动效背景
 
 ## 慎用
 
 - 大面积渐变主导整个页面
 - 纯装饰型发光块
 - 和主题无关的氛围图
+- 默认紫色/蓝紫渐变和玻璃拟态背景
+- 每个卡片都叠阴影、模糊和噪点
 
 ## 默认原则
 
 - 资产服务于内容，不要盖过内容。
+- 表面风格要服务审美主张：温暖页面优先纸感和软边线，发布页优先主视觉和证明材料，工具页优先边界、对齐和状态。
+- 没有真实素材时先承认缺口，不要用漂亮背景假装内容已经成立。

package/.openprd/design/checklists/ui-quality-gate.md

@@ -2,10 +2,13 @@
 
 ## P0
 
+- 已写清本次审美主张：用途、受众、气质端点、约束和用户会记住的一件事
 - 关键事实已核实，或明确标注 `待确认`
 - 主题已锁定，不存在临时发明的颜色体系
+- 字体、色彩、动效、表面/背景和构图选择能服务同一个审美主张
 - 真实图片是否必需已经判断
 - 大界面任务若无参考方向，已完成 3 个异源方向
+- 已用 `anti-slop.md` 排除默认紫白渐变、通用字体栈、白底卡片堆叠和无语境装饰
 
 ## P1
 
@@ -14,9 +17,13 @@
 - 按钮、卡片、表格、表单大小关系自然
 - 长文本没有挤爆容器
 - 局部视觉语言没有突然换轨
+- 字体角色清楚：标题、正文、标签、数字或代码不混成一套无差别样式
+- 主色、强调色、功能色和弱化背景色有分工，不是一种颜色深浅铺满全页
+- 动效有一两个关键时刻，而不是散乱堆满 hover 或完全没有状态反馈
 
 ## P2
 
 - 屏幕第一眼能知道页面是干什么的
 - 未改区域没有明显视觉漂移
 - 需要时已准备 `visual-prepare` 或 `visual-compare` 证据
+- 视觉证据能看出选定方向的气质和记忆点，而不只是结构摆放正确

package/.openprd/design/lenses/frontend-lenses.md

@@ -1,31 +1,59 @@
 # Frontend Lenses
 
+选 lens 时不要只选任务类型，还要补一句审美主张和一个记忆点。lens 是判断角度，不是固定皮肤；同一个 lens 可以有极简、温暖、工业、编辑或沉浸等不同气质。
+
 ## `editorial-contrast`
 
 - 适合内容型页面、品牌故事、专题页、馆藏导览、展览解说
 - 核心特征：排版节奏感强，图文切换明确，留白与密度并存
 - 常见风险：做成只有“杂志感”但没有任务完成路径
+- 记忆点示例：有辨识度的标题字体、章节节奏、真实图片与文字之间的停顿
 
 ## `product-launch`
 
 - 适合发布页、产品介绍页、关键功能亮点页
 - 核心特征：主视觉强、卖点集中、规格与证明材料清晰
 - 常见风险：只顾氛围，不给关键事实和证据
+- 记忆点示例：一个强主视觉、一个清楚承诺、一个可验证的产品状态或数据
 
 ## `operational-density`
 
 - 适合后台、工具页、控制台、SaaS、CRM、配置页
 - 核心特征：扫描效率高、信息密度稳、交互路径短
 - 常见风险：密度高但没有层级，最后变成挤
+- 记忆点示例：稳定工具感、清楚状态、可反复使用的列表/表格/筛选结构
 
 ## `immersive-showcase`
 
 - 适合旅游、地点、内容探索、案例展示
 - 核心特征：真实图片主导，叙事路径顺滑，视觉情绪明显
 - 常见风险：图片很好看，但信息组织太弱
+- 记忆点示例：首屏真实场景、沉浸式媒体层级、少量强信号文字
 
 ## `catalog-clarity`
 
 - 适合资料库、资源库、商品库、内容浏览
 - 核心特征：卡片和列表关系清晰，可筛选、可比较、可快速回看
 - 常见风险：所有区块看起来一样重
+- 记忆点示例：清楚分类、可比较的信息单位、用户能快速回到上一次浏览位置
+
+## `warm-invitation`
+
+- 适合欢迎页、报名/预约、内容社区、轻量 onboarding、需要可信但不冷冰冰的工具页
+- 核心特征：纸感中性色、温暖主动作色、克制圆角、柔和边线、标题有编辑气质
+- 常见风险：过度装饰后变成可爱风、仪式感太重而影响操作效率
+- 记忆点示例：像一份认真邀请函和清楚 briefing 的结合，温暖但不松散
+
+## `crafted-luxury`
+
+- 适合高客单价产品、精品品牌、作品集、商业介绍和需要信任感的专业服务
+- 核心特征：低噪声留白、精确比例、少量高对比重点、材质和排版胜过大面积装饰
+- 常见风险：只剩空和大字，没有信息密度和行动路径
+- 记忆点示例：一个精确比例的首屏、一个高质感细节、一个被克制放大的关键承诺
+
+## `playful-system`
+
+- 适合教育、儿童/青少年、创意工具、轻娱乐产品和可探索的互动界面
+- 核心特征：形状、状态、动效和微文案更有性格，但仍保持路径清楚
+- 常见风险：玩具感压过任务，或颜色太多导致信息不可扫
+- 记忆点示例：一个有趣状态反馈或可探索组件，而不是到处撒装饰

package/.openprd/design/recipes/content-experience.md

@@ -3,9 +3,15 @@
 ## 默认组合
 
 - lens: `editorial-contrast` 或 `immersive-showcase`
-- theme: `quiet-sand` 或 `warm-editorial`
+- theme: `quiet-sand`、`warm-editorial` 或 `warm-invitation`
 - layout: `editorial-rail` 或 `story-map`
 
+## 审美重点
+
+- 用标题字体、图文节奏、章节停顿和真实图片建立记忆点。
+- 可以温暖、编辑、沉浸或展陈，但不能只是浅色留白加一组内容卡片。
+- 动效以轻 reveal、媒体切换、章节进入为主，不要把每张卡都做成独立表演。
+
 ## 必做前置
 
 - `image-preflight.md`
@@ -24,3 +30,4 @@
 - 没有真实图时是否及时降级，而不是硬做灰块页面
 - 图文节奏是否成立
 - 读者是否知道下一步看哪里
+- 有没有避开通用 SaaS hero、紫白渐变和无语境装饰

package/.openprd/design/recipes/operational-tool.md

@@ -6,6 +6,12 @@
 - theme: `tool-neutral`
 - layout: `ops-density-grid` 或 `settings-split`
 
+## 审美重点
+
+- 工具型页面的审美来自扫描效率、状态清晰、控件秩序和稳定密度，不来自营销式大标题。
+- 可以克制，但不能无设计：字体层级、表格节奏、筛选路径、状态色和边框体系必须清楚。
+- 不要把后台做成落地页，不要用发光渐变、玻璃卡或过大 hero 抢掉工作路径。
+
 ## 必做前置
 
 - 先决定关键任务路径和主操作
@@ -23,3 +29,4 @@
 - 是否方便扫描
 - 主操作是否靠近用户决策点
 - 文本和控件是否出现无意义放大
+- 是否用密度、对齐和状态体现专业感，而不是只换一个中性配色

package/.openprd/design/recipes/product-launch.md

@@ -3,9 +3,15 @@
 ## 默认组合
 
 - lens: `product-launch`
-- theme: `deep-launch` 或 `warm-editorial`
+- theme: `deep-launch`、`warm-editorial` 或 `warm-invitation`
 - layout: `product-spec-runway`
 
+## 审美重点
+
+- 先决定发布气质：强势发布、温暖邀请、编辑解释、专业证据或沉浸展示。
+- 首屏必须有一个可记住的产品状态、真实界面、具体承诺或关键证据。
+- 不要默认做成紫色渐变、白底三卡片和泛泛功能 bullet；发布页的装饰必须服务证明和行动。
+
 ## 必做前置
 
 - `facts-sheet.md`
@@ -24,3 +30,4 @@
 - 首屏是否一眼知道是什么产品
 - 规格和卖点有没有混成一锅
 - 证明材料是否真实且位置合理
+- 字体、色彩、动效和主视觉是否共同服务同一个发布气质

package/.openprd/design/templates/README.md

@@ -5,9 +5,10 @@
 ## 使用顺序
 
 1. 先补 `active/` 下的事实、素材、图片前置和方向合同
-2. 再从这里挑最近的一份模板
-3. 运行 `openprd design-starter . --starter <starter-id> --out index.html`
-4. 再按选中的 `lens + theme + layout + component set` 改写内容和样式
+2. 再写清本页用途、受众、气质端点、约束和记忆点
+3. 再从这里挑最近的一份模板
+4. 运行 `openprd design-starter . --starter <starter-id> --out index.html`
+5. 再按选中的 `lens + theme + layout + component set + 审美主张` 改写内容和样式
 
 ## 模板清单
 
@@ -32,5 +33,7 @@
 - 跑完 `design-starter` 后先改生成入口文件里的 `[占位]` 文案和标题，再细化样式，不要回头整页重读模板源码
 - 跑完 `design-starter` 后，下一步默认就是一次补丁，同时改入口文件和必要的 active design artifacts；直接在生成的入口文件上改。禁止删除 starter 生成的入口文件后另起新稿
 - 先改结构和文案，再细化装饰
+- 细化样式前先用 `anti-slop.md` 检查：不要默认紫白渐变、通用字体、白底卡片堆叠或同一种安全模板
+- 模板字体、色彩和动效只是起步点；如果它们不服务当前审美主张，要在 Patch Mode 中改掉
 - 模板只是骨架，不能把示例文案原样交付
 - 如果模板默认组合已经够用，不要继续把所有 catalog 文件都重读一遍再决定

package/.openprd/design/templates/README_EN.md

@@ -5,9 +5,10 @@ These templates are not final deliverables. They are the first runnable skeleton
 ## Order
 
 1. Fill the task-specific contracts under `active/`
-2. Pick the closest starter template here
-3. Run `openprd design-starter . --starter <starter-id> --out index.html`
-4. Then adapt it using the selected `lens + theme + layout + component set`
+2. Write the page purpose, audience, aesthetic tone, constraints, and one memorable point
+3. Pick the closest starter template here
+4. Run `openprd design-starter . --starter <starter-id> --out index.html`
+5. Then adapt it using the selected `lens + theme + layout + component set + aesthetic intent`
 
 ## Included Starters
 
@@ -29,3 +30,5 @@ These templates are not final deliverables. They are the first runnable skeleton
 - After `design-starter`, replace the generated placeholder copy and title in the entry file before rereading the whole template
 - After `design-starter`, the default next move is one patch that updates both the entry file and the active design contracts; edit the generated entry file in place instead of deleting and recreating it
 - Start with structure and copy before decoration
+- Before styling, check `anti-slop.md`: avoid default purple gradients, generic font stacks, white-card grids, and one-size-fits-all templates
+- Starter typography, color, and motion are starting points; change them in Patch Mode when they do not serve the selected aesthetic intent

package/.openprd/design/templates/ops-dashboard.html

@@ -21,7 +21,7 @@
       * { box-sizing: border-box; }
       body {
         margin: 0;
-        font-family: "Inter", "PingFang SC", sans-serif;
+        font-family: "Aptos", "Avenir Next", "Noto Sans SC", "PingFang SC", sans-serif;
         background: linear-gradient(180deg, #f6f8fb 0%, var(--bg) 100%);
         color: var(--ink);
       }
@@ -54,6 +54,7 @@
       .brand {
         font-size: 18px;
         font-weight: 700;
+        font-family: "Aptos Display", "Avenir Next", "Noto Sans SC", "PingFang SC", sans-serif;
       }
 
       .nav,
@@ -95,6 +96,12 @@
 
       h1, h2, h3, p { margin: 0; }
 
+      h1,
+      h2,
+      h3 {
+        font-family: "Aptos Display", "Avenir Next", "Noto Sans SC", "PingFang SC", sans-serif;
+      }
+
       .topbar p,
       .panel p {
         color: var(--muted);

package/.openprd/design/templates/product-launch.html

@@ -21,7 +21,7 @@
       * { box-sizing: border-box; }
       body {
         margin: 0;
-        font-family: "Inter", "PingFang SC", sans-serif;
+        font-family: "Avenir Next", "Noto Sans SC", "PingFang SC", sans-serif;
         background:
           radial-gradient(circle at top center, rgba(124, 224, 195, 0.16), transparent 28%),
           linear-gradient(180deg, #091018 0%, var(--bg) 100%);
@@ -64,6 +64,7 @@
 
       h1 {
         margin-top: 18px;
+        font-family: "DIN Condensed", "Avenir Next Condensed", "Noto Sans SC", "PingFang SC", sans-serif;
         font-size: clamp(40px, 6vw, 70px);
         line-height: 0.96;
         letter-spacing: 0;

package/.openprd/design/themes/theme-catalog.json

@@ -5,7 +5,7 @@
       "id": "quiet-sand",
       "useFor": ["editorial-contrast", "catalog-clarity"],
       "summary": "Warm neutral editorial theme with restrained contrast.",
-      "bodyFont": "\"Inter\", \"PingFang SC\", sans-serif",
+      "bodyFont": "\"Avenir Next\", \"Noto Sans SC\", \"PingFang SC\", sans-serif",
       "headlineFont": "\"Iowan Old Style\", \"Noto Serif SC\", \"Songti SC\", serif",
       "surfacePreset": "paper-grid",
       "tokens": {
@@ -23,8 +23,8 @@
       "id": "deep-launch",
       "useFor": ["product-launch", "immersive-showcase"],
       "summary": "Dark, cinematic launch theme with controlled highlight color.",
-      "bodyFont": "\"Inter\", \"PingFang SC\", sans-serif",
-      "headlineFont": "\"Inter\", \"PingFang SC\", sans-serif",
+      "bodyFont": "\"Avenir Next\", \"Noto Sans SC\", \"PingFang SC\", sans-serif",
+      "headlineFont": "\"DIN Condensed\", \"Avenir Next Condensed\", \"Noto Sans SC\", \"PingFang SC\", sans-serif",
       "surfacePreset": "dark-mesh",
       "tokens": {
         "background": "#0D1117",
@@ -55,12 +55,30 @@
         "shadow": "0 10px 24px rgba(27,23,20,0.07)"
       }
     },
+    {
+      "id": "warm-invitation",
+      "useFor": ["warm-invitation", "editorial-contrast", "product-launch"],
+      "summary": "Welcoming paper-neutral theme with terracotta action color, brass support accents, serif-led headings, and soft-line surfaces.",
+      "bodyFont": "\"Noto Sans SC\", \"Avenir Next\", \"PingFang SC\", sans-serif",
+      "headlineFont": "\"Noto Serif SC\", \"Iowan Old Style\", \"Songti SC\", serif",
+      "surfacePreset": "paper-grid",
+      "tokens": {
+        "background": "#F7F5F2",
+        "surface": "#FFFDFB",
+        "text": "#2C2C2C",
+        "muted": "#6F6A63",
+        "accent": "#CC7D5E",
+        "border": "#E6E2DC",
+        "radius": "20px",
+        "shadow": "0 14px 34px rgba(44,44,44,0.08)"
+      }
+    },
     {
       "id": "tool-neutral",
       "useFor": ["operational-density", "catalog-clarity"],
       "summary": "Quiet operational theme for work-focused interfaces.",
-      "bodyFont": "\"Avenir Next\", \"PingFang SC\", sans-serif",
-      "headlineFont": "\"Inter\", \"PingFang SC\", sans-serif",
+      "bodyFont": "\"Aptos\", \"Avenir Next\", \"Noto Sans SC\", \"PingFang SC\", sans-serif",
+      "headlineFont": "\"Aptos Display\", \"Avenir Next\", \"Noto Sans SC\", \"PingFang SC\", sans-serif",
       "surfacePreset": "workbench-grid",
       "tokens": {
         "background": "#F4F6F8",