Back to Details

prd-grade-fe

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

prd-grade-fe

prd-grade-fe

$SKILL
dưới đây = Base directory của skill này (dòng "Base directory for this skill" khi skill được nạp; trong repo framework là 
skills/prd-grade-fe
). Mọi script và reference đi kèm thư mục skill, không phụ thuộc repo.
Hub mỏng. Không sở hữu luật thiết kế: thẩm mỹ là của hallmark (
skills/hallmark/SKILL.md
), luật tất định là của impeccable (
npx -y impeccable@3.6.1 detect
, pin cứng). Hub sở hữu thứ tự và hợp đồng giữa các pha, cộng hai script có 
--self-test
:
FileVai trò
scripts/design-sync.py
design.md
là nguồn chân lý: block 
css :root{}
→ frontmatter YAML (impeccable đọc) + 
tokens.css
. 
--check
rc 1 khi drift.
scripts/fe-gate.sh
Cổng trước khi giao: assert target tồn tại → 
detect --json
→ rc 0/1/2 đúng nghĩa → 
viewport-check.mjs
320/375/414/768. Exit 0 xanh · 1 lỗi impeccable · 2 finding/viewport đỏ · 3 skipped (thiếu node/mạng) · 4 target thiếu.
scripts/badge-consistency.py
Rule tất định impeccable không có (GH#164): trong MỘT file, badge trạng thái (
render*Badge
/
*Status*
/
*Pill*
/span pill) phải cùng chữ ký icon-hay-dot · 
rounded-*
· hằng token (
STATUS_GLASS
); badge lệch đa số (≥2) → 
file:line
, fe-gate tính là finding rc 2.
references/presets/macos-glass.design.md
Preset mặc định đã qua detect rc 0; bằng chứng ở 
macos-glass.evidence.md
.
references/intake.md
Route A/B/C → 
design.md
.
references/impeccable-audit.md
Rubric audit (5 trục /20) · harden · polish, distill có nguồn.
下文的 
$SKILL
= 此 skill 的 Base directory（加载 skill 时显示“Base directory for this skill”那一行；在 framework repo 中为 
skills/prd-grade-fe
）。所有随附的 script 和 reference 均位于 skill 目录下，不依赖 repo。
轻量级 Hub。不拥有设计规则：审美由 hallmark（
skills/hallmark/SKILL.md
）负责，确定性规则由 impeccable（
npx -y impeccable@3.6.1 detect
，版本固定）负责。Hub 负责各阶段的执行顺序和阶段间契约，并提供两个支持 
--self-test
的 script：
File作用
scripts/design-sync.py
design.md
是 source of truth：提取 
css :root{}
代码块 → frontmatter YAML（供 impeccable 读取）+ 
tokens.css
。发生 drift 时，
--check
返回 rc 1。
scripts/fe-gate.sh
交付前的门禁：断言 target 存在 → 
detect --json
→ rc 0/1/2 各自具有明确含义 → 
viewport-check.mjs
320/375/414/768。退出码 0 表示绿色 · 1 表示 impeccable 错误 · 2 表示 finding/viewport 红色 · 3 表示 skipped（缺少 node/网络）· 4 表示 target 缺失。
scripts/badge-consistency.py
impeccable 中没有对应的确定性规则（GH#164）：同一个 file 内，状态 badge（
render*Badge
/
*Status*
/
*Pill*
/span pill）必须使用一致的 icon-or-dot 签名、
rounded-*
和固定 token（
STATUS_GLASS
）；若偏离多数实现的 badge 数量 ≥2，则输出 
file:line
，fe-gate 将其计为 rc 2 finding。
references/presets/macos-glass.design.md
默认 preset，已通过 detect rc 0；证据见 
macos-glass.evidence.md
。
references/intake.md
将 Route A/B/C 转换为 
design.md
。
references/impeccable-audit.md
Rubric audit（5 个轴/20 分）· harden · polish；distill 内容均有来源。

WHAT

WHAT

Purpose và context

目的与上下文

  • Purpose: ra một trang/màn hình frontend chuẩn production có CỔNG MÁY GÁC — theme khoá vào MỘT 
    design.md
    , dựng token-only theo hallmark, không giao khi 
    fe-gate.sh
    chưa xanh và P0 chưa = 0.
  • Trigger (when to use) — mục 
    ## When to use
    cũ:
    • User muốn một trang/màn hình frontend đưa vào production, không phải mockup nhanh (mockup nhanh → 
      /br
      hoặc hallmark trần).
    • User đưa theme dưới dạng "mặc định đi", "đây là tài liệu thiết kế", hoặc "làm giống trang này: <URL>".
    • Project đã có 
      design.md
      và cần thêm màn hình cùng hệ kèm cổng kiểm.
  • Non-goals: không phải mockup nhanh (→ 
    /br
    hoặc hallmark trần); không sở hữu luật thiết kế (thẩm mỹ = hallmark, luật tất định = impeccable); không lo dây chuyền BR→frame.
  • **目的：**交付一个具备“机器门禁”的 production 级 frontend 页面/屏幕——theme 锁定在一个 
    design.md
    中，按照 hallmark 构建 token-only 页面，在 
    fe-gate.sh
    尚未变绿且 P0 未等于 0 时绝不交付。
  • Trigger（何时使用）——原 
    ## When to use
    章节：
    • 用户需要一个可投入 production 的 frontend 页面/屏幕，而非快速 mockup（快速 mockup → 
      /br
      或纯 hallmark）。
    • 用户以“按默认方案来”“这是设计文档”或“做成和这个页面一样：<URL>”等形式提供 theme。
    • Project 已有 
      design.md
      ，需要新增同一设计系统下、附带门禁的页面。
  • **Non-goals：**不用于快速 mockup（→ 
    /br
    或纯 hallmark）；不拥有设计规则（审美 = hallmark，确定性规则 = impeccable）；不负责 BR→frame 流水线。

Mental model

Mental model

nguồn theme (A preset · B tài liệu · C URL) → design.md (nguồn chân lý) → design-sync.py → tokens.css + frontmatter → build token-only (hallmark) → fe-gate.sh (impeccable detect + badge-consistency + 4 viewport) → audit/harden/polish → report
. Hub sở hữu thứ tự và hợp đồng giữa các pha; luật nằm ở hallmark/impeccable.
theme 来源（A preset · B 文档 · C URL）→ design.md（source of truth）→ design-sync.py → tokens.css + frontmatter → 按 hallmark 构建 token-only 页面 → fe-gate.sh（impeccable detect + badge-consistency + 4 个 viewport）→ audit/harden/polish → report
。Hub 负责执行顺序和阶段间契约；具体规则位于 hallmark/impeccable。

Input và output contract

输入与输出契约

FieldRequired?Ý nghĩa
Inbrief trang/màn hìnhcóthứ cần dựng
Innguồn theme A/B/C, audience, use case, tonekhông"go ahead"/bỏ trống → A + suy luận 2–4 từ brief, công bố một câu
In
design.md
có sẵn		khôngcó + 
--check
rc 0 → dùng lại, nhảy Pha 3
Out
design.md
+ 
tokens.css
đồng bộ		có
design-sync.py --check
rc 0
OutHTML output token-only có stamp design + critiquecótoggle sáng/tối, footer path tương đối
Out
fe-gate.report.json
+ report 8 mục (Pha 5)		có"sẵn sàng production" chỉ khi fe-gate exit 0 và P0 = 0
字段是否必填含义
In页面/屏幕 brief是需要构建的内容。
Intheme 来源 A/B/C、audience、use case、tone否用户回复“go ahead”或留空时 → 选择 A + 根据 brief 推断 2–4 个词，并用一句话公布推断结果。
In已存在的 
design.md
否若存在且 
--check
rc 0 → 复用并跳转至 Pha 3。
Out同步后的 
design.md
+ 
tokens.css
是
design-sync.py --check
rc 0。
Out带 design stamp + critique stamp 的 token-only HTML 输出是支持明暗切换，footer 包含相对路径。
Out
fe-gate.report.json
+ 包含 8 个部分的 report（Pha 5）		是仅当 fe-gate exit 0 且 P0 = 0 时，才能标记为“production-ready”。

Rules và capabilities

规则与能力

  • RULE-01 (MUST): Không chép rubric hallmark vào đây; sửa luật thì sửa ở hallmark hoặc 
    references/impeccable-audit.md
    (có nguồn + sha).
  • RULE-02 (MUST): Không bao giờ gọi 
    npx impeccable install
    (bản 3.6.1 không có 
    --help
    cho install, nó cài thật vào 
    $HOME
    ). 
    --scope
    luôn viết dính (
    --scope=type
    ). Tin JSON ở stdout, không tin stderr (npx gộp luồng).
  • RULE-03 (MUST): Vòng sửa quá 3 mà còn finding → giao kèm bảng dư và nói thẳng; hoặc waiver có lý do trong 
    .impeccable/config.json
    (
    {"ignores":[...]}
    ) được nêu trong report. Không ignore lén.
  • RULE-04 (MUST): Thiếu node/mạng → report ghi 
    skipped: <lý do>
    , exit gate ≠ 0. Không có ngoại lệ "chắc cũng ổn".
  • RULE-05 (MUST): 
    design.md
    đã tồn tại → không ghi đè; đổi hệ thì AMEND 
    ## Variants
    (no-overwrite policy của hallmark design-md).
  • RULE-06 (MUST): Self-check khi sửa skill: 
    python3 $SKILL/scripts/design-sync.py --self-test && python3 $SKILL/scripts/badge-consistency.py --self-test && bash $SKILL/scripts/fe-gate.sh --self-test
    , rồi 
    bash fdk/tools/sync-skill.sh prd-grade-fe
    .
  • Capabilities: đọc/ghi file design + output trong project; chạy script đồng bộ token và cổng phát hiện antipattern tất định (pin phiên bản); điều khiển trình duyệt headless đo 4 viewport; đọc URL/tài liệu thiết kế làm nguồn theme.
  • RULE-01（MUST）：不得将 hallmark rubric 复制到此处；如需修改规则，应修改 hallmark 或 
    references/impeccable-audit.md
    （必须附来源 + sha）。
  • RULE-02（MUST）：绝不调用 
    npx impeccable install
    （3.6.1 版本的 install 没有 
    --help
    ，该命令会实际安装到 
    $HOME
    ）。
    --scope
    必须始终采用粘性写入（
    --scope=type
    ）。只信任 stdout 中的 JSON，不信任 stderr（npx 会合并两个流）。
  • RULE-03（MUST）：修复轮次超过 3 次后仍有 finding → 交付时附上剩余 finding 表并明确说明；或者在 
    .impeccable/config.json
    （
    {"ignores":[...]}
    ）中配置有理由的 waiver，并在 report 中注明。禁止暗中 ignore。
  • RULE-04（MUST）：缺少 node/网络 → 在 report 中写入 
    skipped: <原因>
    ，gate exit ≠ 0。不存在“应该没问题”的例外。
  • RULE-05（MUST）：
    design.md
    已存在 → 不得覆盖；如果要更换设计系统，应 AMEND 
    ## Variants
    （遵循 hallmark design-md 的 no-overwrite policy）。
  • RULE-06（MUST）：修改 skill 后执行 self-check：
    python3 $SKILL/scripts/design-sync.py --self-test && python3 $SKILL/scripts/badge-consistency.py --self-test && bash $SKILL/scripts/fe-gate.sh --self-test
    ，然后执行 
    bash fdk/tools/sync-skill.sh prd-grade-fe
    。
  • 能力：读取/写入 project 中的 design 文件和输出文件；运行 token 同步 script 和确定性 antipattern 检测门禁（版本固定）；控制 headless 浏览器测量 4 个 viewport；读取 URL/设计文档作为 theme 来源。

Failure boundaries

失败边界

  • Thiếu node/mạng → 
    skipped: <lý do>
    , gate exit ≠ 0, report KHÔNG nói sạch (partial).
  • fe-gate rc 1 / 3 / 4 → blocked, dừng, ghi nguyên nhân; không có đường nào từ 1/3/4 tới "sạch".
  • rc 2 sau 3 vòng sửa → partial: giao kèm bảng finding dư hoặc waiver có lý do nêu trong report.
  • design-sync.py --check
    rc 1 (drift) → chưa đi tiếp Pha 3.
  • User đòi đổi theme khi 
    design.md
    đã có → AMEND 
    ## Variants
    , không ghi đè.
  • 缺少 node/网络 → 
    skipped: <原因>
    ，gate exit ≠ 0，report 不得声称已清洁（partial）。
  • fe-gate rc 1 / 3 / 4 → blocked，立即停止并记录原因；不存在从 1/3/4 进入“清洁”状态的路径。
  • rc 2 且经过 3 轮修复后仍有 finding → partial：交付时附上剩余 finding 表，或提供有理由的 waiver，并在 report 中注明。
  • design-sync.py --check
    rc 1（drift）→ 不得进入 Pha 3。
  • 用户要求更换 theme，但 
    design.md
    已存在 → AMEND 
    ## Variants
    ，不得覆盖。

HOW

HOW

Main workflow

主工作流

StepTypeInputsActionOutputs/exitFailure/next
W01deterministicprojectPha 0 pre-flight: 
ls design.md …
, 
command -v node
, 
design-sync.py --check
hệ đã khoá hay chưa, node có khôngđã khoá → B01; không node → B02
W02judgmentbriefPha 1 interview MỘT tin nhắn (nguồn theme · audience · use case · tone)đáp án hoặc suy luận công bố—
W03effectnguồn themePha 2 khoá biến A/B/C → 
design.md
→ 
design-sync.py && --check
rc 0rc 1 → sửa drift
W04effect
design.md
Pha 3 build theo hallmark, token-only, stamp đầu fileHTML outputcritique trục < 3 → sửa trước W05
W05deterministicoutputPha 4 gate: 
fe-gate.sh
(≤ 3 vòng) → audit /20 → harden/polish → slop-test → fe-gate lần cuối		exit 0 + P0 = 0rc 1/3/4 → blocked; rc 2 sau 3 vòng → partial
W06judgmentkết quảPha 5 deliver + report 8 mụcreport—
Chi tiết từng bước (nguồn chân lý cho W01–W06) — mục 
## Steps
cũ, nguyên văn:
StepTypeInputsActionOutputs/exitFailure/next
W01deterministicprojectPha 0 pre-flight：
ls design.md …
、
command -v node
、
design-sync.py --check
设计系统是否已锁定、node 是否存在已锁定 → B01；缺少 node → B02
W02judgmentbriefPha 1 单消息访谈（theme 来源 · audience · use case · tone）获得答案或公布推断结果—
W03effecttheme 来源Pha 2 锁定 A/B/C → 
design.md
→ 
design-sync.py && --check
rc 0rc 1 → 修复 drift
W04effect
design.md
Pha 3 按 hallmark 构建 token-only 页面，并在文件开头写入 stampHTML 输出critique 某轴 < 3 → 进入 W05 前修复
W05deterministic输出Pha 4 gate：
fe-gate.sh
（最多 3 轮）→ audit /20 → harden/polish → slop-test → 最后再次运行 fe-gate		exit 0 + P0 = 0rc 1/3/4 → blocked；rc 2 且经过 3 轮 → partial
W06judgment结果Pha 5 交付 + 包含 8 个部分的 reportreport—
W01–W06 各步骤详情（source of truth）——摘自原 
## Steps
章节：

Pha 0 — Pre-flight (không hỏi thứ máy tự thấy)

Pha 0 — Pre-flight（预检）

bash
ls design.md DESIGN.md tokens.css 2>/dev/null; command -v node && echo node-ok
python3 $SKILL/scripts/design-sync.py --check 2>/dev/null; echo sync-rc=$?
  • Có 
    design.md
    và 
    --check
    rc 0 → nói "hệ đã khoá, dùng lại" và nhảy Pha 3 (trừ khi user đòi đổi theme → 
    references/intake.md
    § "Khi project đã có design.md").
  • Không có 
    node
    → vẫn làm Pha 1–3, nhưng Pha 4 sẽ ghi 
    skipped
    và report KHÔNG được nói sạch.
bash
ls design.md DESIGN.md tokens.css 2>/dev/null; command -v node && echo node-ok
python3 $SKILL/scripts/design-sync.py --check 2>/dev/null; echo sync-rc=$?
  • 存在 
    design.md
    且 
    --check
    rc 0 → 提示“设计系统已锁定，予以复用”，并跳转至 Pha 3（除非用户要求更换 theme → 
    references/intake.md
    § “Khi project đã có design.md”）。
  • 缺少 
    node
    → 仍执行 Pha 1–3，但 Pha 4 将记录 
    skipped
    ，report 不得声称已清洁。

Pha 1 — Interview MỘT tin nhắn (gộp câu của hallmark, không hỏi nối đuôi)

Pha 1 — Interview（单消息访谈）

Trước khi dựng, cần 4 thứ. Trả lời phần nào cũng được, hoặc nói "go ahead":
  1. Nguồn theme — [A] macOS glass mặc định · [B] đường dẫn tài liệu thiết kế (file/folder) · [C] URL trang đích
  2. Audience — ai dùng, họ biết gì sẵn?
  3. Use case — một hành động trang này phải dẫn tới?
  4. Tone — chọn một cực: editorial · brutalist · soft · utilitarian · luxury · playful · technical · austere
"go ahead" hoặc bỏ trống → chọn A, suy luận 2–4 từ brief, công bố suy luận một câu ở đầu reply (hallmark Step 1 opt-out protocol). Không có ngoại lệ "brief đã đủ rõ": vẫn hỏi, user vẫy qua trong hai giây.
开始构建前，需要 4 项信息。可以只回答其中任意部分，或者直接说 “go ahead”：
  1. Theme 来源 — [A] 默认 macOS glass · [B] 设计文档路径（file/folder） · [C] 目标页面 URL
  2. Audience — 谁会使用，他们已经了解什么？
  3. Use case — 这个页面需要引导用户完成什么操作？
  4. Tone — 选择一个方向：editorial · brutalist · soft · utilitarian · luxury · playful · technical · austere
用户回复“go ahead”或留空 → 选择 A，根据 brief 推断 2–4 个词，并在 reply 开头用一句话公布推断结果（hallmark Step 1 opt-out protocol）。不存在“brief 已足够清晰”的例外：仍需询问，用户可在两秒内挥手跳过。

Pha 2 — Khoá biến (
references/intake.md
)

Pha 2 — 锁定变量（
references/intake.md
）

  • A: 
    cp $SKILL/references/presets/macos-glass.design.md ./design.md
    , đổi tên project ở dòng đầu.
  • B: đọc tài liệu → bảng schema có nguồn file:dòng → MỘT câu hỏi bù → ghi 
    design.md
    + § Provenance.
  • C: hallmark 
    study <URL>
    (URL mode, refuse list + attestation) → "lock the DNA" → 
    design.md
    có § Provenance + § Notes (rhythm blind spot, anti-pattern không mang theo).
  • Rồi: 
    python3 $SKILL/scripts/design-sync.py && python3 $SKILL/scripts/design-sync.py --check
    → rc 0 mới đi tiếp.
  • Công bố Genre / Macrostructure / Theme ra lời (hallmark Step 2.5).
  • A：
    cp $SKILL/references/presets/macos-glass.design.md ./design.md
    ，并将第一行的 project 名称改为当前项目。
  • B：读取文档 → 生成带 
    file:line
    来源的 schema 表 → 提出一个补充问题 → 写入 
    design.md
    + § Provenance。
  • C：使用 hallmark 
    study <URL>
    （URL mode、refuse list + attestation）→ “lock the DNA” → 写入带 § Provenance + § Notes 的 
    design.md
    （记录 rhythm blind spot，且不沿用 anti-pattern）。
  • 随后执行：
    python3 $SKILL/scripts/design-sync.py && python3 $SKILL/scripts/design-sync.py --check
    → rc 0 后方可继续。
  • 在 reply 中公布 Genre / Macrostructure / Theme（hallmark Step 2.5）。

Pha 3 — Build theo hallmark, hệ đã khoá

Pha 3 — 按 hallmark 构建已锁定的设计系统

  • Chạy hallmark default flow (Step 2 macrostructure → 3 ruleset → 5 preview → 6 build) với 
    design.md
    locked: diversification đảo chiều (màn hình phải CHUNG hệ).
  • Mọi màu, font, radius, motion qua 
    var(--…)
    từ 
    tokens.css
    (hallmark discipline 3). Không hex/oklch inline; thiếu token thì thêm vào block 
    :root
    của 
    design.md
    rồi chạy 
    design-sync.py
    lại.
  • Output HTML cho người xem: toggle sáng/tối bằng nút gạt có nhãn + 
    html[data-theme]
    + localStorage + chống FOUC; thang chữ compact 13″; footer ghi path tương đối của chính file.
  • Stamp đầu file: 
    <!-- design: macrostructure=<M> theme=<T> -->
    và 
    /* Hallmark · pre-emit critique: P? H? E? S? R? V? */
    (6 trục, trục nào < 3 thì sửa trước khi sang Pha 4).
  • 在 
    design.md
    已锁定的情况下运行 hallmark default flow（Step 2 macrostructure → 3 ruleset → 5 preview → 6 build）；diversification 方向反转（新页面必须与现有页面属于同一设计系统）。
  • 所有颜色、字体、radius、motion 均通过 
    tokens.css
    中的 
    var(--…)
    使用（hallmark discipline 3）。不得内联使用 hex/oklch；缺少 token 时，将其加入 
    design.md
    的 
    :root
    代码块，然后重新运行 
    design-sync.py
    。
  • 面向查看者输出 HTML：使用带标签的 switch 实现明暗切换 + 
    html[data-theme]
    + localStorage + 防止 FOUC；采用适合 13 英寸屏幕的紧凑字号；footer 记录文件自身的相对路径。
  • 在文件开头写入 stamp：
    <!-- design: macrostructure=<M> theme=<T> -->
    和 
    /* Hallmark · pre-emit critique: P? H? E? S? R? V? */
    （6 个轴；任何轴 < 3 都必须在进入 Pha 4 前修复）。

Pha 4 — Gate (máy trước, người sau)

Pha 4 — Gate（机器门禁）

  1. bash $SKILL/scripts/fe-gate.sh <output.html …>
    ; đọc bảng 
    antipattern | file:line | snippet
    và 
    fe-gate.report.json
    .
    • Dòng 
      badge lệch pattern so với N badge anh em
      = badge-consistency: sửa badge lệch theo anh em (đa số), không sửa ngược.
    • rc 2 → sửa đúng finding (đổi token trong 
      design.md
      → sync lại, hoặc sửa markup) → chạy lại. Tối đa 3 vòng. Ghi số finding từng vòng để đưa vào report.
    • rc 1 / 3 / 4 → dừng, ghi nguyên nhân. Không có đường nào từ 1/3/4 tới "sạch".
  2. Nạp 
    references/impeccable-audit.md
    : chấm 5 trục /20, liệt kê P0–P3; làm checklist Harden rồi Polish. P0 phải = 0.
  3. Chạy hallmark slop-test (
    skills/hallmark/references/slop-test.md
    ) trên output; gate nào đỏ thì sửa.
  4. Chạy lại 
    fe-gate.sh
    một lần cuối sau mọi chỉnh sửa (sửa harden/polish có thể tái sinh finding).
  1. 执行 
    bash $SKILL/scripts/fe-gate.sh <output.html …>
    ；读取 
    antipattern | file:line | snippet
    表和 
    fe-gate.report.json
    。 
    • badge lệch pattern so với N badge anh em
      这一行表示 badge-consistency：应按照同类 badge 中的多数实现修复偏离项，不得反向修改多数实现。
    • rc 2 → 精确修复对应 finding（修改 
      design.md
      中的 token → 重新 sync，或修改 markup）→ 再次运行。**最多 3 轮。**记录每轮的 finding 数量，以便写入 report。
    • rc 1 / 3 / 4 → 立即停止并记录原因。不存在从 1/3/4 进入“清洁”状态的路径。
  2. 加载 
    references/impeccable-audit.md
    ：为 5 个轴评分（满分 20），列出 P0–P3；执行 Harden checklist，然后执行 Polish。P0 必须 = 0。
  3. 对输出运行 hallmark slop-test（
    skills/hallmark/references/slop-test.md
    ）；任何红色 gate 都必须修复。
  4. 所有修改完成后，再次运行一次 
    fe-gate.sh
    （harden/polish 修改可能重新产生 finding）。

Pha 5 — Deliver + report

Pha 5 — Deliver + report

Report gồm, theo thứ tự: (1) suy luận/đáp án Pha 1; (2) Genre/Macrostructure/Theme + nguồn theme; (3) 6 điểm critique; (4) bảng finding vòng 1..n và rc cuối; (5) điểm audit /20 + P0 count; (6) 4 viewport; (7) path output tương đối; (8) 
skipped
nếu có. Câu "sẵn sàng production" chỉ được viết khi fe-gate exit 0 và P0 = 0.
Report 按以下顺序包含 8 个部分：(1) Pha 1 的推断/答案；(2) Genre/Macrostructure/Theme + theme 来源；(3) 6 项 critique 评分；(4) 第 1..n 轮 finding 表及最终 rc；(5) audit 分数 /20 + P0 数量；(6) 4 个 viewport；(7) 输出文件的相对路径；(8) 如有 
skipped
，则列出。只有在 fe-gate exit 0 且 P0 = 0 时，报告中才允许写“sẵn sàng production”（production-ready）。

Branches

分支

IDKindGuardHành viSkip / failureRejoin
B01conditional_requiredcó 
design.md
và 
--check
rc 0		nói "hệ đã khoá, dùng lại", bỏ W02–W03user đòi đổi theme → 
references/intake.md
§ "Khi project đã có design.md"		W04
B02recoverykhông có 
node
/ mạng		vẫn làm Pha 1–3; Pha 4 ghi 
skipped
report KHÔNG được nói sạchW06
B03user_optionalnguồn theme = B (tài liệu)bảng schema có nguồn file:dòng → MỘT câu hỏi bù → 
design.md
+ § Provenance		—W03 (sync)
B04user_optionalnguồn theme = C (URL)hallmark 
study <URL>
→ "lock the DNA" → 
design.md
+ § Provenance + § Notes		—W03 (sync)
B05recoveryfe-gate rc 2sửa đúng finding (token trong 
design.md
→ sync, hoặc markup) → chạy lại, tối đa 3 vòng		quá 3 vòng → giao kèm bảng dư hoặc waiver có lý doW05
IDKindGuard行为Skip / failureRejoin
B01conditional_required存在 
design.md
且 
--check
rc 0		提示“设计系统已锁定，予以复用”，跳过 W02–W03用户要求更换 theme → 
references/intake.md
§ “Khi project đã có design.md”		W04
B02recovery缺少 
node
/网络		仍执行 Pha 1–3；Pha 4 记录 
skipped
report 不得声称已清洁W06
B03user_optionaltheme 来源 = B（文档）生成带 
file:line
来源的 schema 表 → 提出一个补充问题 → 写入 
design.md
+ § Provenance		—W03（sync）
B04user_optionaltheme 来源 = C（URL）hallmark 
study <URL>
→ “lock the DNA” → 写入带 § Provenance + § Notes 的 
design.md
—W03（sync）
B05recoveryfe-gate rc 2精确修复对应 finding（修改 
design.md
中的 token → sync，或修改 markup）→ 再次运行，最多 3 轮		超过 3 轮 → 交付时附上剩余 finding 表，或提供有理由的 waiverW05

Validation và stopping

验证与停止条件

Cổng máy: 
fe-gate.sh
exit 0 (impeccable detect rc 0 + badge-consistency + 4 viewport 320/375/414/768) và 
design-sync.py --check
rc 0. Cổng người/rubric: audit 5 trục /20 với P0 = 0, slop-test không đỏ. Vòng sửa gate trần 3; fe-gate chạy lại một lần cuối sau mọi chỉnh sửa.
机器门禁：
fe-gate.sh
exit 0（impeccable detect rc 0 + badge-consistency + 4 个 viewport：320/375/414/768），且 
design-sync.py --check
rc 0。人工/rubric 门禁：audit 5 个轴 /20，P0 = 0，slop-test 无红色项。原始 gate 修复轮次最多为 3；所有修改完成后，必须再次运行一次 fe-gate。

Examples

示例

  • Positive: 
    /prd-grade-fe dựng trang danh sách đơn hàng cho app quản lý kho, mặc định theme
    → chọn A, 
    cp
    preset macos-glass thành 
    design.md
    , sync rc 0, build token-only, fe-gate vòng 1 rc 2 (2 finding) → sửa → vòng 2 exit 0, P0 = 0 → report 8 mục, được ghi "sẵn sàng production".
  • Boundary/failure: máy không có 
    node
    → Pha 1–3 vẫn làm, fe-gate exit 3 → report ghi 
    skipped: thiếu node
    , KHÔNG viết "sẵn sàng production".
  • Positive：
    /prd-grade-fe dựng trang danh sách đơn hàng cho app quản lý kho, mặc định theme
    → 选择 A，将 macos-glass preset 
    cp
    为 
    design.md
    ，sync rc 0，构建 token-only 页面，fe-gate 第 1 轮 rc 2（2 个 finding）→ 修复 → 第 2 轮 exit 0，P0 = 0 → 输出包含 8 个部分的 report，并标记为“sẵn sàng production”。
  • **Boundary/failure：**机器缺少 
    node
    → 仍执行 Pha 1–3，fe-gate exit 3 → report 写入 
    skipped: thiếu node
    ，不得写“sẵn sàng production”。

Ví dụ gọi

调用示例

/prd-grade-fe dựng trang danh sách đơn hàng cho app quản lý kho, mặc định theme
/prd-grade-fe trang pricing, theme lấy từ docs/brand/ (folder)
/prd-grade-fe landing cho sản phẩm X, làm giống https://example.com
/prd-grade-fe dựng trang danh sách đơn hàng cho app quản lý kho, mặc định theme
/prd-grade-fe trang pricing, theme lấy từ docs/brand/ (folder)
/prd-grade-fe landing cho sản phẩm X, làm giống https://example.com