落两态结构:方案文件夹收当前权威版16份+归档-过期版收28份+索引重写;规则写进 product-planning 技能(闸门2061|0|27);顺修1b白名单FAIL与自身吃标题错误
This commit is contained in:
1 parent
2c9d623380
commit
70a4522e60
53 files changed
+24161
-106
No files matched your search
@@ -0,0 +1,311 @@
|
||||
# 3b 交互原型 · 实测记录(V5 · 侧栏回基准形态 + 刷新改 icon)
|
||||
|
||||
> 项目 slug:`mcn-shortvideo-agent` | ③段(界面交互)第 3b 子步产出
|
||||
> 落点:`执行会话/目标-侧栏改回64px基准形态并刷新按钮改ic-20a8ac/ui/3b-实测记录.md`
|
||||
> 本轮范围:用户 2026-10-10 两条口令 —— ① **左侧导航改回设计供给的基准形态**(`128px` 横排 → `64px` 竖排药丸浮栏,图标在上、名字在下);② **刷新按钮改 icon 并挪到页面标题行右侧**。🔴 硬约束(用户逐字):「**没让改的 交互不允许乱改**」⇒ ⛔ 导航项名与顺序、页数、每页板块、流转契约、其余任何交互**一格未动**。
|
||||
> ⛔ 本份的数全部现取,一个都不许凭记忆填。数据源:`#/selftest` 全文 + `_tools/` 8 个脚本。
|
||||
> 🔴 取证全程走「只连不起」:本机 `9223` 常驻独立 Chrome,一个任务只开一个标签并复用,换视口走 `Emulation.setDeviceMetricsOverride`。
|
||||
> ⚠️ **保活方式的实话**:派活单写的是「计划任务 `bh-chrome-keepalive` 保活」,但本机该计划任务 **2026-10-10 已撤销**;`browser-harness/SKILL.md` §1 现写「**只许本会话后台任务**这一种方式」。⇒ 本轮按**磁盘现行纪律**走:用本会话后台任务跑 `bh_chrome_keepalive.py`,会话结束浏览器随之下线。此处与派活单不一致,据实留痕。
|
||||
|
||||
---
|
||||
|
||||
## 一、自检全文(1440×900,PASS 80 / FAIL 0)
|
||||
|
||||
原样取自 `_tools/grab_selftest.py`,未删行、未改字。全文 87 行,此处逐条列。
|
||||
|
||||
```
|
||||
自检结果:PASS 80 / FAIL 0
|
||||
|
||||
PASS 路由 #/p/p1 渲染出 6 个顶层节点
|
||||
PASS 路由 #/p/p2 渲染出 5 个顶层节点
|
||||
PASS 路由 #/p/p3 渲染出 4 个顶层节点
|
||||
PASS 路由 #/p/p4 渲染出 5 个顶层节点
|
||||
PASS 路由 #/p/p5 渲染出 5 个顶层节点
|
||||
PASS 路由 #/p/p6 渲染出 5 个顶层节点
|
||||
PASS 路由 #/p/p7 渲染出 5 个顶层节点
|
||||
PASS 六态 × 七页 = 42 个组合,全部渲染出内容
|
||||
PASS 页集合正好七页,且与骨架表逐项相同(⛔ 页集合里没有 P8)
|
||||
PASS 导航一层七项:7 个功能项、一项一页,零组标 / 零跨组线(⛔ 没有第二层)
|
||||
PASS 导航七项与用户口径逐字一致、顺序相同:首页 / 选题 / 创作 / 投放 / 复盘 / 账号 / 资产(资产排最后)
|
||||
PASS 七页一次点击可达:侧栏 7 个功能项直达(⛔ 已撤销「功能入口」那一层,跨页入口只留在侧栏与板块内行级动作)
|
||||
PASS 侧栏基准形态:64px 药丸浮栏、导航项 56×78、图标在上(24px)名字在下(两字常驻);≤640 回横滚标签条
|
||||
PASS 页面级刷新:七页各 1 个 icon 按钮挂在页面标题行右侧(无文字、带 title/aria-label),⛔ 不再独立占一行
|
||||
PASS 清单里每个 ID 都在页面上出现过(90 个,无悬空声明)
|
||||
PASS 页面上每个 data-act 都在清单里(共 683 次出现,无未登记的可点元素)
|
||||
PASS 清单里 86 个 ID 都真驱动过并给出可见反馈,0 个死控件(25 个场景,每个实例各重置一次)
|
||||
PASS 当刻被禁用的控件 4 个(按契约在特定条件下不可点):P4-03, P5-06, P6-03, R-02
|
||||
PASS 清单里每个 ID 都至少被驱动过一次(无「从未跑过」的条目)
|
||||
PASS 侧栏 7 个功能项逐个点过,每一项都落到了自己那一页
|
||||
PASS 五处「输入后才可用」的联动都通:其中 5 处在空输入时确实是禁用的 → 输入后转可用 → 点了有反应
|
||||
PASS P7「确认与改判」是回写的**前置开关**:未采纳时回写禁用、采纳后转可用(不是只留痕)
|
||||
PASS 工具型纪律:零 .eyebrow / 零 .lead / 零 .hero
|
||||
PASS 入场编排不做逐区块:@keyframes 共 0 处
|
||||
PASS 骨架冻结:七页 39 个板块的数量与顺序与新版 2b「业务板块清单」逐位一致,⛔ 未增删挪
|
||||
PASS 页面公共框架(Page Shell):七页各恰好 1 个,且都不带 .block / 不带 .block-head h2 ⇒ 不计业务板块数、不占冻结计数
|
||||
PASS 对象冻结:七页 39 个业务板块各带一个核心业务对象,取值全在 11 对象字典内(或显式「—」+说明),且与 OBJ_MAP 逐块一致
|
||||
PASS 功能 ↔ 板块一一对应:14 条功能各自落到归属页的板块上,39 个板块每个至少挂一条功能(无悬空、无孤立)
|
||||
PASS 辅助入口区:每页最多 1 个跳转入口 ⇒ ⛔ 没有把流转表在框架层重写一遍
|
||||
PASS 「功能入口」那一层已撤销:.sect-nav / .data-card / .data-cards 在七页**逐页**出现 0 次(2b §九第 2 条)
|
||||
PASS 结构 ①:七页各一个 h1,标题逐级不跳;每个板块都有文字标题
|
||||
PASS 结构 ②:字号 12/14/18/20/24px 共 5 档,相邻差 2/4/2/4,正文档 14–16 在用
|
||||
PASS 结构 ④:逐页查过,首屏同屏主档按钮 ≤1 个;本页实底按钮 1 种
|
||||
PASS 组件口径:七页都没有用内联 style 表达选中态或覆盖字号(选中态走 .is-on / .is-active,字号走 --fs-* 档)
|
||||
PASS 交互态与可读性::hover / :focus-visible 都在且没被 outline:none 抹掉;tabular-nums、prefers-reduced-motion、防溢出三件套齐全
|
||||
PASS 阴影:面板/卡片都用多层叠层,无单层死黑重阴影
|
||||
PASS 间距:flex/grid 的 gap 取值全部落在登记刻度内(9 个刻度)
|
||||
PASS 浮层「随手记」中性关闭出口 = 1(右上 ×)|另有决策型关闭 1 个(R-03)
|
||||
PASS 浮层「随手记」打开后焦点在层内(当前=X-close)
|
||||
PASS 浮层「随手记」连按 8 次 Tab,焦点始终锁在层内
|
||||
PASS 浮层「随手记」Esc 能关
|
||||
PASS 浮层「随手记」关掉后焦点回到触发件 G-06
|
||||
PASS 浮层「随手记」点遮罩能关
|
||||
PASS 浮层「两处假设说明」中性关闭出口 = 1(右上 ×)|另有决策型关闭 0 个
|
||||
PASS 浮层「两处假设说明」打开后焦点在层内(当前=X-close)
|
||||
PASS 浮层「两处假设说明」连按 8 次 Tab,焦点始终锁在层内
|
||||
PASS 浮层「两处假设说明」Esc 能关
|
||||
PASS 浮层「两处假设说明」关掉后焦点回到触发件 G-08
|
||||
PASS 浮层「两处假设说明」点遮罩能关
|
||||
PASS 浮层「资产选择器」中性关闭出口 = 1(右上 ×)|另有决策型关闭 1 个(PICK-CANCEL)
|
||||
PASS 浮层「资产选择器」打开后焦点在层内(当前=X-close)
|
||||
PASS 浮层「资产选择器」连按 8 次 Tab,焦点始终锁在层内
|
||||
PASS 浮层「资产选择器」Esc 能关
|
||||
PASS 浮层「资产选择器」关掉后焦点回到触发件 P4-04
|
||||
PASS 浮层「资产选择器」点遮罩能关
|
||||
PASS 浮层「发布二次确认」中性关闭出口 = 1(右上 ×)|另有决策型关闭 1 个(P5-10)
|
||||
PASS 浮层「发布二次确认」打开后焦点在层内(当前=X-close)
|
||||
PASS 浮层「发布二次确认」连按 8 次 Tab,焦点始终锁在层内
|
||||
PASS 浮层「发布二次确认」Esc 能关
|
||||
PASS 浮层「发布二次确认」关掉后焦点回到触发件 P5-08
|
||||
PASS 浮层「发布二次确认」点遮罩能关
|
||||
PASS 浮层「核销二次确认」中性关闭出口 = 1(右上 ×)|另有决策型关闭 1 个(CHECKOUT-CANCEL)
|
||||
PASS 浮层「核销二次确认」打开后焦点在层内(当前=X-close)
|
||||
PASS 浮层「核销二次确认」连按 8 次 Tab,焦点始终锁在层内
|
||||
PASS 浮层「核销二次确认」Esc 能关
|
||||
PASS 浮层「核销二次确认」关掉后焦点回到触发件 P7-11
|
||||
PASS 浮层「核销二次确认」点遮罩能关
|
||||
--- 数值取证(布局视口 1440 × 900 ;window.innerWidth 1440)---
|
||||
PASS 对比度 --warn 对 --surface = 5.93:1(契约 ≥4.5:1)
|
||||
PASS 对比度 --accent-text 对 --surface = 4.76:1(契约 ≥4.5:1)
|
||||
PASS 对比度 --ink-faint 对 --surface = 3.55:1(契约 ≥3:1)
|
||||
PASS 强调色填充面积占比:七页最高 创作台 = 0.52%(1 个填充块,契约 ≤5%)
|
||||
量尺寸时滚动零点(P1):window 0 / html 0 / body 0 / .view 0
|
||||
PASS 量尺寸前四个滚动容器都停在零点(P1)
|
||||
PASS P1 账号矩阵:首屏从 626px 起,行距 31px,一屏装得下 8 行(契约 ≥6 行/900px 高,实测宽 1440)|示意数据 5 条
|
||||
PASS P1 账号矩阵行高齐:31–31px,差 ≤2px
|
||||
PASS P1 实际在用字号档 5 档:12px / 14px / 18px / 20px / 24px(契约 ≥3)
|
||||
量尺寸时滚动零点(P2):window 0 / html 0 / body 0 / .view 0
|
||||
PASS 量尺寸前四个滚动容器都停在零点(P2)
|
||||
PASS P2 对标内容列表:首屏从 462px 起,行距 31px,一屏装得下 14 行(契约 ≥6 行/900px 高,实测宽 1440)|示意数据 5 条
|
||||
PASS 横向溢出 = 0(scrollWidth 1440 = clientWidth 1440)
|
||||
PASS 七页逐页查横向溢出:全为 0(最差 p1)
|
||||
PASS 纵向滚动只由主区承担:.app 高 900px = 视口 900px;body 未承担滚动;主区 overflow-y auto,clientH 851 / scrollH 1392px(内容更高 ⇒ 主区可滚,折叠线以下的块拿得到)
|
||||
(附)P1 行高 31/31/31/31/31px · 量时 scrollY=0 · 顶栏高 49px · 侧栏 64×606px · 主区 clientH 851 / scrollH 1392
|
||||
控制台报错:0 条
|
||||
```
|
||||
|
||||
**要盯的两条**(本轮两处改动各自对应的新判据,就嵌在上面第 15、16 行):
|
||||
|
||||
- 「**侧栏基准形态**:64px 药丸浮栏、导航项 56×78、图标在上(24px)名字在下(两字常驻);≤640 回横滚标签条」—— 治「栏宽 `128 → 64px` + 导航项由横排改竖排」这一处;
|
||||
- 「**页面级刷新**:七页各 1 个 icon 按钮挂在页面标题行右侧(无文字、带 title/aria-label),⛔ 不再独立占一行」—— 治「刷新由文字改 icon + 从独立行挪到标题行」这一处。
|
||||
|
||||
**再加三条照旧全 PASS 的**,用来证明「没动别的」:
|
||||
|
||||
- 「页集合正好七页」+「导航一层七项…零组标 / 零跨组线」—— 导航项**名与顺序、层数**一格未动;
|
||||
- 「骨架冻结:七页 **39** 个板块…逐位一致」—— 每页板块没增删挪;
|
||||
- 「清单里每个 ID 都在页面上出现过(90 个)」+「86 个 ID 都真驱动过…0 个死控件」—— 撤 `SP_LABEL` 文案、改按钮形态后,交互清单仍干净。
|
||||
|
||||
---
|
||||
|
||||
## 二、变异对照(27 条,27 / 27 通过)
|
||||
|
||||
做法:把原型复制一份、注入**一处已知的假病**,再跑一次自检 ⇒ 必须报红、且红在**预期的那一条**上。测完即删临时件。基线(未注入)= `PASS 80 / FAIL 0`。
|
||||
|
||||
> 为什么必须有这一节:一个永远 PASS 的自检等于没有自检。只有「注病 → 报红 → 复原 → 回绿」这条链走通了,上面那 80 个 PASS 才算证据。
|
||||
|
||||
| # | 注入的假病 | 结果 | 红在哪 |
|
||||
|---|---|---|---|
|
||||
| M1 | 掏空 `P2-01` 的实现(点了没反应) | 79/1 ✅ | P2-01 |
|
||||
| M2 | P2 表里塞一个没登记的 `data-act` | 78/2 ✅ | 未登记的 data-act |
|
||||
| M3 | 清单里声明一个页面上没有的 ID | 78/2 ✅ | 声明了但页面里没有 |
|
||||
| M4 | 给 P3 多塞一个板块 | 78/2 ✅ | 骨架与②段不一致 |
|
||||
| M5 | 把 `--t-ink-faint` 调到契约线以下 | 79/1 ✅ | 对比度 |
|
||||
| M6 | `go()` 退回「只改 hash」 | 78/2 ✅ | 驱动了没反应 |
|
||||
| M7 | 只把 P1 表第一行撑高 | 79/1 ✅ | 行高不齐 |
|
||||
| M8 | 表格行内衬 `4px → 36px` | 78/2 ✅ | 低于契约 6 行 |
|
||||
| M9 | 量 P1 前先把主区滚下去 | 79/1 ✅ | 没回零点(视口 768×900) |
|
||||
| M10 | 给页框架副标题挂 `.lead` | 79/1 ✅ | 出现禁用类名 |
|
||||
| M11 | 去掉浮层遮罩 | 73/7 ✅ | 没有遮罩 |
|
||||
| M12 | `closeLayer` 退回「只清状态」 | 75/5 ✅ | 关掉后焦点没回到 |
|
||||
| M13 | 每个浮层头部多加一颗 × | 75/5 ✅ | 中性关闭出口 = 2 |
|
||||
| M14 | `.app` 高度退回 `min-height:100vh` | 79/1 ✅ | 高度链没约束住 |
|
||||
| M15 | 分段控件加回内联 `border-color` | 79/1 ✅ | 内联 style 越权 |
|
||||
| M16 | 导航第一项「首页」改成「首业」 | 79/1 ✅ | 导航项与用户口径不一致 |
|
||||
| M17 | P1「账号矩阵」的对象改成字典外的名字 | 79/1 ✅ | 对象冻结出错 |
|
||||
| M18 | P1 塞回一个 `.sect-nav` | 79/1 ✅ | 功能入口层的残留 |
|
||||
| M19 | P1 页标题改成「矩阵总揽」 | 79/1 ✅ | 页标题 |
|
||||
| M20 | 注释掉 `paint()` 里的 `focusIntoLayer()` | 75/5 ✅ | 打开后焦点不在层内 |
|
||||
| M21 | 往侧栏塞回一个 `.nav-group` 容器(第二层复活) | 79/1 ✅ | 组标与跨组残留 |
|
||||
| M22 | 把 P8 加回页面表(独立页复活) | 77/4 ✅ | 页面集合不是七页 |
|
||||
| M23 | F12 的归属页从复盘改成投放(归属漂移) | 79/1 ✅ | 功能与板块对不上 |
|
||||
| M24 | 摘掉 P4「录制卡片与画板」挂的 F14(悬空功能) | 79/1 ✅ | 功能与板块对不上 |
|
||||
| **M25** | **把 `--nav-w` 改回 `128px`**(本轮新增判据的对照) | 79/1 ✅ | 侧栏没回到基准形态 |
|
||||
| **M26** | **把 `.nav-item` 的 `flex-direction` 从 `column` 改回 `row`**(本轮新增判据的对照) | 79/1 ✅ | 侧栏没回到基准形态 |
|
||||
| **M27** | **往 Page Shell 里塞回一个 `.page-shell-ops` 文字行**(本轮新增判据的对照) | 79/1 ✅ | 刷新按钮没改对 |
|
||||
|
||||
**V5 新增三条的用意**:M25 盯**宽度**、M26 盯**形态**(竖排 vs 横排)、M27 盯**位置**(标题行 icon vs 独立成行)—— 三条各管一处,⛔ 不互相覆盖。⚠️ 每条形态类判据都要防「只测一个维度就以为测全了」:M25 与 M26 是**同一串判据的两条分支**,得分着证。
|
||||
|
||||
**一处随改动而动的旧条目**:M22 的 FAIL 数由 V4 的 3 条变成 **4 条** —— 因为本轮新增的「页面级刷新」判据会遍历页面集合,P8 复活时它也跟着报红。⇒ 这说明新判据**确实接到了同一张页面表上**,不是摆设。
|
||||
|
||||
**V4 对 M15 的处置(沿用)**:M15 的注入点是「P2 选题库那个分段控件」。V4 那轮 P2 选题库从**一个**分段控件变成**两个**(进度 + 类型),注入点仍落在第一个上 ⇒ 照旧报红(`内联 style 越权`)。⚠️ **形态一改,注入点要复核** —— 本轮又改了两处(侧栏、刷新按钮),复核过:M1–M24 的注入点全部未受影响,逐个实跑仍能命中。
|
||||
|
||||
### 2.1 M22 返工两次 —— 「注入点写坏」与「判据报红」是两件事(沿用上一轮留痕)
|
||||
|
||||
第一次 `❌ 注入后自检跑不出来(连输出都没有)`。查下来**不是判据不灵,是注入点写坏了**:
|
||||
|
||||
1. **第一版**:只往 `PAGES` 里塞了个 `p8` 键,没配渲染函数 ⇒ 自检第 1 步渲染 p8 时 `PAGE_FN['p8']` 是 `undefined`,渲染期直接抛错。
|
||||
2. **第二版**:补了渲染器,但没在 `STATE_COPY` 里登记 ⇒ 自检第 2 步「六态 × 页面」走到 `statePanel('p8')`,读 `STATE_COPY['p8'].loading` 报 `TypeError: Cannot read properties of undefined`。
|
||||
3. **第三版(现在这版)**:改在**启动行**注入 —— 那时 `PAGES` / `PAGE_FN` / `STATE_COPY` 三张表都已就位 ⇒ 报红且红在「页面集合不是七页」。
|
||||
|
||||
**顺带修了一处取证盲区**:原来 `renderSelftest()` 的兜底分支渲染的块**不带 `id="selftest-out"`** ⇒ 自检一崩,取证工具什么都读不到,变异对照只会得到一句「连输出都没有」,**分不清是注入点坏了还是自检自己炸了**。现在崩了也照正常格式吐一个 `#selftest-out`(head 行写 `PASS 0 / FAIL 1`,正文写栈)。
|
||||
|
||||
---
|
||||
|
||||
## 三、闸门脚本(`_tools/`,共 8 个)
|
||||
|
||||
| 脚本 | 判据 | 本轮结果 |
|
||||
|---|---|---|
|
||||
| `check_js.py` | `<script>` 段过 `node --check`;模板里的 HTML 注释不许出现反引号 | ✅ `PASS 语法:<script> 段 1494 行,node --check 通过` + `PASS 模板里的反引号…不含反引号` ⇒ 全过 |
|
||||
| `check_skeleton.py` | ②段 `2b` §五 ↔ 原型 `FROZEN` 表,逐页逐位比(板块**数**相等、**顺序**相等、剥掉「(…)」注解后**逐字相同**) | ✅ `PASS 骨架冻结:七页 39 个板块,②段 2b-界面布局-新版.md §五 与原型 FROZEN 表逐页逐位一致` |
|
||||
| `run_viewports.py` | 16 档逐视口|一屏行数 ≥6(`layouts-tooling.md` §1,⛔ 不分档) | ⚠️ `逐视口:不达标 2 / 共 16`(见 §五,由 V4 的 3 档降下来) |
|
||||
| `mutate_test.py` | 27 条变异,每条都要求报红在预期处 | ✅ `变异对照:27 / 27 通过`;基线 `PASS 80 / FAIL 0` |
|
||||
| `run_shots.py` | 出 `_gate_shots/*.png` 视口帧(⛔ 不出整页长图) | ✅ `视口帧:成功 17 / 失败 0 / 共 17`;落盘 **16 个 PNG**(`P1-1440` 被「逐页」与「断点」两个循环各出一次、同名覆盖),PNG 尺寸当场逐个比对通过 |
|
||||
| `cap.py` / `grab_selftest.py` | 单标签复用 + 自检轮询取值(IPC 读超时 5s,⛔ 不能 `wait_for_load`) | ✅ 两个跑通,无卡死 |
|
||||
| `tab_close.py` | 收工清场 | ✅ 收工前已跑(见 §八) |
|
||||
|
||||
**`check_js.py` 为什么单拎一条**:JS 模板字符串里的 HTML 注释不许出现反引号 —— 会提前闭合模板字面量、整页静默白屏,而 `node --check` **报不出来**。这条已经踩过四次。本轮改了 `shell()` 的返回拼接、`pageP4()` 的标题行、`refreshBtn()` 三处 ⇒ **改完先跑它**(全过),再往下走。
|
||||
|
||||
---
|
||||
|
||||
## 四、骨架冻结的反向变异(改②段副本、看闸门是否报红,验完即还原)
|
||||
|
||||
`check_skeleton.py` 的判据能在**正向**报 PASS,不代表它有牙齿。本轮**骨架一格未动**(`FROZEN` 与 `2b` §五 都没改),但判据要证明还活着 ⇒ **重做**四个方向的反向变异。做法:把 `2b` 拷成临时副本、在副本上注病、`check_skeleton.py --doc <副本>`,⛔ 原文件一个字节未动,测完即删副本。
|
||||
|
||||
| # | 改什么 | 期望 | 实得 |
|
||||
|---|---|---|---|
|
||||
| ① 板块名漂移 | ②段 P2 第 4 块「选题库」→「选题仓库」 | 报红 | ✅ `FAIL p2 第 4 块 ②段「选题仓库」≠ 原型「选题库」` |
|
||||
| ② 板块数漂移 | ②段 P2 删掉第 4 块 | 报红 | ✅ `FAIL p2 板块数 ②段 3 ≠ 原型 4`(并列出两侧清单) |
|
||||
| ③ 顺序漂移 | ②段 P6 第 2、3 块对调(平台账号 ↔ 画像五维) | 报红 | ✅ `FAIL p6 第 2 块 ②段「平台账号」≠ 原型「画像五维」`(第 2、3 块各报一条) |
|
||||
| ④ 命名再漂移 | ②段 P2 第 4 块「选题库」→「素材池」 | 报红 | ✅ `FAIL p2 第 4 块 ②段「素材池」≠ 原型「选题库」` |
|
||||
|
||||
全 4 条报红,脚本收在 `_scratch/reverse_skeleton.py`(⛔ 只读原文件、只写副本)。
|
||||
|
||||
> ⚠️ **注一条假病、验完还原** 是这一步的纪律。有一个真实教训:`check_naming.py` 曾因 stale 变量(该用 `tt` 用了 `old`)导致「旧名提示」**恒不触发**(假绿)—— 判据写得再漂亮,不做变异对照就是自欺。
|
||||
|
||||
---
|
||||
|
||||
## 五、逐视口表(16 档 · V5 整表重跑)
|
||||
|
||||
契约:一屏可见行数 **≥6 / 900px 高**,⛔ 不分档。`P1 顶` = P1「账号矩阵」首行距视口顶的像素。全部走 CDP 声明式视口(只连 `9223` 已有实例,⛔ 不另起)。
|
||||
|
||||
| 视口 | 自检 | P1 首行顶 | 行距 | P1 行数 | P2 行数 | 顶栏 | 侧栏 | 判定 |
|
||||
|---|---|---|---|---|---|---|---|---|
|
||||
| 1440×900 | 80/0 | 626px | 31px | 8 | 14 | 49px | 64×606 | ✅ |
|
||||
| 1280×900 | 80/0 | 626px | 31px | 8 | 14 | 49px | 64×606 | ✅ |
|
||||
| 1024×900 | 80/0 | 626px | 31px | 8 | 14 | 49px | 64×606 | ✅ |
|
||||
| 1000×900 | 80/0 | 626px | 31px | 8 | 14 | 49px | 64×606 | ✅ |
|
||||
| 960×900 | 80/0 | 626px | 31px | 8 | 14 | 49px | 64×606 | ✅ |
|
||||
| 920×900 | 80/0 | 626px | 31px | 8 | 14 | 49px | 64×606 | ✅ |
|
||||
| 901×900 | 80/0 | 626px | 31px | 8 | 14 | 49px | 64×606 | ✅ |
|
||||
| 900×900 | 80/0 | 618px | 31px | 9 | 14 | 49px | 64×606 | ✅ |
|
||||
| 840×900 | 80/0 | 618px | 31px | 9 | 14 | 49px | 64×606 | ✅ |
|
||||
| 820×900 | 80/0 | 618px | 31px | 9 | 14 | 49px | 64×606 | ✅ |
|
||||
| 768×900 | 80/0 | 618px | 31px | 9 | 14 | 49px | 64×606 | ✅ |
|
||||
| 700×900 | 80/0 | 618px | 31px | 9 | 14 | 49px | 64×606 | ✅ |
|
||||
| 640×900 | 80/0 | 671px | 31px | 7 | 12 | 49px | 640×53 横滚标签条 | ✅ |
|
||||
| 560×900 | 80/0 | 686px | 31px | 6 | 12 | 49px | 560×53 横滚标签条 | ✅ |
|
||||
| **500×844** | 79/**1** | 686px | 31px | **5** ❌ | 10 | 49px | 500×53 横滚标签条 | ❌ |
|
||||
| **390×844** | 79/**1** | 779px | 31px | **2** ❌ | 6 | 49px | 390×53 横滚标签条 | ❌ |
|
||||
|
||||
**绿 14 档 / 红 2 档**(`run_viewports.py`:`逐视口:不达标 2 / 共 16`)。行距在所有档恒为 `31px`、行高齐(差 ≤2px)⇒ 红只出在 **P1 首行顶太高**(626 → 779px)。
|
||||
|
||||
🔴 **这张表是 V5 整表重跑的,⛔ 不是沿用 V4。** 与 V4 逐格差在哪、为什么差,见 §5.1。
|
||||
|
||||
> ⚠️ **`390×844` 能测 ≠ 达标**:它是契约要求留档的第二个视口,帧已出(`P1-390.png`,尺寸 `390×844` 当场比对通过),但 P1 只装 2 行。P2 该档 6 行,刚好过线。
|
||||
|
||||
### 5.1 红档成因(V5 重订 —— 两处改动各管一个方向)
|
||||
|
||||
V4 那轮是三档红(`560×900` / `500×844` / `390×844`)。V5 把 `560×900` 拉回绿(P1 由 5 行升到 **6 行**),只剩两档。变化是两处改动**各管一个方向**叠出来的:
|
||||
|
||||
- **撤掉「页面操作区」那一行** ⇒ 影响的是**纵向量**。原来标题行下面单开一行放刷新按钮(按钮 `32px` + 下边距 `12px` ≈ `44px`),现在这一行没了 ⇒ **P1 首行顶逐档下移 `43~52px`**(`669…822` → `626…779`),宽档行数由 7 升到 **8~9**。
|
||||
- **侧栏 `128 → 64px`** ⇒ 影响的是**横向量**。主区宽了 64px,满宽表格列跟着变宽 ⇒ **P2 行数由 12 升到 14**;`560×900` 的 P1 也因横向宽松、少了一次列换行,由 5 行升到 6 行。
|
||||
|
||||
**两档仍红的原因**:`500×844` 与 `390×844` 的 P1 首行顶是 `686 / 779px`,而视口高只有 `844px` ⇒ 减去行距 `31px`,一屏只剩 5 行 / 2 行,装不下 6 行。这是**窄屏的 Page Shell 逐层堆叠把首行顶抬太高**,与栏宽无关。
|
||||
|
||||
⚠️ **别把这条读反**:V2/V3 那句「侧栏宽度不是首行顶的成因」**在 V5 仍成立** —— 首行顶由 Page Shell 层数与操作行决定,跟栏宽无关;本轮首行顶的变化**来自撤掉操作行**,不是来自栏宽。V5 新增的细分只有一句:**栏宽影响横向量(P2 行数),不影响纵向量(P1 首行顶)**。⛔ 不要写成「V5 里栏宽终于影响首行顶了」。
|
||||
|
||||
### 5.2 一个数字错误,当场改掉并记账(V3 留痕,V4/V5 沿用)
|
||||
|
||||
改②段(V3 那轮)时曾把板块总数写成 **41**(「P7 由 6 块变 10 块 ⇒ 39 → 41」)—— 这是**算错了**:P8 那 4 块搬进 P7,是**搬位置不是新增**,总数净变化为 0。真值由 `check_skeleton.py` 数出来是 **39**。
|
||||
|
||||
🔴 **V5 再数一遍**(骨架未动,逐页数应与 V4 同):`p1 5 / p2 4 / p3 4 / p4 6 / p5 5 / p6 5 / p7 10` = **39**。加总当面列出来可复核,⛔ 不写「仍是 39」就完事。
|
||||
|
||||
---
|
||||
|
||||
## 六、本轮动过的地方(逐条:现象 / 根因 / 证据 / 处置)
|
||||
|
||||
| # | 现象 | 根因 | 证据 | 处置 |
|
||||
|---|---|---|---|---|
|
||||
| 1 | 侧栏宽 `128px`,是按「最长项名 2 字 + 徽章 + 余量」推出来的,不是设计供给的基准 | 用户令「左侧导航改回去」+ 设计供给有明文基准 | `design-system-tiaoyue/SKILL.md` 行 95:「左侧栏(`app-sidebar`,宽 `w-16`)」⇒ `w-16` = `64px`;第八轮实测值「栏 64/内衬 3/圆角 100」 | `--nav-w` 由 `128px` 改 `64px`;`.sidebar` 内衬 `8 → 3px`、圆角 `24 → 100px`;旧注释里「按最长项名推宽度」那段一并撤掉 |
|
||||
| 2 | 导航项是横排(图标在左、名字在右) | 基准形态要的是**图标在上、名字在下** | 第八轮实测值「项 56×78/字 12px-500-行高 16」 | `.nav-item` 由 `flex-direction:row` 改 **`column`**;图标 `20 → 24px`;项高 `40 → 78px`;字号字重行高改 `12px/500/16`;名字**双字常驻**(改回竖排后没有「放不下」的问题),说明走悬停提示 |
|
||||
| 3 | `≤640` 的横滚标签条里,导航项一旦竖排就会变高、一行放不下 | 媒体查询里的 `.nav-item` 规则跟着 `.nav-item` 一起变了 | 自检「侧栏基准形态…≤640 回横滚标签条」 | `@media (max-width:640px)` 里给 `.nav-item` 补回**横排小标签**(`flex-direction:row`、高 `36px`、内衬 `0/12`),与 V4 外观一致 |
|
||||
| 4 | 计数徽章原来在名字右侧,名字改成常驻后会与名字重叠 | 竖排后名字占满整宽,右侧没位置 | 截图 `P1-1440.png` 当场比对 | 徽章改 `position:absolute` 悬**右上角**(`top:6px/right:4px`),不挤名字 |
|
||||
| 5 | 刷新是**文字按钮**(「刷新矩阵」等七条文案,在 `SP_LABEL` 里) | 用户令「刷新按钮用 icon 按钮就行」 | 用户原话(2026-10-10)+ 原型 `SP_LABEL` 常量 | 新增 `.btn-icon`(方形、只放图形);新增 `refreshBtn(page)` 输出一颗刷新 `svg`;七条文案常量撤掉 |
|
||||
| 6 | 刷新按钮**独立占一行**(`.page-shell-ops`),把 P1 首行顶抬高约 `44px` | 用户令「一般和小标题一行、右对齐」 | 用户原话「刷新按钮用 icon 按钮就行,一般和小标题一行、右对齐」 | 撤 `.page-shell-ops` 那一行;改 `.shell-refresh`(`margin-left:auto` 靠右)挂进 `.page-shell-title`;`shell()` 与 `pageP4()` 的标题行同步 |
|
||||
| 7 | 文字标签撤了,得让读屏与悬停还知道这颗按钮干什么 | 纯图标按钮会丢语义 | 自检「页面级刷新…带 title/aria-label」 | 按钮带 `title="刷新本页数据"` + `aria-label="刷新本页数据"`;`svg` 加 `aria-hidden="true"` |
|
||||
| 8 | ②段 `2b` §四 把「页面操作区」列为 Page Shell 第 3 样,与原型不再一致 | 原型已撤那一行,②段还写着有 | `2b` §四 原文与七页框架行 | §四 由「**四样**」改「**三样**」,第 3 条撤销、页面级动作并入第 1 条(标题行右侧);七页框架行统一改「页面标题区(右侧挂刷新 icon)+ …」;加一条 🔴 说明「以后页面级动作同此处理,⛔ 不再单开一行」 |
|
||||
|
||||
---
|
||||
|
||||
## 七、与上一版(V4 原型)的实质差别
|
||||
|
||||
1. **侧栏宽 `128 → 64px`**(`--nav-w`);相对 V4 是一处**显式回退到基准**,不是微调。
|
||||
2. **导航项形态由「横排」改「竖排」**:图标在上 `24px`、名字在下 `12px/500/行高 16`、项 `56×78`、名字**双字常驻**。
|
||||
3. **侧栏内衬 `8 → 3px`、圆角 `24 → 100px`**(药丸浮栏的真形态);计数徽章改悬右上角。
|
||||
4. **页面级动作不再独立占一行**:撤 `.page-shell-ops`(七页各一行)。
|
||||
5. **刷新控件由文字按钮改 icon 按钮**(`.btn-icon` + `refreshBtn()` 输出 `svg`)。
|
||||
6. **`SP_LABEL` 七条文案作废**,语义改走 `title` / `aria-label`。
|
||||
7. **自检 78 → 80 项**(新增「3b-2 侧栏基准形态」「3b-3 页面级刷新=标题行 icon」两条)。
|
||||
8. **变异 24 → 27 条**(新增 M25 宽度/M26 形态/M27 位置,27 / 27 全过、基线回绿)。
|
||||
9. **逐视口不达标由 3 档降到 2 档**(`560×900` 转绿);P1 首行顶逐档下移 `43~52px`(`669…822` → `626…779`);宽档 P1 行数 7 → 8~9;P2 行数 12 → 14。
|
||||
10. **②段 `2b` §四 由「四样」改「三样」**(撤「页面操作区」并并入标题行),七页框架行同步。
|
||||
11. **未动清单(逐条写出来,方便对着查)**:页面数仍 **7**、导航项**名与顺序**照用户口径(首页/选题/创作/投放/复盘/账号/资产)、每页板块数不变(仍 **39**)、流转契约 **20 条**不变、令牌与几何**除侧栏那三处外一格未动**;`2a-产品功能-新版.md` 本轮**未改**(本轮不涉功能)。
|
||||
|
||||
---
|
||||
|
||||
## 八、遗留与待裁定(⛔ 不粉饰)
|
||||
|
||||
1. **窄屏两档密度红**(`500×844` P1 5 行/`390×844` P1 2 行)。已证明与侧栏宽度无关(§5.1:栏宽管横向量,不管首行顶。窄屏成因是 Page Shell 逐层堆叠抬高首行顶)。是否动窄屏断点,**待用户裁定**,本棒不擅自改。
|
||||
2. **「满宽表格」与「一屏 ≥6 行」在窄屏不可兼得** —— 沿用上一版登记,未动。
|
||||
3. **P7 现在是一页两个主操作**(复盘那半「确认归因并回写」/记录那半「核销一条记录」)。②段 §五 P7 已写死「10 块平铺、不划子区、属发布之后看数据与看收入一类」,用户口径是**不拆**。⚠️ 两个主操作是并页带来的形态,`DESIGN.md` §2.5 写了「同屏只出当前上下文那一个」,本棒按此实现。
|
||||
4. **两处假设仍未获用户结论**(沿用):P1 的形态(待复核第 5 条)、P7 后半段「商单与收支」要不要进第一版(待复核第 6 条 + A3)。原型的「假设」徽章(`G-08`)可点开看复核人 / 时机 / 落点。
|
||||
5. **定时发布挂起**(沿用):按用户口径本轮不落,等真做投放功能时再议(`2a` §九 第 7 项/`2b` §十 第 7 项)。
|
||||
6. **3c GPT 参考版本轮不做** —— 派活单明令不许向外发送本项目内容(红线优先于流程)⇒ 「未取得参考版 ≠ 已通过」,此处明示。
|
||||
7. 🔴 **目标目录名有一处分歧(沿用同型处置,未擅自动手)** —— 派活单写的目标目录是 `执行会话/目标-左侧导航改回基准形态 64px 图标在上-41c8bd/`(派活单口径),而机制按 `goal.json` 推出的是 `执行会话/目标-侧栏改回64px基准形态并刷新按钮改ic-20a8ac/`(机制口径:`title[:20]` 去空格 + `sha1(title)[:6]`)。本棒产物落在**机制口径**那个目录里 —— 因为 `goal.json.execution_doc` 是**目标检查会话判断目标状态的唯一依据**,落错地方检查会话就看不见。
|
||||
- 本棒的处置:按机制口径落盘,⛔ 不改名、⛔ 不另建目录(改名会断台账 `artifact` 引用,另建会多一个没人认领的空壳)。
|
||||
- 待用户裁定:正式归档搬进 `docs/pm/mcn-shortvideo-agent/` 时,按哪种口径命名目标目录。
|
||||
8. 🔴 **浏览器保活方式与派活单不一致(本轮据实留痕)** —— 派活单写「计划任务 `bh-chrome-keepalive` 保活」,但该计划任务本机 **2026-10-10 已撤销**;`browser-harness/SKILL.md` §1 现写「**只许本会话后台任务**这一种方式」。本轮按磁盘现行纪律走(本会话后台任务),⛔ 未建计划任务。⇒ 读到「计划任务保活」时以本机磁盘现行纪律为准。
|
||||
|
||||
---
|
||||
|
||||
## 九、说人话自评(本份文字部分;判据源 `humanizer-zh`,五维各 10 分)
|
||||
|
||||
| 维度 | 分 | 说明 |
|
||||
|---|---|---|
|
||||
| 直接性 | 10 | 开篇就点明「本轮只动两处」,§六 逐条给「现象 / 根因 / 证据 / 处置」;§5.1 一上来就把「两处改动各管一个方向」说破 |
|
||||
| 节奏 | 9 | 表格与叙述交替,§5.1 用叙述把「为什么栏宽这次似乎起作用了、其实不是」讲透,没有堆表 |
|
||||
| 信任度 | 10 | 逐视口整表重跑并给出与 V4 的逐格差异;两档红如实登记、不粉饰;浏览器保活与派活单不一致的地方主动写明 |
|
||||
| 真实性 | 10 | 每条都挂现取证据(自检行号 / 变异编号 / 实测像素 / 脚本名);39 的逐页加总当面列出可复核;M22 的 FAIL 数变化也点出来 |
|
||||
| 精炼度 | 8 | 自检全文占了整节(87 行)—— 刻意留的原始凭据,但确实占地方,⚠️ 扣分点 |
|
||||
| **总分** | **47 / 50** | 门槛 ≥45 ⇒ 过 |
|
||||
|
||||
*(判据源:`E:/ProgramData/.workbuddy/skills/humanizer-zh`;门槛 45/50。⛔ 取不到来源时明写「无判据来源,本项未判」—— 本份取到了。)*
|
||||
@@ -0,0 +1,459 @@
|
||||
# MCN 短视频整合营销工作台 · DESIGN.md(V4 · 八条口径落进②段两份与原型)
|
||||
|
||||
> 项目 slug:`mcn-shortvideo-agent` | ③段(界面交互)第 3a 子步产出
|
||||
> 本版是**第 6 步(把用户 2026-10-09~10-10 的八条口径落进②段两份与原型)**的绑定规范。⛔ 不是给 V3 打补丁,是按②段 V4 重出一版。
|
||||
> 落点:`执行会话/目标-把八条已定口径落进②段两份与原型-fa6e07/ui/DESIGN.md`(目标目录内;⛔ 未写域外 `docs/pm/`)。
|
||||
> 判据源:`product-planning/references/stage-delivery/SKILL.md`(含 §供给 / Gate-1)+ `references/execution-runbook.md` §2 + `references/layouts-tooling.md` §5.5。
|
||||
> V4 的口径原文:`执行会话/目标-征询GPT对当前七页结构与操作路径的建议-b49e02/用户口径裁决-5条回应.md`(2026-10-09)+ `执行会话/目标-分析social-auto-upload项目,用于投放页与发布对象的判断-0ec0a07/用户口径追加-账号是两个概念.md`(2026-10-10)。
|
||||
> 上一版原型只读对照:`执行会话/目标-导航改七项一层并重排功能归属(P8 并入复盘)-fc471a/ui/`(V3 原型与 `DESIGN.md`)。本版沿用其令牌与组件,⛔ 不覆盖 V3 文件。
|
||||
|
||||
---
|
||||
|
||||
## 〇、开工声明(声明制,四字段)
|
||||
|
||||
| 字段 | 内容 |
|
||||
|---|---|
|
||||
| 当前段与子步 | ③段 / 3a 视觉规范(D0 锚需求 → D1 定调 → Gate-1)→ 3b 原型 |
|
||||
| 主干与挡位 | 供给=`oil-ui-pro`(**基础层**)+ 叠加层(本段自带样式库 `design-system-tiaoyue` 定调与令牌 + 本段自有判据)。挡位 **标准** |
|
||||
| 依据文件 | `stage-delivery/SKILL.md` §供给 + §3a/§3b;`execution-runbook.md` §2;`layouts-tooling.md` §0/§1/§5.5;②段 `2a-产品功能-新版.md`/`2b-界面布局-新版.md` |
|
||||
| 产出落点 | `ui/DESIGN.md`(本份)、`ui/mcn-workbench.html`(3b)、`ui/_tools/`、`ui/_gate_shots/` |
|
||||
|
||||
### 供给核对(runbook §2.0 · 步 −1,每轮必做)
|
||||
|
||||
| 步 | 动作 | 结果 |
|
||||
|---|---|---|
|
||||
| −1 | 确认 §供给 三处在位 | ✅ `references/layouts-tooling.md`、`references/execution-runbook.md` 都在位;定调与令牌档在位 1 套 `assets/design-systems/design-system-tiaoyue/` |
|
||||
| −1b | 套名与上一版记录比对 | ✅ 上一版 `DESIGN.md` 选定 `design-system-tiaoyue`,本版**沿用同一套**(用户 2026-10-07 令「每次设计只选一套」)⇒ 不触发变更清单 |
|
||||
| −1c | 可选档是否动用 | ⛔ **未动用** `assets/open-design/`(随后续口径可选)。它独有的四项(反 AI 味 / 无障碍 / 表单校验 / 动效纪律)**本次无逐项数值供给来源** —— 见 §五 缺口 1,⛔ 没有凭感觉编一套顶上 |
|
||||
|
||||
### V4 本轮改了什么(六条 · 骨架与令牌一格未动)
|
||||
|
||||
1. **P2 选题库**:分组控件加一层**类型**维度(选题/对标线索/评论洞察/数据异动/灵感),与**进度**(待做/在写/已用)正交;选题行多一列「类型」。⛔ 不新增「待整理」状态。
|
||||
2. **P2 去掉「灵感速记」板块**(骨架 5 → 4 块):随手记本来就是全局可达的框架层入口(顶栏 `G-06`),写进来的东西落选题库。🔴 顺带订正 V3 遗留的一处文档打架(见 §五 缺口 8)。
|
||||
3. **P3 资产库**:页面职责由「存拆解结果」改成「**统一管理**」;入库不限页(P2 拆解结果可就地入库)。骨架仍 4 块。
|
||||
4. **P4 版本管理**:展开单位由「账号 × 平台」改成「**平台账号**」(一个平台账号一版)。
|
||||
5. **P5 目标选择改成两级**:先选内容账号,再勾它下面的平台账号(渠道);数据摘要区由「目标账号数/目标平台数」改成「**目标渠道数/覆盖平台数**」;各版本块写死「**一个平台账号一版**(一版一路)」。
|
||||
6. **P6**:画像六维收成**画像五维**(去掉「平台」这一维),**新增「平台账号」板块**(骨架 4 → 5 块):平台账号=发布渠道,每条带「平台 + 登录态 + 授权状态」,是内容账号下的子项(1 → N)。🔴 页面数、导航、流转 20 条**都不动**;业务板块总数仍是 **39**(P2 −1、P6 +1)。
|
||||
|
||||
### 页型判定(硬前置,SKILL.md §3b)
|
||||
|
||||
**全部 7 页都是工具型页面。** 依据:用户是天天来干活的 MCN 团队,每页都有人在里面完成一件事(决定先处理哪件 / 挑一条选题 / 存一条拆解 / 推一个环节 / 确认一次发布 / 改一份画像 / 写一条归因并核一条记录);没有一页是让人「看一眼就下决心」。
|
||||
⇒ 本份零 `.eyebrow`、零 `.lead`、零 `.hero`,且 `body.is-marketing` 之外的类名一个不设。与②段 `2b` §二「本产品是工具型页面,不是营销页」一致。
|
||||
|
||||
---
|
||||
|
||||
## 一、设计契约(十二个字段)
|
||||
|
||||
### 1.1 项目级字段
|
||||
|
||||
**① 主用户**:MCN 机构的内容负责人(矩阵级决策)、编导与文案(选题与创作)、剪辑与投放(版本与发布)。依据①段 `1c-用户画像.md`(零访谈画像 —— 局限已登记在旧版 §四缺口 4,本版沿用)。
|
||||
|
||||
**② 主操作**:**逐页唯一**,照②段 `2b` §五 各页「主操作」原样落,本段未改一个(逐页见 1.2)。
|
||||
|
||||
**③ 必要内容(核对面)**:②段信息分档表逐页核对,见 1.2。只做**落位核对**(主屏常驻=零点击可见,可点入=一次点击可达),⛔ 不以它为由增删档位。
|
||||
|
||||
**④ 重复项的信息量**:四个主列表(账号矩阵 / 对标内容 / 资产条目 / 发布记录)是**满宽表格**,每行除「主标识 + 动作」外都带次级信息,逐页列在 1.2。
|
||||
|
||||
**⑤ 结构骨架(翻译面)**:
|
||||
|
||||
- **骨架档:主区 + 侧区**。理由:一级导航覆盖 7 个目的地、宽屏 ≥1024;选定套的外壳本身就是「侧栏 + 主区」的应用型外壳,两者同构。
|
||||
- **导航层级:一层七项**(2026-10-09 按用户口径与 `2b` V3 §三 重做)。V2 做的是「3 个业务组 + 1 个跨组入口」,本版**把层级整个压平**:
|
||||
- 七项按用户给的先后:**首页(P1)/选题(P2)/创作(P4)/投放(P5)/复盘(P7)/账号(P6)/资产(P3,排最后)**。
|
||||
- ⛔ **零组标、⛔ 零跨组分隔线、⛔ 零第二层**。V2 的三个组标(找选题/走创作流水线/看矩阵复盘)与跨组线连同对应 CSS 一起删掉。
|
||||
- 项名**逐字取用户口径**(首页/选题/创作/投放/复盘/账号/资产);页面自己的名字不变(矩阵总览/选题雷达/资产库/创作台/发布中心/账号画像/复盘台)。最要紧的一处:**导航叫「投放」,页面仍叫「发布中心」** —— 这一页只管内容发布与排期,⛔ 没有扩功能。
|
||||
- 「资产排最后」是硬约束(用户明说);其余六项照用户给的先后。
|
||||
- ⚠️ V2 遗留的「组名与短名怎么对应」这项待确认随之作废(组没了);**新冒出一个问号**:七项是否要另配一套两字短名 —— 现已按用户口径直接用全名,⛔ 本段没替用户起短名。
|
||||
- **侧栏形态:药丸浮栏,宽 `64px`**(2026-10-10 用户令「左侧导航改回去」;V5 由 `128px` 改回设计供给的**基准形态**,相对 V4 是一处**显式改动**):
|
||||
- 依据:`design-system-tiaoyue/SKILL.md` 行 95 逐字「左侧栏(`app-sidebar`,宽 `w-16`)」⇒ `w-16` = `64px`;第八轮实测值(栏 `64`/内衬 `3`/圆角 `100`/项 `56×78`/字 `12px-500-行高 16`)。
|
||||
- V3 那条「按最长项名 2 字 + 徽章 + 余量」的推理不假,但它把栏做成了**横排**;用户令要的是**基准形态** ⇒ `128px` 与「图标在左、名字在右」一起推翻。
|
||||
- `64px` 栏里放不下横排 ⇒ 导航项改成**竖排**:图标在上(`24px`)、名字在下(**两字常驻**,说明走悬停提示)。项 `56×78`、内衬 `3px`、圆角 `100px`(药丸)。
|
||||
- 保住选定套的**圆角浮栏**性格(淡底、`1px` 淡描边、四周留白、随内容高、在列内垂直居中);⛔ 没有引入第二套配色或第二套圆角 —— 令牌全部来自 `design-system-tiaoyue`。
|
||||
- 品牌名在 `64px` 里放不下(顶栏已写全称)⇒ **侧栏只留标记并居中**,`.sidebar .brand-name` 隐藏。
|
||||
- ⚠️ **几何不在样式库内**(§供给 明写「自带样式库实测只到调色板级」)⇒ 栏宽是③段的判断,不是从包里抄的;取值按上条的基准实测值。改**一处** `--nav-w` 即可推翻(见 §七 修订记录 V5)。
|
||||
- **每页收口形态(七页统一)**:`页面公共框架(Page Shell)` → `业务板块若干(从上到下)`。⛔ 本版继续**不要**上一版那层「功能入口卡」(`.sect-nav` / `.data-cards` / `.data-card`):`2b` §一第 2 条与 §九第 2 条明令撤掉,它的文字本来就是流转表的副本。跨页入口只留在两处:**侧栏**(七页一次点击可达)与**业务板块内的行级动作**(流转表就落在那里)。
|
||||
- **密度目标:密集(8–32)**。理由:7 页都是一屏要放多行记录的工具型页面,`2b` P1 要求矩阵与今日待办**同时**常驻,宽松档放不下。同一页面只取这一档。
|
||||
- 块间距 ≥ 块内间距的 2 倍:块间 `32px`、块内 `8/12/16px` ⇒ 比值 2.0–4.0 ✅。
|
||||
|
||||
**⑥ 交互清单**:见 §二 表 2.4(逐元素四列)。**它是唯一的交互真相源** —— 3b 实测、自检、变异对照都引这一张,⛔ 不另建一份。
|
||||
|
||||
**⑦ 状态覆盖六项**:见 1.3,逐页逐项有结论。
|
||||
|
||||
**⑧ 组件来源**:优先沿用选定套既有组件族,其次自创。⛔ 未参考 `teamOnly: true` 的族。清单见 §二 表 2.5。
|
||||
|
||||
**⑨ 响应式行为**:
|
||||
|
||||
| 断点 | 布局怎么变 |
|
||||
|---|---|
|
||||
| `>1024` | 侧栏 `64px` 药丸浮栏常驻(⛔ 宽度不随断点变)+ 主区 `minmax(0,1fr)` |
|
||||
| `1001–1024` | 侧栏仍 `64px`;两栏分栏与满宽表格都不变;顶栏间距收到 `8px`;顶栏不折行 |
|
||||
| `901–1000` | 同上,另:统计条最小宽 `132 → 96px`(4 格不折行) |
|
||||
| `821–900` | 上述继续;另:两栏分栏 `.grid-main-side` → 单列(右栏被挤到 300px 以下就会折行) |
|
||||
| `641–820` | 上述继续;另:统计条、表格列宽由 `auto` 收窄,主区内衬 `32 → 16px` |
|
||||
| `≤640` | 侧栏**变成页头下方一条可横向滚动的标签条**(⛔ 不隐藏);导航项在这一档**还原成横排小标签**(图标+名字一行,⛔ 不竖排)、项高 `36px`;主区单列 |
|
||||
|
||||
**滚动容器**:整页不滚、**只有主区 `.view` 滚**。高度链三件套必须齐:`.app{height:100vh;grid-template-rows:minmax(0,1fr)}` + `.main{min-height:0;overflow:hidden}` + `.view{flex:1 1 auto;min-height:0;overflow:auto}`。少写一处 ⇒ 整页「滚不动」而不是「不滚」(上一版踩过并留档)。**判滚动四个容器都要核**:`window`/`html`/`body`/`.view`。
|
||||
|
||||
**⑩ 明确拒绝的模式**(≥3 条,每条可判定):
|
||||
|
||||
1、⛔ 不出现「眉标/大标题/灰色副标题」三段式标题区(判据:DOM 里 `.eyebrow` / `.lead` / `.hero` 三个类名出现次数为 0)。
|
||||
2、⛔ 不用围合边框假装分组(判据:非控件元素里 `border` + `border-radius` 同时出现在同一「分组」用途上 ≥3 次即判不过;结构性容器靠底色差 + 多层阴影分层)。
|
||||
3、⛔ 不给列表行套框、不给状态上整行底色(判据:行间只用 `border-top`;状态只出现在 `tag` 内)。
|
||||
4、⛔ 不做**逐区块**入场编排(判据:`@keyframes` 至多 1 处;过渡只用 `transition`,⛔ 不用 `linear` / `ease`)。
|
||||
5、⛔ 不可点的东西不长成可点样子(判据:页面里所有 `button` / `[role=button]` / `.btn*` 集合与 §二 表 2.4 的元素列做双向差集,差集为空)。
|
||||
6、⛔ **不用内联样式表达「选中态」或覆盖「字号」**(判据:七页里 `[style*=border-color]`、`[style*=color]`、`[style*=font-size]` 的出现次数**都为 0**)。选中态全站**只有一套画法**:`.is-on` / `.is-active`(整块浅紫底 + `--accent-text` + 字重 600);字号只许走 `--fs-*` 七档。
|
||||
7、⛔ **页面公共框架不许进板块计数、不许参与功能归属、不许占对象冻结计数**(判据:`.block` 数逐页等于 `FROZEN`;`.page-shell` 自身不带 `.block` / 不带 `.block-head h2`)。
|
||||
8、⛔ **辅助入口区不许把流转表再写一遍**(判据:每页 `.shell-aux` 里的 `[data-page]` 元素 ≤1 个)。
|
||||
|
||||
**⑪ 验收标准(可观察可判定)**:
|
||||
|
||||
- 七页各自可达(`#/p/p1` … `#/p/p7` 直接打开都渲染出该页内容,不是空壳)。
|
||||
- 表 2.4 每一行的「触发 → 反馈」都真发生过,无死按钮。
|
||||
- 六态在每一页都能被看到(正常 / 加载 / 空 / 错误 / 禁用 / 无权限)。
|
||||
- 宽视口 `1440×900` 与窄视口各留截图,横向溢出为 0。
|
||||
- 页面上每个可点元素都能在表 2.4 里查到;表里没有的可点元素为 0。
|
||||
|
||||
**⑫ 明确拒绝的「编造」**:界面上不出现「示例 / 示意图 / 未接入 / 待核实」这类制作说明;也不把机器结论说成人已认可(如把「疑似原因」写成「已确认原因」)。
|
||||
|
||||
### 1.2 逐页字段(页面职责 / 主操作 / 必要内容落位 / 重复项信息量)
|
||||
|
||||
| 页 | 页面职责 | 主操作(唯一) | 必要内容的落位核对 | 重复项的次级信息 |
|
||||
|---|---|---|---|---|
|
||||
| P1 矩阵总览 | 让内容负责人在 1 分钟内决定**今天先处理哪一件** | 挑一件待办并进到那一件事 | 账号矩阵、今日待处理=零点击可见;异常值、本月最好、全局检索=一次点击可达 | 账号行=账号名 + 今日该发/已发/效果 + 异动标 |
|
||||
| P2 选题雷达 | 让编导在 3 分钟内**找到一条能做的选题** | 把一条选题推进下一步 | 对标监控概览、对标内容、选题库=零点击可见;评论区洞察=一次点击可达;随手记=全局可达(框架层,⛔ 不占板块) | 对标行=标题 + 账号 + 倍数 + 时间;选题行=选题 + 类型 + 来源 + 状态 |
|
||||
| P3 资产库 | 让编导在 2 分钟内**把资产条目管到位、或引用一条去创作**(⛔ 入库不限页,本页是统一管理的地方) | 管好一条 / 引用一条 | 分区切换、资产条目=零点击可见;单条详情、引用入口=一次点击可达 | 条目行=条目摘要 + 出处 + 草稿/已入库 + 采集时间 |
|
||||
| P4 创作台 | 让编导在一条内容上**把当前环节推到下一环节** | 推进到下一环节 | 创作流程、当前环节工作区、AI 产出与采纳、当前内容上下文=零点击可见;资产引用、版本管理、录制卡片与画板=一次点击可达 | 版本行=vN + 语义名 + 时间 + 当前标记 |
|
||||
| P5 发布中心 | 让投放**确认发出这一批版本** | 确认发布 | 检查结果、各版本与逐版编辑、确认发布=零点击可见;目标选择、发布记录=一次点击可达 | 版本行=内容账号·平台账号 + 字数 + 检查结论(一版一路) |
|
||||
| P6 账号画像 | 让内容负责人**改好并保存一个内容账号的画像**,并管好它下面的平台账号(渠道) | 保存这一份画像 | 画像五维、账号列表=零点击可见;平台账号、记忆条目、关联内容=一次点击可达 | 账号行=账号名 + 平台账号数 + 内容数;平台账号行=平台 + 登录态 + 授权状态;记忆行=日期 + 来源 + 一句话 |
|
||||
| P7 复盘台 | 让内容负责人**确认归因并写回这个账号**,顺带**核销一条发布记录** | 确认归因并回写 / 核销一条记录 | 表现数据、归因结论、确认与改判、待复盘项、回写目标提示、发布记录、对账核对区=零点击可见;历史复盘、单条溯源、商单与收支=一次点击可达 | 待复盘行=内容 + 发布账号 + 发布日 + 数据到没到;记录行=内容 + 确认人 + 时间 + 版本 + 状态 |
|
||||
|
||||
### 1.3 状态覆盖六项(逐页给结论)
|
||||
|
||||
判据源:`SKILL.md` 铁律 2 的六态清单。⚠️ 逐项**数值判据**出自供给可选档 `craft/state-coverage.md`,本轮未动用可选档 ⇒ **该项本次无供给来源**,故只给「有没有、长什么样」的结论,不编阈值。
|
||||
|
||||
| 页 | loading | empty | error | success | disabled | 无权限 |
|
||||
|---|---|---|---|---|---|---|
|
||||
| P1 | ✅ 矩阵数据加载中(骨架行) | ✅ 还没接入账号(给「去账号画像建第一个账号」) | ✅ 数据源不可用(显时间戳 + 重试) | ✅ 默认态 | ✅ 无可处理项时待办区禁用并说明 | ✅ 非管理员看利润字段时的遮罩说明 |
|
||||
| P2 | ✅ 拉取对标中 | ✅ 监控名单为空(给「录一个对标号」) | ✅ 拉取失败(退路=手工录入) | ✅ 默认态 | ✅ 未选账号时「转入创作」禁用 | ✅ —(不适用:本页对所有角色开放) |
|
||||
| P3 | ✅ 条目加载中 | ✅ 该分区还没有条目(给「去拆解一条」) | ✅ 读取失败(重试) | ✅ 默认态 | ✅ 无出处条目「入库」禁用(门禁) | ✅ —(不适用) |
|
||||
| P4 | ✅ 环节生成中 | ✅ 该环节还没产出(给「开始这一步」) | ✅ 本步失败(保留已产出 + 重试该步) | ✅ 默认态 | ✅ 文案与封面缺一,「进检查态」禁用(封面缺只提示;F6 守卫) | ✅ —(不适用) |
|
||||
| P5 | ✅ 检查中 | ✅ 还没有可发布的版本(回 P4) | ✅ 检查自身失败 ⇒ **按不过处理**(fail-closed) | ✅ 无硬拦、可发 | ✅ 有硬拦项时「确认发布」禁用 | ✅ 未授权账号的版本标「无发布权限」并禁用该版 |
|
||||
| P6 | ✅ 画像加载中 | ✅ 还没有画像(给「建画像」) | ✅ 保存失败(保留编辑内容) | ✅ 保存成功提示 | ✅ 只读角色时字段禁用 | ✅ 非本人负责账号:可看不可改 |
|
||||
| P7 | ✅ 读数据中 | ✅ 还没有可复盘的内容 | ✅ 数据读不到 ⇒ 转手工录入表现 | ✅ 回写成功提示 | ✅ **未确认归因(`confirmed` 未置)时「回写」禁用**(F10 前置开关) | ✅ —(不适用) |
|
||||
| P7 后半(原 P8) | ✅ 记录加载中 | ✅ 还没有发布记录 | ✅ 读取失败(重试) | ✅ 核销成功 | ✅ 未选中记录时「核销」禁用 | ✅ 利润列对非管理员隐藏(列级遮罩) |
|
||||
|
||||
> 口径:`disabled` 与 `无权限` 是两件事 —— 前者是「当前条件不满足」(自己能解开),后者是「角色不允许」(自己解不开)。界面文案分开写,⛔ 不拿「不可用」一句话糊过去。
|
||||
> 🔴 V4 追加:P6 的「平台账号」块**逐行**给「登录态 + 授权状态」(状态标),未登录/未授权时行内动作改成「去登录」。它落在六态的 `disabled` 里(条件未满足、自己能解开),⛔ 不新造第七种态。
|
||||
|
||||
---
|
||||
|
||||
## 二、令牌表
|
||||
|
||||
### 2.1 三层结构(`primitive → semantic → component`)
|
||||
|
||||
组件层只引语义层,语义层只引 primitive;⛔ 无孤立 token。
|
||||
|
||||
### 2.2 色值(来源=选定套 `design-system-tiaoyue` 亮色基线 · 9 页 clipper 实测)
|
||||
|
||||
| 语义 token | 值 | 用途 |
|
||||
|---|---|---|
|
||||
| `--paper` | `#faf9f5` | 页面底(暖白纸感) |
|
||||
| `--surface` | `#ffffff` | 面板 / 卡片底 |
|
||||
| `--surface-soft` | `#f7f6f1` | 次级面(表头、只读块、侧栏组标底) |
|
||||
| `--ink` | `#1a1a18` | 主文字 |
|
||||
| `--ink-mute` | `#57564f` | 次级文字 |
|
||||
| `--ink-faint` | `#8a887f` | 三级文字 / 占位 / 组标(⛔ 只用于非正文) |
|
||||
| `--line` | `#e7e5dc` | 分隔线(行间 `border-top`) |
|
||||
| `--line-soft` | `#efeee7` | 更弱的分隔(块内) |
|
||||
| `--accent` | `#9E4CFF` | 主强调色(品牌紫) |
|
||||
| `--accent-text` | `#963dff` | accent 当**文字**时用这一档 |
|
||||
| `--on-accent` | `#FFFFFF` | 主色上的文字 |
|
||||
| `--ok` | `#3d7a4f` | 成功态 |
|
||||
| `--err` | `#b4453a` | 错误态 |
|
||||
| `--warn` | `#8a5a00` | 提醒 / 异常值 / 软劝。**本项目追加**:选定套亮色基线没有 warn 档,而②段 P5 要求「硬的拦住、软的只提醒」要有两种可见区分 ⇒ 新增一档并登记实测对比度 |
|
||||
|
||||
**强调色允许位置**:① 主按钮填充底;② 侧栏当前项与分段控件选中项的**整块浅底**;③ 链接文字(用 `--accent-text`);④ 焦点环。⛔ 不允许出现在页面大背景、卡片底、图标填充(除主按钮内图标)、任何渐变。全屏面积 ≤5%。
|
||||
|
||||
**禁止**:⛔ 无紫→粉渐变;⛔ 无装饰性发光;⛔ 状态色只用红/绿/黄三系,不做装饰。
|
||||
|
||||
### 2.3 几何 · 字体 · 间距 · 字阶 · 高度层级 · 脚手架
|
||||
|
||||
| 项 | 值 | 来源 / 说明 |
|
||||
|---|---|---|
|
||||
| 字体 | `"PingFang SC", -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", "Noto Sans SC", sans-serif` | 选定套实测:源站 `@font-face` 为 0 条,走系统字体栈 |
|
||||
| 标题字体(展示体) | `"Songti SC", "Noto Serif SC", "Source Han Serif SC", "SimSun", Georgia, serif`(正文仍走黑体栈);字重 ≤600 | 沿用上一版方案 A:宋体标题 + 黑体正文=两族对照,符合「字族 ≤2–3」。⛔ 未用 Inter / Roboto / `system-ui` 关键字 |
|
||||
| 等宽数字 | `font-variant-numeric: tabular-nums` | 所有数字列,防刷新抖动 |
|
||||
| 圆角 | 大容器 `24px`/面板 `16px`/行与小件 `14px`/输入框 `9px`/按钮 `26px`(药丸) | 全部取自选定套 |
|
||||
| 间距 · 主刻度 | `4 / 8 / 16 / 24 / 32 / 64` | 供布局。块间用 32,块内 8/12/16 |
|
||||
| 间距 · 微网格 | `2 / 4 / 6 / 8 / 12` | **仅供**按钮内衬、徽章内衬、图标间隙 |
|
||||
| 块间距 / 块内间距 | 32 / 8–16 ⇒ 比值 2.0–4.0 | 判据要求 ≥2 ✅ |
|
||||
| 字阶定值表(七档) | `--fs-12` 12 / `--fs-14` 14 / `--fs-16` 16 / `--fs-18` 18 / `--fs-20` 20 / `--fs-24` 24 / `--fs-30` 30 | 相邻差 2/2/2/2/4/6 全部 ≥2 ✅;每档只一个定值 |
|
||||
| 高度层级(每层多层叠层) | L1(行/内嵌):`0 1px 1px rgba(26,26,24,.03), 0 2px 6px -2px rgba(26,26,24,.06)`<br>L2(面板):`0 1px 2px rgba(26,26,24,.04), 0 8px 20px -12px rgba(26,26,24,.14), 0 18px 40px -18px rgba(26,26,24,.10)`<br>L3(浮层):`0 2px 4px rgba(26,26,24,.05), 0 14px 32px -12px rgba(26,26,24,.18), 0 32px 64px -24px rgba(26,26,24,.16)` | 每层 ≥2 层叠层 ✅ |
|
||||
| 布局脚手架 | 侧栏 `64px` 药丸浮栏(随内容高、列内垂直居中)+ 主区 `minmax(0,1fr)`;主数据块走满宽表格(`.ds-table.tbl-dense`);两栏分栏 `.grid-main-side` 宽比 `1.35fr : .9fr` | 骨架档=主区+侧区,已落到具体列宽 |
|
||||
| 容器与对齐锚点 | 主区左右内衬 `32px`;表格与块标题左锚点同一条线;数字列右对齐且右锚点对齐块右内衬 | 判据要求「对齐锚点」写明 |
|
||||
| 浮层 | 居中面板,宽 `min(560px, calc(100vw - 32px))`,内衬 `24px`;**只有一个可见关闭出口**(右上 ×);遮罩与 `Esc` 也可关,但不计为可见出口 | 满足 Gate-3「可见关闭出口唯一」 |
|
||||
|
||||
### 2.4 交互清单(唯一交互真相源 · 四列)
|
||||
|
||||
**通用规则**(适用于下面所有浮层):每个浮层**只有一个可见关闭出口**(右上 ×,ID `X-close`);遮罩点击(`X-mask`)与 `Esc` 也能关,但**不视为可见出口**;关闭后焦点回到触发它的那个按钮,Tab 只在层内循环。下表不逐浮层重复这三条。
|
||||
|
||||
| ID | 元素 | 触发 | 反馈 | 何时不可点 |
|
||||
|---|---|---|---|---|
|
||||
| G-05 | 侧栏七个功能项(一层七项,一项一页;⛔ 无组标、⛔ 无第二层) | 点击 | 切到该页(hash 变、主区重绘);当前项转整块浅紫底 + `--accent-text` + 600 | 从不可点 |
|
||||
| G-06 | 顶栏「随手记」 | 点击 | 打开随手记浮层,焦点进输入框 | 从不可点 |
|
||||
| G-08 | 两处「假设」徽章(P1 页头 / P7「商单与收支」块头) | 点击 | 打开假设浮层(逐条给复核人 / 时机 / 落点) | 从不可点 |
|
||||
| X-close | 各浮层右上 × | 点击 | 关闭浮层;焦点回触发它的按钮 | 从不可点 |
|
||||
| X-mask | 浮层遮罩(层外空白区) | 点击 | 关闭浮层;焦点回触发它的按钮 | 没有浮层时不渲染 |
|
||||
| SP-01…SP-07 | 各页**页面标题行右侧**的 icon 按钮(页面级动作:刷新本页数据;⛔ 不另起一行) | 点击 | 提示「已刷新本页数据」;不改数据 | 从不可点 |
|
||||
| STATE-NORMAL | 状态面板 ·「回到正常内容」 | 点击 | 该页回 `ok` 态,主操作恢复 | 仅在非 `ok` 态出现 |
|
||||
| STATE-RETRY | 出错态 ·「重试一次」 | 点击 | 提示已重试(示意);不改数据 | 仅在 `error` 态出现 |
|
||||
| STATE-GO | 空态 ·「去〈某页〉」 | 点击 | 跳到该页;面板关 | 仅在 `empty` 态且该页定义了去处时出现 |
|
||||
| R-01 | 随手记浮层 · 输入框 | 输入 | 内容非空时「保存」由禁用转可用 | 从不可点(可输入) |
|
||||
| R-02 | 随手记浮层 · 保存 | 点击 | 写入选题库「待做」;提示 1.5s 后消失;浮层关闭 | 输入为空时 `:disabled` |
|
||||
| R-03 | 随手记浮层 · 取消 | 点击 | 关闭,不写入;焦点回触发按钮 | 从不可点 |
|
||||
| A-01 | 假设浮层 · 两处假设条目 | 展示 | 只读,逐条给复核人 / 时机 / 落点 | 不适用(只读,非控件) |
|
||||
| P1-01 | 今日待处理项(每条) | 点击 | 跳到该待办所属的页(选题类→P2、在写→P4、待审→P5、待复盘→P7、待核销→P7 的记录区) | 从不可点 |
|
||||
| P1-02 | 账号矩阵行名 | 点击 | 跳到 P6 并选中该账号(传 `accountId`) | 从不可点 |
|
||||
| P1-03 | 账号矩阵行 ·「看复盘」 | 点击 | 跳到 P7 并选中该账号的待复盘内容(传 `accountId`) | 该账号没有可复盘内容时禁用 |
|
||||
| P1-04 | 异常值提示条目 | 点击 | 跳到 P2 并带 `filter=异常值` 定位(传 `benchmarkId`) | 无异常值时整块显示空态 |
|
||||
| P1-05 | 本月最好的一条 | 点击 | 跳到 P7 的该条复盘 | 无数据时禁用 |
|
||||
| P1-06 | 全局检索 · 输入框 | 输入 | 结果列表按关键字过滤;无结果显示空态行 | 从不可点(可输入) |
|
||||
| P1-07 | 全局检索 · 结果项 | 点击 | 跳到该结果所属的页;关键字清空 | 无结果时不渲染可点项 |
|
||||
| P2-01 | 监控概览 ·「低粉爆款」数 | 点击 | 筛选对标内容列表(只看爆款) | 数为 0 时禁用 |
|
||||
| P2-02 | 监控概览 ·「异常值」数 | 点击 | 筛选对标内容列表(只看异常) | 数为 0 时禁用 |
|
||||
| P2-03 | 对标内容行 ·「发起拆解」 | 点击 | 跳到 P3 并带 `benchmarkContentId`(预填原文与出处) | 从不可点 |
|
||||
| P2-04 | 评论区洞察 · 展开/收起 | 点击 | 展开子区并开始抓取(显示抓取中) | 从不可点 |
|
||||
| P2-05 | 评论区洞察 ·「抓取评论」 | 点击 | 进入抓取中 → 出候选选题列表 | 抓取中时禁用 |
|
||||
| P2-06 | 候选选题 ·「采纳」 | 点击 | 该条进选题库「待做」;候选行标为已采纳 | 该条已采纳时禁用 |
|
||||
| P2-07 | 候选选题 ·「忽略」 | 点击 | 候选行标为已忽略(可恢复) | 该条已忽略时禁用 |
|
||||
| P2-08 | 选题库 · 进度 tab(待做/在写/已用) | 点击 | 列表切换成该进度组 | 从不可点 |
|
||||
| P2-09 | 选题行 ·「转入创作」 | 点击 | 建/切当前 `Content` 并跳到 P4;选题转「在写」(流转 8) | 未选账号时禁用(行内说明) |
|
||||
| P2-10 | 选题行 ·「拆解」 | 点击 | 跳到 P3 并把该选题当素材 | 从不可点 |
|
||||
| P2-12 | 选题库 · 类型 tab(全部/选题/对标线索/评论洞察/数据异动/灵感) | 点击 | 列表按该类型过滤(与进度维度正交,两个维度的筛选同时生效) | 从不可点 |
|
||||
| P2-AUX | 辅助入口区 ·「开始创作」 | 点击 | 跳到 P4(不带条目,落在当前内容上) | 从不可点 |
|
||||
| P3-01 | 分区切换 tab(角度/结构/开场白/标题) | 点击 | 条目列表换成该分区 | 从不可点 |
|
||||
| P3-02 | 条目行 | 点击 | 右区显示单条详情(原文 / 出处 / 草稿标记) | 从不可点 |
|
||||
| P3-03 | 单条详情 ·「入库」 | 点击 | 无出处条目被门禁挡并说明原因;有出处的转「已入库」 | **无出处或原文缺失时禁用**(门禁) |
|
||||
| P3-04 | 引用入口 ·「引用到创作台」 | 点击 | 跳到 P4 并把该条目加进资产引用区(流转 9) | 从不可点 |
|
||||
| P4-01 | 创作流程 · 七个环节(逐项) | 点击 | 切到该环节;只许回退到已完成的环节 | 未到达的后续环节禁用 |
|
||||
| P4-02 | 当前环节工作区 · 内容输入框 | 输入 | 「开始这一步」由禁用转可用 | 从不可点(可输入) |
|
||||
| P4-03 | 当前环节工作区 ·「开始这一步」 | 点击 | 生成中 → 产出写进「AI 产出与采纳」(⛔ 不进正文) | 输入为空时禁用 |
|
||||
| P4-04 | 资产引用 ·「从资产库拿一条」 | 点击 | 展开选择器;选中后收进引用区并显示来源 | 资产库为空时禁用并说明 |
|
||||
| P4-05 | 资产引用 ·「移除引用」 | 点击 | 从引用区移除该条 | 引用区为空时不渲染 |
|
||||
| P4-06 | 「推进到下一环节」 | 点击 | 当前环节 +1;流程与工作区跟着变 | 文案与封面缺一、进检查态时禁用(封面缺只提示;F6 守卫) |
|
||||
| P4-07 | AI 产出与采纳 ·「采纳」 | 点击 | 机器产出并入本环节正文 | 无未裁决产出时禁用 |
|
||||
| P4-08 | AI 产出与采纳 ·「驳回」 | 点击 | 正文不变;产出标为已驳回 | 无未裁决产出时禁用 |
|
||||
| P4-09 | AI 产出与采纳 ·「改后再用」 | 点击 | 保留人的版本;产出标为改后再用 | 无未裁决产出时禁用 |
|
||||
| P4-10 | AI 产出与采纳 ·「中断生成」 | 点击 | 停掉本步生成 | 仅在生成中出现 |
|
||||
| P4-11 | 版本管理 ·「按平台账号展开」 | 点击 | 母版展开出多版本(每个版本绑一个**平台账号**,一个平台账号一版,F7) | 未到成稿态时禁用 |
|
||||
| P4-12 | 版本管理 · 版本行「切为当前版」 | 点击 | 该版标为当前版;当前内容上下文的版本号跟着变(F8) | 该版已是当前版时禁用 |
|
||||
| P4-13 | 录制卡片与画板 ·「生成卡片」 | 点击 | 成稿态生成一张卡片(F14) | 未到成稿态时禁用 |
|
||||
| P4-14 | 录制卡片与画板 ·「同步到画板」 | 点击 | 卡片落到画板,可打开 | 还没有卡片时禁用 |
|
||||
| P4-AUX | 辅助入口区 ·「查账号口径」 | 点击 | 跳到 P6 并选中当前账号(流转 11) | 从不可点 |
|
||||
| PICK-ASSET | 资产选择器 · 单条 | 点击 | 收进引用区并显示来源;浮层关 | 已引用过的不渲染可点项 |
|
||||
| P5-01 | 目标选择 · 展开/收起 | 点击 | 展开**两级**目标选择(内容账号 → 它下面的平台账号) | 从不可点 |
|
||||
| P5-02 | 目标选择 · 内容账号项 | 点击 | 勾选/取消该内容账号;**连它下面的平台账号(渠道)一起增删**,版本列表跟着变 | 从不可点 |
|
||||
| P5-03 | 目标选择 · 平台账号项(渠道) | 点击 | 勾选/取消一个平台账号;版本列表跟着增删一版(一版一路) | 从不可点 |
|
||||
| P5-04 | 各版本 · 版本 tab(逐版) | 点击 | 右区换成该版内容 | 从不可点 |
|
||||
| P5-05 | 版本内容编辑框 | 输入 | 「保存本版」由禁用转可用;标为「已改」 | 从不可点(可输入) |
|
||||
| P5-06 | 版本内容 ·「保存本版」 | 点击 | 该版内容更新;检查结果跟着重算(回到未检) | 无改动时禁用 |
|
||||
| P5-07 | 检查结果 ·「复检」 | 点击 | 检查中 → 出结论(硬拦 / 软劝 / 通过) | 检查中时禁用 |
|
||||
| P5-08 | 「确认发布」 | 点击 | 打开二次确认浮层 | **有硬拦项时禁用**;无版本时禁用 |
|
||||
| P5-09 | 二次确认 ·「确认发出」 | 点击 | 写发布记录(复盘页的记录区出现一条);提示成功(流转 14) | 从不可点 |
|
||||
| P5-10 | 二次确认 ·「取消」 | 点击 | 关闭浮层,不发;焦点回触发按钮 | 从不可点 |
|
||||
| P5-11 | 发布记录 · 记录行 | 点击 | 跳到 P7 并定位该记录 | 从不可点 |
|
||||
| P6-01 | 账号列表项 | 点击 | 切换右区画像 | 从不可点 |
|
||||
| P6-02 | 画像**五维**字段(定位/风格/受众/偏好与红线 + 长期记忆,共 5 个输入) | 输入 | 「保存画像」由禁用转可用 | 非本人负责账号时禁用(改由角色判定) |
|
||||
| P6-03 | 「保存画像」 | 点击 | 保存成功提示;未保存时离开给提示 | 无改动时禁用 |
|
||||
| P6-04 | 记忆条目 · 展开/收起 | 点击 | 展开记忆列表(只追加,不可编辑) | 从不可点 |
|
||||
| P6-05 | 关联内容行 | 点击 | 跳到 P4 的该条内容 | 无关联内容时整块空态 |
|
||||
| P6-06 | 平台账号行 ·「去登录/重新授权」 | 点击 | 该行登录态与授权状态一起转「已登录 · 已授权」 | 从不可点 |
|
||||
| P6-07 | 平台账号 ·「加一个平台账号」 | 点击 | 该内容账号下多一个平台账号,初始「未登录 · 未授权」 | 从不可点 |
|
||||
| P7-01 | 待复盘项 | 点击 | 右区换成该条的表现数据 | 从不可点 |
|
||||
| P7-02 | 表现数据 ·「手工录入」 | 点击 | 数据读不到时的降级入口,展开输入 | 数据已读到时不渲染 |
|
||||
| P7-03 | 归因结论 · 文本 | 输入 | 「采纳这条归因」由禁用转可用 | 从不可点(可输入) |
|
||||
| P7-04 | 确认与改判 ·「采纳这条归因」 | 点击 | `confirmed` 置真 ⇒ 「确认归因并回写」转可用(**前置开关**) | 归因为空时禁用 |
|
||||
| P7-05 | 确认与改判 ·「驳回」 | 点击 | 标为已驳回;回写按钮保持禁用 | 归因为空时禁用 |
|
||||
| P7-06 | 确认与改判 ·「改后再用」 | 点击 | 标为改后再用;回写按钮保持禁用 | 归因为空时禁用 |
|
||||
| P7-07 | 回写目标提示 ·「确认归因并回写」 | 点击 | 回写到当前账号画像:记忆 +1;显示回写目标(流转 17) | **未采纳归因(`confirmed` 为假)或未选账号时禁用** |
|
||||
| P7-08 | 历史复盘 · 展开/收起 | 点击 | 展开历史复盘结论 | 从不可点 |
|
||||
| P7-09 | 发布记录行 | 点击 | 右区换成该条的对账详情 | 从不可点 |
|
||||
| P7-10 | 单条溯源 · 展开/收起 | 点击 | 展开溯源:从记录回到内容与版本 | 从不可点 |
|
||||
| P7-11 | 对账核对区 ·「核销」 | 点击 | 二次确认 → 该条标「已核销」 | 未选记录时禁用;记录未「已发布」时禁用 |
|
||||
| P7-12 | 商单与收支 · 展开/收起 | 点击 | 展开收支条目(F12 标 `P2/Deferred`) | 从不可点 |
|
||||
| CHECKOUT-OK | 核销二次确认 ·「确认核销」 | 点击 | 该条标「已核销」;提示成功;浮层关 | 从不可点 |
|
||||
| CHECKOUT-CANCEL | 核销二次确认 ·「取消」 | 点击 | 关闭浮层,不核销;焦点回触发按钮 | 从不可点 |
|
||||
|
||||
⚠️ **「可见关闭出口」与「决策型关闭」是两件事**:每个浮层的中性关闭出口只有一颗 ×(`X-close`),恰好 1 个;「取消」这类带决策语义的按钮也能关层,但它不是「找出口」用的,**单独登记**(`R-03` / `P5-10` / `CHECKOUT-CANCEL`)。⛔ 不把两类混成一个数。
|
||||
|
||||
**表外可点元素必须为 0** —— 自检里有一条逐集合做双向差集的检查(`#/selftest` 自动跑)。
|
||||
|
||||
⚠️ **`A-01` 不是控件**:它是假设浮层里的只读展示行,列出来是为了「假设有两处、逐条给复核人/时机/落点」这件事在清单里看得见 ⇒ **不进实现清单**(原型里的 `IMPL` 表),自检也不拿它去点。
|
||||
|
||||
⚠️ **V1 撤销的 7 个 ID 与 V2 再撤 5 个**:V1 撤 `G-01…G-04`(一级组)/`G-07`(账号切换器)/`G-09`(演示开关)/`G-11`(收起侧栏)。V2 因「功能入口」那一层整体撤销,再撤 `card()` 相关的 `data-page` 用法;因「全局检索」从浮层改为 P1 的业务板块,撤掉检索浮层与其 `S-01`/`S-02`(改由 `P1-06`/`P1-07` 承担)。⛔ 撤销一个 ID 时必须同时把它的 DOM 删掉,否则判据「页面上每个 `data-act` 都在清单里」会报红。
|
||||
|
||||
⚠️ **V4 撤 1 个、新增 3 个**:V4 因「灵感速记」不再是 P2 的业务板块(随手记本就有全局入口 `G-06`,那个页内按钮是重复),撤 `P2-11`;新增 `P2-12`(选题库的**类型**维度 tab —— 选题库现在两个正交维度:进度 `P2-08` + 类型 `P2-12`)与 `P6-06`/`P6-07`(平台账号的登录授权与新增,对应 P6 新板块)。⛔ 三个新 ID 的 DOM 必须同时在页面上,否则判据「清单里每个 ID 都在页面上出现过」会报红。清单共 **90 个 ID**(V3 是 88)。
|
||||
|
||||
### 2.5 组件规格(来源:选定套既有组件族)
|
||||
|
||||
| 组件 | 规格(具体值) | 来源 |
|
||||
|---|---|---|
|
||||
| 按钮 · 主档 | 高 `40px`,内衬 `12/20`,字号 `16px`,字重 `600`,圆角 `26px`,底 `--accent`,字 `--on-accent` | 选定套 `--btn-*`;字号 16 + 600 是**必须的**(`#FFFFFF` 压 `#9e4cff` 只有 4.26:1,须走大字线 3:1) |
|
||||
| 按钮 · 次档 | 高 `40px`,内衬 `12/20`,字号 `14px`,字重 `500`,圆角 `26px`,底 `--surface`,描边 1px `--line`,字 `--ink` | 同族 |
|
||||
| 按钮 · 弱档(文字) | 高 `32px`,内衬 `6/12`,字号 `14px`,圆角 `26px`,无底无描边,字 `--accent-text` | 同族 |
|
||||
| 卡片 · 密卡 | 内衬 `16px`,圆角 `16px`,底 `--surface`,L1 阴影 | 同族 |
|
||||
| 卡片 · 宽松卡 | 内衬 `24px`,圆角 `24px`,底 `--surface`,L2 阴影 | 同族 |
|
||||
| 输入框 | 高 `36px`,内衬 `12/10`,圆角 `9px`,字号 `14px`,底 `--surface`,描边 1px `--line` | 同族 |
|
||||
| 徽章 / 状态标 | 高 `22px`,内衬 `2/8`,字号 `12px`,圆角 `999px`,无描边,底为对应状态色 8% 叠加 | 同族 |
|
||||
| 侧栏(`.sidebar`) | **药丸浮栏**:宽 `64px`、内衬 `3px`、圆角 `100px`、底色 `color-mix(in srgb, var(--ink) 5%, transparent)`、描边 `1px color-mix(in srgb, var(--ink) 12%, transparent)`;高度随内容、`align-self:center` 在 `64px` 列里垂直居中;品牌只留标记并居中(`.sidebar .brand-name` 隐藏) | 形态与宽度取自选定套 `.app-sidebar`(`w-16` ⇒ `64px`)+ 第八轮实测值(栏 64/内衬 3/圆角 100);V5 由 `128px` 改回基准形态(理由见 §1.1 ⑤) |
|
||||
| 侧栏导航项(`.nav-item`) | **竖排**:宽 `56px`(=栏内容宽)、高 `78px`、内衬 `8/0`、圆角 `999px`、**图标在上 `24px`、名字在下 `12px/500/行高 16`**、图标与名字间距 `6px`;名字**两字常驻**(说明走悬停提示 `title` 与读屏 `aria-label`);计数徽章悬在项右上角;项间 `gap 2px`;hover 只换底色(`--tfast`),⛔ 不移位、⛔ 不加阴影 | 形态照选定套 `nav-item`(药丸、只换色);V5 因栏收到 `64px` 由横排改**竖排**(实测值:项 56×78、字 12px-500-行高 16) |
|
||||
| 侧栏当前项(`.nav-item.is-active`) | 整块浅紫底 `color-mix(in srgb, var(--accent) 10%, var(--paper))` + 字色 `--accent-text` + 字重 `600`(⛔ 不用单侧色条、⛔ 不用描边变黑) | 与 §1.1 ⑩ 第 6 条「选中态只有一套画法」一致 |
|
||||
| 页面公共框架(`.page-shell` / `.page-shell-title` / `.page-shell-stats` / `.page-shell-aux`) | 标题区:`h1` + 一行说明;**本页页面级动作 = 标题行右侧的 icon 按钮**(`.btn-icon` + `.shell-refresh`,靠 `margin-left:auto` 右对齐;例:刷新本页数据;⛔ 不另起一行);统计区用 `.stat-item`(白底 + 1px `--line` + 圆角 `16px` + 内衬 `12/16`,值 `20px/600` + `tabular-nums`,标签 `12px` `--ink-mute`);辅助入口区最多一个入口。⛔ 这一层**不带 `.block` / 不带 `.block-head h2`** | 落 `2b` §四:它不算板块数、不参与功能归属、不占冻结计数。V5 撤掉原「操作区」那一行 —— 页面级动作改挂标题行右侧 |
|
||||
| 满宽表格(`.ds-table.tbl-dense`) | 容器 `.panel` + `.table-wrap`(`overflow-x:auto`);表头 `12px/600` `--ink-mute` + 下边框 1px `--line`;行内衬 `4/8`、行间 `border-top` 发丝线、单元格 `vertical-align:middle` + `nowrap` | 密度契约(一屏 ≥6 行)逼出来的紧凑档 |
|
||||
| 栏内表(`.ds-table.tbl-side`) | 两栏**栏内**的列表:内衬同上,但 ⛔ **不套 `nowrap`** | 同上,只在窄栏里用 |
|
||||
| 行级微按钮(`.btn-micro`) | 高 `22px`、内衬 `0/8`、字号 `12px`、圆角 `999px`、无底、字色 `--accent-text`、`:disabled` 时透明度 `.45`。⛔ 表格行里不许用 32px 的 `.btn-sm` | 同上 |
|
||||
| 分段控件(`.seg` / `.seg-item`) | 容器 `gap 4px` + 可换行;项高 `32px`、内衬 `0/12`、圆角 `999px`、描边 1px `--line`、白底;选中项 `.is-on` =整块浅紫底 + `--accent-text` + 600 + 描边转 `--accent` | 选中态统一 |
|
||||
| 表单字段(`.field`) | 字段块间距由 `.field + .field{ margin-top:16px }` 出 | 统一 |
|
||||
| 表格当前行(`.cell-name.is-on`) | 当前行的行名转 `--accent-text`(选中态在表格里的落法,⛔ 不写内联 `color`) | 统一 |
|
||||
| 两栏分栏(`.grid-main-side`) | 宽比 `1.35fr : .9fr`;左=上下文/列表,右=产出/动作/详情;主数据块仍满宽。`≤900px` 落单列 | 沿用 |
|
||||
| 图标(唯一出口 `navSvg(page,size)`) | `viewBox 24` / `fill:none` / `stroke:currentColor` / `stroke-width:2` / 圆头圆角;尺寸只有两个用法:侧栏 `24px`、`≤640px` 的 `16px`;颜色只有一处 `--accent-text`(当前项走 `currentColor`) | 沿用 |
|
||||
|
||||
> 同屏主档按钮 ≤1(多步流程每步 ≤1):P1 无主档、P2/P3/P4/P5/P6/P7 各 1 个 ✅(P7 前后两半各有一个推进动作,但同屏只出当前上下文那一个)
|
||||
> 实底底色 ≥2 种:主档 `--accent`、次档 `--surface`、状态标(ok/err/warn 三色 8% 叠加)✅
|
||||
|
||||
---
|
||||
|
||||
## 三、两处假设的显式标注(⛔ 不当已确认需求用)
|
||||
|
||||
②段 `2b` §七 标了两处骨架受限(第 1 条 P1 形态 / 第 2 条 P7 第 10 板块「商单与收支」)。本轮**尚无用户结论** ⇒ 按②段给的默认读法做,并在本份与原型里显式标注:
|
||||
|
||||
| # | 受影响处 | 假设内容 | 本轮默认读法 | 复核人 | 复核时机 | 结论落点 |
|
||||
|---|---|---|---|---|---|---|
|
||||
| 假设 1 | **P1 的形态** | 矩阵级视图是否真需要(1a 待复核第 5 条 + A1) | **按「需要矩阵级视图」做**:P1 = 矩阵总览,5 个板块全在。若复核为「不需要」,P1 降为「单账号今日」,只留第 1、4 板块,矩阵列表下移到账号切换 | 主会话转用户 | ②段收口时一次性过 | `2b` §七 + §五 P1;本轮落 `ui/DESIGN.md` 本节 + 原型 P1 页头的「假设」徽章 |
|
||||
| 假设 2 | **P7 后半段第 4 板块「商单与收支」**(原 P8 的第 4 板块) | 商单对账进不进第一版、收支口径是否内容级(1a 待复核第 6 条 + A3) | **按「进第一版但属 P2、可整块缺」做**:第 4 板块**渲染出来但标「可点入 + 假设」**,展开后给一句「本块依赖未复核项」。它前面那 3 块(发布记录/单条溯源/对账核对区)不受影响 | 主会话转用户 | 同上 | `2b` §七 + §五 P7;本轮落 `ui/DESIGN.md` 本节 + 原型 P7 后半段第 4 板块标题行的「假设」徽章 |
|
||||
|
||||
**原型的兑现方式**:两处各在自己的**板块标题同行右侧**挂一个「假设」徽章,**徽章本身可点**(`G-08`)—— 点开后逐条给出复核人 / 时机 / 落点。⛔ 假设既没有被当已确认需求写死,也没有被编出答案。
|
||||
|
||||
---
|
||||
|
||||
## 四、Gate-1 方向门自检(硬闸,结果写在本份末尾)
|
||||
|
||||
逐条结论在 §八(十七行,含本轮现取的实测依据);逐视口表在 §6.1。
|
||||
|
||||
---
|
||||
|
||||
## 五、缺口与证据边界(⛔ 不假装支持)
|
||||
|
||||
1. **反 AI 味 / 无障碍 / 表单校验 / 动效纪律的逐项数值判据本次无供给来源** —— 这四项出自 §供给·工艺数值判据的**可选档**(`assets/open-design/craft/` 13 份),本轮未动用可选档 ⇒ ⛔ 不凭感觉编一套顶上。本段实际应用的是**默认档**判据:`execution-runbook.md` §3.3/§3.4 + `layouts-tooling.md` §5.5。
|
||||
2. **暗色主题本轮不做** —— 选定套的暗色与亮色是两套独立基线,规则是「要暗色就整套切」。⇒ 本轮只做亮色基线,⛔ 不与暗色混搭。
|
||||
3. **`--warn` 是本项目追加的第 14 个语义色** —— 选定套亮色基线只有 ok/err,无 warn;而②段 P5 要求软硬两种区分。追加值的对比度实测记在 §六。
|
||||
4. **`1c-用户画像.md` 是零访谈画像** —— 界面里凡涉及「角色能看什么」的判据都基于它,**不得对外说成基于用户调研**。
|
||||
5. **3c GPT 参考版本轮不做** —— 派活单明令「⛔ 不许再向外发送本项目内容」(第②棒曾把产品现状发到站外,属红线动作)⇒ 本轮**全部输入只看本地文件**,⛔ 不上传、不外发、不用站外模型服务。⇒ `3c` 的「让外部模型独立出一版」这一步本轮**按红线停做**,并在收尾明示「未取得参考版 ≠ 已通过」。这是**红线优先于流程**的处置,不是漏做。
|
||||
6. **窄视口实测下限与红档** —— 本轮取证走 CDP 声明式视口(`Emulation.setDeviceMetricsOverride`),实测到 `390×844`;逐视口表(§6.1)现含 `390×844` 一档,⛔ 不写「已测 375」这种没测过的。🔴 **V5 整表 16 档全量重跑**:不达标由 **3 档降到 2 档** —— 只剩 `500×844`(P1 5 行)与 `390×844`(P1 2 行);`560×900` 的 P1 由 5 行升到 **6 行**、该档转绿(`逐视口:不达标 2 / 共 16`)。P1 首行顶逐档下移 `43~52px`(`669…822` → `626…779`),行数逐档上升(宽屏 7 → **8~9 行**,`390×844` 由 0 → 2 行;P2 由 12 → **14** 行、`390×844` 由 5 → **6** 行,也过线)。⇒ 两处改动各自兑现:① **页面级动作不再独立占一行**(省掉「按钮 32px + 下边距 12px」)⇒ 首行顶直接下移 ~44px;② **侧栏 `128 → 64px`** ⇒ 主区宽 64px、满宽表格列更宽 ⇒ P2 行数上升。⚠️ 这与 V2/V3「侧栏宽度对首行顶没有影响」**不矛盾** —— 那两次只动栏宽(`184→128px`),这次同时动了「撤掉操作区整行」+ 栏宽两件事,首行顶的变化主要来自前者,⛔ 别把这条读反。是否动窄屏断点,仍待用户裁定。
|
||||
7. **规格核对只走本地已测值** —— §六 的实测值全部由 `#/selftest` 与 `_tools/` 现算,⛔ 不目测。上一版留档的两处遗留(`500×844` 一屏 −1 行、满宽表格与一屏 ≥6 行不可兼得)本轮**重测后如实登记**,⛔ 不靠改判据过关。
|
||||
8. **②段那处内部不一致已订正(V3 登记 → V4 关闭)** —— V3 登记过:`2b` §五 P2 的板块清单把「灵感速记」列为第 5 块,而同页信息分档表把它标成「全局可达(框架层,不占板块)」,两处打架。🔴 V4 按用户口径(选题库容纳「对选题有帮助的任何信息」、随手记仍落选题库)**把两处统一**:灵感速记**不再是板块**,P2 由 5 块收成 4 块;现在板块清单与信息分档表一致。骨架总数仍 39(P2 −1、P6 +1)。
|
||||
9. **定时发布本轮挂起(⛔ 不进界面)** —— 用户口径逐字(2026-10-10 07:56):「后续具体做投放功能的时候在说」。⇒ 本段**不写**定时发布:⛔ P5 不加「定时设置」块、⛔ 不加状态、⛔ 不改流转。登记在②段 `2a` §九 第 7 项与 `2b` §十 第 7 项,真做投放功能时再议。
|
||||
|
||||
---
|
||||
|
||||
## 六、数值取证登记(自检 + 工具实测回填,⛔ 非目测)
|
||||
|
||||
> 本表由 3b 阶段现算回填,数据源:`#/selftest`(DOM 取值 + 真实像素)+ `_tools/` 八个脚本。⛔ 一个数都不许拍脑袋。
|
||||
> **Gate-1 方向门的逐条结论 + 实测依据在 §八**(全文结尾,⛔ 不在这里再抄一遍)。
|
||||
> 此处只放一条 `DESIGN.md` 独有的登记:**逐视口表**(自检全文、27 条变异、四条反向变异、八条改动明细见 `ui/3b-实测记录.md`;两处冲突以 `3b-实测记录.md` 为准)。
|
||||
|
||||
### 6.1 逐视口表(16 档;契约:一屏可见行数 ≥6 / 900px 高,`layouts-tooling.md` §1,⛔ 不分档)
|
||||
|
||||
`P1 顶` = P1「账号矩阵」首行距视口顶的像素。全部走 CDP 声明式视口(只连 9223 已有实例)。
|
||||
|
||||
| 视口 | 自检 | P1 首行顶 | 行距 | P1 行数 | P2 行数 | 顶栏 | 侧栏 | 判定 |
|
||||
|---|---|---|---|---|---|---|---|---|
|
||||
| 1440×900 | 80/0 | 626px | 31px | 8 | 14 | 49px | 64×606 | ✅ |
|
||||
| 1280×900 | 80/0 | 626px | 31px | 8 | 14 | 49px | 64×606 | ✅ |
|
||||
| 1024×900 | 80/0 | 626px | 31px | 8 | 14 | 49px | 64×606 | ✅ |
|
||||
| 1000×900 | 80/0 | 626px | 31px | 8 | 14 | 49px | 64×606 | ✅ |
|
||||
| 960×900 | 80/0 | 626px | 31px | 8 | 14 | 49px | 64×606 | ✅ |
|
||||
| 920×900 | 80/0 | 626px | 31px | 8 | 14 | 49px | 64×606 | ✅ |
|
||||
| 901×900 | 80/0 | 626px | 31px | 8 | 14 | 49px | 64×606 | ✅ |
|
||||
| 900×900 | 80/0 | 618px | 31px | 9 | 14 | 49px | 64×606 | ✅ |
|
||||
| 840×900 | 80/0 | 618px | 31px | 9 | 14 | 49px | 64×606 | ✅ |
|
||||
| 820×900 | 80/0 | 618px | 31px | 9 | 14 | 49px | 64×606 | ✅ |
|
||||
| 768×900 | 80/0 | 618px | 31px | 9 | 14 | 49px | 64×606 | ✅ |
|
||||
| 700×900 | 80/0 | 618px | 31px | 9 | 14 | 49px | 64×606 | ✅ |
|
||||
| 640×900 | 80/0 | 671px | 31px | 7 | 12 | 49px | 640×53 横滚标签条 | ✅ |
|
||||
| 560×900 | 80/0 | 686px | 31px | 6 | 12 | 49px | 560×53 横滚标签条 | ✅ |
|
||||
| **500×844** | 79/**1** | 686px | 31px | **5** ❌ | 10 | 49px | 500×53 横滚标签条 | ❌ |
|
||||
| **390×844** | 79/**1** | 779px | 31px | **2** ❌ | 6 | 49px | 390×53 横滚标签条 | ❌ |
|
||||
|
||||
**绿 14 档 / 红 2 档**(`run_viewports.py`:`逐视口:不达标 2 / 共 16`)。行距在所有档恒为 `31px`、行高齐(差 ≤2px)⇒ 红只出在 **P1 首行顶太高**(626 → 779px)。
|
||||
|
||||
> 🔴 **V5 重跑(整表 16 档全量重算,⛔ 不是沿用 V4 的数)**:`run_viewports.py` 输出 `逐视口:不达标 2 / 共 16`。两处改动各自兑现:① **页面级动作不再独立占一行** ⇒ 首行顶逐档下移 `43~52px`(`669…822` → `626…779`),宽屏行数 7 → 8~9;② **侧栏 `128 → 64px`** ⇒ 主区宽 64px,满宽表格列变宽,P2 行数由 12 升到 14、`560×900` 的 P1 由 5 行升到 6 行 ⇒ 该档转绿。
|
||||
>
|
||||
> ⚠️ **与 V2/V3「侧栏宽度不影响首行顶」不矛盾**:那两次只动栏宽(`184→128px`),这次同时动了「撤掉操作区整行」+ 栏宽两件事;首行顶的变化主要来自前者,⛔ 不要把这条读成「栏宽这回就有影响了」。
|
||||
>
|
||||
> ⚠️ **`390×844` 能测 ≠ 达标**:它是契约要求留档的第二个视口,帧已出(PNG 尺寸当场比对通过),P1 装下 2 行、P2 6 行(P2 已过线)。
|
||||
>
|
||||
> 🔴 本轮**未动**窄屏断点,⛔ 也没有为了让数好看改判据;剩余两档(`500×844` / `390×844`)仍如实登记,是否动窄屏断点待用户裁定。
|
||||
|
||||
---
|
||||
|
||||
## 七、修订记录
|
||||
|
||||
| 轮次 | 改了什么 | 为什么 |
|
||||
|---|---|---|
|
||||
| V2 初版(2026-10-09) | ①**导航**由「一层八项平铺」改回「3 个业务组 + 1 个跨组入口」,侧栏由 `64px` 药丸浮栏加宽到 `184px` 带组标圆角浮栏;②**新增页面公共框架(Page Shell)**一层(标题区/数据摘要区/页面操作区/辅助入口区),并写明三条硬规则(不计板块数、不参与功能归属、不占冻结计数);③**撤销「功能入口」那一层**(`.sect-nav` / `.data-cards` / `.data-card` 与 `card()` 全部删除);④**骨架按新版 39 块重排**:P4 由 5 → 6、P7 由 5 → 6、P2 第 3 块注明可点入子区;⑤**对象冻结**:每个业务板块带 `data-obj`;⑥P7「确认与改判」落为回写的**前置开关**(`confirmed` 为假时回写禁用);⑦P4 版本管理承担 F7/F8、录制卡片与画板承担 F14;⑧撤销检索浮层(全局检索改为 P1 业务板块) | 按新版 `2a`/`2b` 重做第 4 步。逐条依据:`2b` §三/§四/§一第 2 条+§九第 2 条/§九第 8–15 条/§五(39 块);`2a` §一第 2 条、§三 F7/F8/F14、F10 |
|
||||
| V2 复核棒(2026-10-09) | ①新增 `3b-实测记录.md`(自检 77 项全文、变异 20/20、三条骨架反向变异、16 档逐视口、四条改动明细);②本份补 §6.1 逐视口表 + §八 Gate-1 加「实测依据」列;③`_tools/` 补齐到 8 个脚本(新增 `tab_close.py`,`cap.py`/`grab_selftest.py` 改单标签复用);④`_gate_shots/` 补到 17 张视口帧 | 第 4 步只差「闸门取证 + 台账上报」。⛔ **未重做界面**:原型仅动 4 处(自检重入死循环守卫 / 「功能入口层残留」判据改八页逐页查 / `hashchange` 守卫回退 + 注释 / `check_skeleton.py` 判据由「互为前缀」收紧为「剥注解后严格相等」),几何与骨架一格未动 |
|
||||
| **V3 本轮(2026-10-09,用户令)** | ①**P8 记录与对账整页并入 P7 复盘台**:`pageP8` 删除、四个板块接进 `pageP7`、动作 ID 由 `P8-01…04` 改 `P7-09…12`、`FROZEN` 的 p7 由 6 块改 10 块、`PAGES` 由八页收成七页;②**导航压成一层七项**(首页/选题/创作/投放/复盘/账号/资产,资产排最后):删 `NAV_GROUPS`/`NAV_CROSS` 与 `.nav-group`/`.nav-group-label`/`.nav-cross` 及其 `≤640` 规则,改 `NAV` 数组 + `renderNav()`;③**侧栏由 `184px` 收窄到 `128px`**,侧栏品牌名隐藏(顶栏已写全称),`.nav-item` 内衬 `0/12 → 0/8`;④**功能 ↔ 板块一一对应**做成机检:`FN_HOME`(功能→归属页)+ `FN_MAP`(页→板块→功能)+ 自检 5b-3 双向查;⑤自检新增 **3a-0 页集合正好七页**、3a/3b 重写为「一层七项、零组标、项名与顺序照用户口径」;⑥`renderSelftest()` 的兜底分支改成**吐可读输出**(原来崩了就不带 `#selftest-out`,取证工具全瞎) | 按用户口径改导航层级与 P8 归属,并同步 `2a`/`2b` V3。逐条依据:`2b` §〇/§三/§五 P7/§六 第 6·14·18 条/§九;`2a` §二/§三 F12·F13/§四/§十。⚠️ 侧栏收窄是③段的判断(几何不在样式库内):`184px` 的唯一理由是容下组名,组名撤掉后该理由消失 ⇒ **可推翻,改一处 `--nav-w` 即回退** |
|
||||
| **V4 本轮(2026-10-10,八条口径)** | ①**P2 选题库加「类型」维度**:第二个 `.seg`(全部/选题/对标线索/评论洞察/数据异动/灵感)+ 选题行加「类型」列,与「进度」正交(新 ID `P2-12`;`TOPICS` 逐条补 `type`);②**P2 删掉「灵感速记」板块**(骨架 5 → 4 块),随手记只留全局入口(撤 `P2-11`);③**P3 职责改「统一管理」**,页面副标题与分档对齐,入库不限页;④**P4 版本管理**展开单位由「账号 × 平台」改「**平台账号**」(按钮文案、说明、`P4-11` 实现与提示同步);⑤**P5 目标选择改两级**:数据由 `targets:{accounts,platforms}` 改 `{accounts,channels}`,新增 `PLATS`(平台账号=渠道,带登录态/授权状态),摘要区「目标渠道数/覆盖平台数」,各版本块写死「一个平台账号一版(一版一路)」,`P5-02`/`P5-03` 改为「内容账号连带渠道一起增删」;⑥**P6** 画像六维 → **画像五维**(删「平台」这一维与 `PROFILES` 的 `平台` 字段),**新增「平台账号」板块**(骨架 4 → 5 块,新 ID `P6-06`/`P6-07`),账号行次级信息改成「平台账号数」;⑦`FROZEN`/`OBJ_MAP`/`FN_MAP` 三表同步(总数仍 **39**);⑧本份 §1.2/§2.4/§五/§6.1/§八/§九 全量同步 | 按用户 2026-10-09~10-10 的八条口径改②段两份并重做原型。逐条依据:`2b` §〇/§一/§五 P2·P3·P4·P5·P6·P7/§九;`2a` §一 第 2·4 条/§二 对象字典/§三 F2·F4·F7·F9·F13/§九。⛔ 页面数、导航一层七项、流转 20 条、令牌与几何**一格未动**;⛔ 定时发布按用户口径挂起,本轮不落 |
|
||||
| **V5 本轮(2026-10-10,用户令两处)** | ①**侧栏改回设计供给的基准形态**:`--nav-w` 由 `128px` 改 `64px`,内衬 `8 → 3px`、圆角 `24 → 100px`;`.nav-item` 由「图标在左、名字在右」改**竖排**(图标在上 `24px`、名字在下 `12px/500/行高 16`、项 `56×78`、名字两字常驻,说明走悬停提示),计数徽章改悬右上角;`≤640` 的横滚标签条跟着改回横排小标签。②**刷新按钮改 icon 并挪到页面标题行右侧**:撤 `.page-shell-ops` 那一行与 `SP_LABEL` 七条文案,改 `.btn-icon` + `.shell-refresh`(`margin-left:auto` 右对齐,语义走 `title`/`aria-label`「刷新本页数据」);P4 同步。③自检新增 **3b-2 侧栏基准形态**、**3b-3 页面级刷新=标题行 icon** 两条判据;变异新增 **M25/M26/M27**(**27 / 27** 全过、基线回绿)。④`2b` §四 撤销「页面操作区」并同步七页框架行;本份 §1.1⑤/⑨/§2.3/§2.4/§2.5/§五 6/§6.1/§八/§九 全量同步 | 按用户 2026-10-10 两条口令:① `design-system-tiaoyue/SKILL.md` 行 95「左侧栏(`app-sidebar`,宽 `w-16`)」⇒ `w-16` = `64px` + 第八轮实测值;②「刷新按钮用 icon 按钮就行,一般和小标题一行、右对齐」。⛔ 导航项名与顺序、页数、每页板块、流转契约、其余任何交互**一格未动** |
|
||||
|
||||
---
|
||||
|
||||
## 八、Gate-1 方向门自检(硬闸)
|
||||
|
||||
> 结论列=本轮(V5)的判定;**实测依据**列=本轮现取的证据(自检项名 / 脚本名 / 变异编号 / 实测像素),⛔ 不是目测。全量证据见 `ui/3b-实测记录.md`。
|
||||
> V3 比 V2 多两行(第 13、14 行):V3 的两条主判据(页集合与导航层级、功能 ↔ 板块一一对应)各自单列,⛔ 不并进邻行糊过去。
|
||||
> V4 比 V3 多一行(第 15 行):那一轮的主判据是「八条口径落进骨架」。
|
||||
> V5 比 V4 多一行(第 16 行):本轮的主判据是「侧栏回基准形态 + 刷新改 icon 挂标题行」,单列一行;⛔ 不借用第 2/13 那几行的旧结论糊过去。
|
||||
|
||||
| # | 检查项 | 结论 | 依据 | 实测依据(2026-10-09 复核棒现取) |
|
||||
|---|---|---|---|---|
|
||||
| 1 | 设计契约十二字段 | ✅ 过 | §一 | 十二字段全填,无空、无「待定」;重复项逐页列了次级信息 |
|
||||
| 1b | 页型判定 | ✅ 过 | §一 | 自检「工具型纪律:零 `.eyebrow` / 零 `.lead` / 零 `.hero`」PASS;「`@keyframes` 共 0 处」PASS |
|
||||
| 2 | 结构骨架(翻译面) | ✅ 过 | §1.1 ⑤ | 骨架档=主区+侧区(给了理由);②段分档表每条信息都有落位(§1.2 逐页核对) |
|
||||
| 2b | 骨架未漂 | ✅ 过 | §1.2 | `_tools/check_skeleton.py` 正向 PASS:七页 **39 块**与 `2b-界面布局-新版.md` §五 逐页逐位一致;自检「骨架冻结:七页 39 个板块…逐位一致」PASS;反向变异 **M4**(塞板块)/**M19**(改页标题)/**M22**(页面表多一页)各报红 |
|
||||
| 3 | 状态覆盖 | ✅ 过 | §1.3 | 六态逐页有结论;自检「六态 × 七页 = 42 个组合全部渲染出内容」PASS;`disabled` 与 `无权限` 分开写 |
|
||||
| 4 | 令牌表 | ✅ 过 | §2.2/§2.3 | 自检实测对比度:`--warn` 对 surface = 5.93:1、`--accent-text` = 4.76:1、`--ink-faint` = 3.55:1(三条均过契约) |
|
||||
| 4b | 字阶定值表 | ✅ 过 | §2.3 | 七档各一个 px(12/14/16/18/20/24/30),相邻差 ≥2;自检实测**在用** 5 档:12/14/18/20/24 |
|
||||
| 4c | 高度层级 | ✅ 过 | §2.3 | L1/L2/L3 每层 ≥2 层叠层;自检「无单层死黑重阴影」PASS |
|
||||
| 4d | 布局脚手架 | ✅ 过 | §2.3 | 侧栏 `64px` + 主区 `minmax(0,1fr)`;自检实测 1440×900:侧栏 **64×606px**、顶栏 49px、主区 clientH 851 / scrollH 1392 |
|
||||
| 5 | 组件规格 | ✅ 过 | §2.5 | 按钮三档+卡片两档+输入框+徽章均为具体值;自检「首屏同屏主档按钮 ≤1 个」PASS |
|
||||
| 6 | 反 slop | ✅ 过 | §2.2 | 无紫→粉渐变;标题走展示体;强调色填充实测最高 0.52%(契约 ≤5%,在创作台) |
|
||||
| 7 | 拒绝清单 | ✅ 过 | §1.1 ⑩ | 共 **8** 条,每条带可判定判据(≥3 ✅);其中第 6/7/8 条由自检「组件口径」「Page Shell」「辅助入口区」三条判据 + 变异 M15 看住 |
|
||||
| 8 | token 引用完整性 | ✅ 过 | §2.1 | 三层结构;组件层只引语义层、语义层只引 primitive;无孤立 token |
|
||||
| 9 | 分档兑现 | ✅ 过 | §1.2 | 常驻=零点击可见、可点入=一次点击可达;档位未被本段改动(P7 前后两半合页后逐条重核) |
|
||||
| 10 | 供给核对 | ✅ 过 | §〇 | 选定套 `design-system-tiaoyue`,与上一版一致(沿用同一套) |
|
||||
| 11 | 对象冻结(本项目追加) | ✅ 过 | §1.1 ⑩ 7 | 自检「七页 39 个业务板块各带一个核心业务对象,取值全在 11 对象字典内」PASS;变异 **M17** 报红 |
|
||||
| 12 | Page Shell 不占板块(本项目追加) | ✅ 过 | §1.1 ⑩ 7 | 自检「七页各恰好 1 个,且都不带 `.block` / 不带 `.block-head h2`」PASS;逐页 `.block` 数 = `FROZEN` |
|
||||
| 13 | 页集合与导航层级(本项目追加,V3 新立) | ✅ 过 | §1.1 ⑤ | 自检「页集合正好七页,且与骨架表逐项相同(⛔ 页集合里没有 P8)」PASS +「导航一层七项…零组标 / 零跨组线」PASS +「导航七项与用户口径逐字一致、顺序相同…(资产排最后)」PASS;变异 **M21**(塞回组标)/**M22**(P8 复活)/**M16**(项名漂移)各报红 |
|
||||
| 14 | 功能 ↔ 板块一一对应(本项目追加,V3 新立) | ✅ 过 | §1.1 ⑤ | 自检 5b-3「功能 ↔ 板块一一对应:14 条功能各自落到归属页的板块上,39 个板块每个至少挂一条功能(无悬空、无孤立)」PASS;变异 **M23**(归属漂移)/**M24**(悬空功能)各报红 |
|
||||
| 16 | 侧栏回基准形态 + 刷新改 icon(本项目追加,V5 新立) | ✅ 过 | §1.1 ⑤ / §2.5 / `2b` §四 | ① 自检「侧栏基准形态:64px 药丸浮栏、导航项 56×78、图标在上(24px)名字在下(两字常驻);≤640 回横滚标签条」PASS;② 自检「页面级刷新:七页各 1 个 icon 按钮挂在页面标题行右侧(无文字、带 title/aria-label),⛔ 不再独立占一行」PASS;③ 变异 **M25**(栏宽回退)/**M26**(导航项横排回退)/**M27**(刷新又独立成行)各报红;④ 变异对照 **27 / 27** 全过、基线回绿;⑤ 逐视口 16 档整表重跑:不达标由 3 档降到 **2 档**(`560×900` 转绿),P1 行数逐档上升 |
|
||||
| 15 | 八条口径落进骨架(本项目追加,V4 新立) | ✅ 过 | §〇 / §1.2 / §2.4 | ① 骨架冻结「七页 **39** 个板块…逐位一致」PASS(P2 由 5 收 4、P6 由 4 增 5,一减一加);`_tools/check_skeleton.py` 正向 PASS;② 自检「页集合正好七页」「导航一层七项」「功能 ↔ 板块一一对应」三条全 PASS ⇒ 口径改的是**页内构成**,页集合/导航/流转一格未动;③ 交互清单 90 个 ID「无悬空、无未登记、0 死控件」PASS(撤 1 新增 3 已同步);④ 变异对照 **24 / 24** 全过、基线回绿;⑤ 逐视口 16 档整表重跑,不达标仍 3 档(与 V3 逐格同值 —— 未动被量的块) |
|
||||
|
||||
⇒ **Gate-1 二十一行全过。** 唯一未达线的是**密度契约**(窄屏两档:`500×844` / `390×844`,均为 P1 一屏不足 6 行),它属 3b 实测的登记项、⛔ 不属 Gate-1 门 —— 见 §6.1 与 `3b-实测记录.md` §八。
|
||||
|
||||
---
|
||||
|
||||
*本份是原型的绑定规范:原型只许引本份登记的 token。*
|
||||
|
||||
## 九、说人话自评(本轮改动的文字部分;判据源 `humanizer-zh`,五维各 10 分)
|
||||
|
||||
| 维度 | 分 | 说明 |
|
||||
|---|---|---|
|
||||
| 直接性 | 10 | §1.1 ⑤ 一上来就说清「64px 从哪来」——先引 `SKILL.md` 行 95 的 `w-16`,再给实测值;§五 缺口 6 把「红档从 3 降到 2」放在句首 |
|
||||
| 节奏 | 8 | 规范体裁、表格为主,改动段已补叙述,⚠️ 弱项未变 |
|
||||
| 信任度 | 10 | 逐视口整表重跑后如实写出「还剩 2 档不达标」,并把「为什么这次栏宽似乎起作用了、与 V2/V3 不矛盾」当场解释掉;两档红照旧留着不粉饰 |
|
||||
| 真实性 | 9 | Gate-1 第 16 行挂的是本轮现取证据(判据名 / 变异 27-27 / 16 档重跑);正文数(64×606、626→779px、绿 14 红 2)都可由本份与 `3b-实测记录.md` 当场复核 |
|
||||
| 精炼度 | 8 | 新增只落在 §1.1⑤/§2.5 两处 + §七 一行 + §八 一行;但 §五 缺口 6 与 §6.1 说明确实又长了一点 |
|
||||
| **总分** | **45 / 50** | 门槛 ≥45 ⇒ 压线过;扣分点仍全在「节奏 / 精炼度」两行(规范体裁,叙述段天然少) |
|
||||
|
||||
> 全量实测与两处改动的现象/根因/证据见 `ui/3b-实测记录.md`(该份自评 47/50)。
|
||||
File diff suppressed because it is too large.
Load diff
Reference in new issue
Block a user