@lark-apaas/coding-steering 0.1.16-dev.b14a724 → 0.1.16-dev.eef2d6c
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -20,9 +20,9 @@ available-agents:
|
|
|
20
20
|
- **欠填充**：主体撑不起页面，只靠放大标题、拉高卡片、拉开列距、把来源压到底部或增加空白来撑版面。
|
|
21
21
|
- **过填充**：页面被长句和大段正文塞满，缺少图、表、矩阵、路径、标注、层级和视觉转译。
|
|
22
22
|
|
|
23
|
-
|
|
23
|
+
页面应该被图、表、矩阵、KPI strip、路径图、截图标注、对比框架或稳定卡片 scaffold 撑住，而不是被大字号正文撑满。图表如果是本页主要证据，就必须成为主视觉，不是塞在角落里的小配件。经验标尺：普通内容页通常 80-160 个中文字符 / 英文数字词就足够；复杂矩阵、前后对比、案例拆解页可以到 200+，但必须用表格或分层结构承载；转场、封面、结尾页可以低文字密度。超过约 180 个可读文本单位时，先把散文压成短标签、表格单元、图表注释或拆页，而不是继续堆句子。
|
|
24
24
|
|
|
25
|
-
|
|
25
|
+
不要让页面滚动、溢出、重叠或用过小字体。放不下时先重构信息：合并相邻弱页、把散文改成表格 / 矩阵 / 时间线 / 注释图、压缩非关键留白；仍放不下再拆页。**不要把整份文档直接贴进幻灯片**——这是最常见的失败模式。落 plan 时就想清楚：哪些内容更适合做成表格、图表、流程、引用页或图片页。每页都要预留安全底边：页脚、页码、来源和正文之间必须有明确间距，主体元素不能贴到画布底部或被页面边界裁掉。
|
|
26
26
|
|
|
27
27
|
## 叙事、标题与 Storyboard
|
|
28
28
|
|
|
@@ -61,14 +61,14 @@ deck 每页先判断它要让观众完成什么阅读动作：抓结论、看证
|
|
|
61
61
|
- 主动做视觉转译：定量数据适合用趋势、对比、分布或构成图表达；流程、因果、层级、系统和时间关系适合用流程图、关系图、矩阵、时间线或信息图表达；产品、人物、地点和场景适合用有信息价值的图片表达。不要把适合可视化的信息重新写成一组文字卡片。图表和图示应表达明确结论，没有可靠数据时不虚构定量图表。
|
|
62
62
|
- 数据页先确定主图表。标题若在讲规模增长、区域分布、结构占比、趋势轨迹、驱动因素或方案对比，主图表 / 主表格必须成为有效视觉中心；KPI strip、说明文字、来源和注释只能辅助它。不要用固定宽度比例机械判断好坏，重点检查图表周围是否出现大块无功能留白，或图表是否被旁边的文字列表、脚注、装饰和空白压成小配件。可用全宽图、纵向大图、图表 + 侧栏、图表 + 注释带、矩阵或小倍数图，选择能让主体区域被有效利用的构图。
|
|
63
63
|
- 让内容容量决定版式。布局应适应真实信息量：内容少时放大核心表达并重组构图，可升格为观点页、图解页、图片页或并入相邻页；内容多时建立层级、图解、表格、矩阵或拆页。不要把内容硬塞进固定卡片，也不要让小块内容漂浮在大片空白中。
|
|
64
|
-
- 先算垂直预算再排纵向内容。表格、时间线、融资里程碑、排行榜、横向条形图、评分条和 checklist 都要按“标题区 + KPI 区 +
|
|
64
|
+
- 先算垂直预算再排纵向内容。表格、时间线、融资里程碑、排行榜、横向条形图、评分条和 checklist 都要按“标题区 + KPI 区 + 主体行数 × 行高 + 组间距 + 来源页脚安全区”估算高度。超过可用高度时减少行数、压缩文案、改成两列 / 矩阵 / 小倍数图，或拆页；不要让最后几行延伸到页脚或画布外。
|
|
65
65
|
- 根据当前页内容现场生成结构，不局限于常见页型。可以保留强文字页，也可以把材料转成模型图、关系图、流程、对比矩阵、时间线、象限、分层结构、地图、系统图、路径图、图表注释、截图标注或视觉隐喻；还可以把重要句子放大成观点页。示例只是启发，不是清单。
|
|
66
66
|
- 同一章节内可以有连续叙事，但每页的结构不必一样。核心页给足面积和视觉重量，支撑页可以更密集；重要概念可以用图形和标注解释，也可以用排版、引用、数字、对照文本或图文组合解释。
|
|
67
67
|
- 单页可以承载“小型演示过程”：先出现结论，再让支撑内容逐步显现，最后高亮关键判断。支撑内容可以是文字、数字、图形、数据、截图或关系结构；是否使用动效由表达目的决定。
|
|
68
68
|
- 如果一页只有少量概念，不要机械铺成几张卡片。先判断概念之间有没有关系：并列、递进、因果、闭环、漏斗、分层、坐标、路径、前后对比或组合模型。关系明确时可以画出来；关系不明确时，可以改成更有力量的文字观点页、引用页，或合并到相邻页。
|
|
69
|
-
- 如果一页出现“少量文字 + 大面积固定高度卡片 /
|
|
69
|
+
- 如果一页出现“少量文字 + 大面积固定高度卡片 / 巨大页脚空白”，视为欠填充，不要交付。优先补上结构性证据（口径、来源、对比基准、趋势、影响、风险、下一步），但表达要短：用数字、标签、表格单元、图表注释或路径节点，不要把每个证据都扩成一整句。没有足够内容支撑独立成页时，合并到相邻页。
|
|
70
70
|
- 如果一页出现“两列大段文字 + 底部 KPI 条 / 来源脚注”的组合，也视为过密且缺少设计转译。应改成对比矩阵、雷达/坐标、产品拆解图、流程图、截图标注、分层卡片或拆成两页；不要把竞品分析、案例复盘、风险应对写成左右两块说明书。
|
|
71
|
-
-
|
|
71
|
+
- 卡片高度应由内容和网格共同决定，不要用等高大卡片撑满版面。三栏卡片里每张只有 1-2 段短文时，改用横向流程、对照矩阵、双层信息卡或紧凑清单；每张卡如果超过 4-5 行正文，优先压缩成标签 / 表格 / 分组小项。只有内容确实接近等量时才使用大面积等高卡片。
|
|
72
72
|
- 版式变化来自内容关系，不来自凑组件。不要为了“丰富”而加无依据内容、无意义图标或装饰图形；图形、图片和动效只有在能帮助观众理解时才使用。
|
|
73
73
|
|
|
74
74
|
## 版式系统（写第一页前先定）
|
|
@@ -82,7 +82,7 @@ deck 每页先判断它要让观众完成什么阅读动作：抓结论、看证
|
|
|
82
82
|
}
|
|
83
83
|
```
|
|
84
84
|
1280×720 时整体 ×0.67。每个 font-size 都用 `--type-*`，每个 padding / gap 都用 `--pad-*` / `--gap-*`。`--pad-bottom` 是结构性的底部呼吸空间，不是空白；如果底部只是空着，应把空间交还给正文、图表、注释或合并页。
|
|
85
|
-
-
|
|
85
|
+
- 每页先定义一个安全内容区，而不是让元素各自漂浮。推荐在 slide 内使用一个 `.content` / `.layout` 容器承载主体，尺寸由 `inset: var(--pad-top) var(--pad-x) var(--pad-bottom)` 或等价 padding 控制；主体布局用 CSS grid / flex 的正常流、`minmax(0, 1fr)`、`min-height: 0` 和明确 gap 管理空间。只有装饰、页码、来源这类固定元素才适合绝对定位；表格、图表、列表、时间线不要用 absolute bottom / fixed height 去硬塞。
|
|
86
86
|
- 网页默认（14-16px 正文、48-72px 边距）对投影太小。标题 ≥ 48px，正文 / 注释**不得小于 24px**（验证器会对 < 24px 抛错）。用户说字号一般指 pt，按 PowerPoint / Keynote 换算：`px = pt × 1.333`（"标题 36pt" → CSS 设 ~48px）。
|
|
87
87
|
- 建立稳定布局锚点：标题、章节号、页码、来源、图表、主视觉和关键数字的位置不要随机漂移。规律来自章节、信息关系和跨页比较需要，不来自预设标签。
|
|
88
88
|
- 同一信息关系的页面要保持平行 scaffold，方便观众比较；不同信息关系再负责制造节奏。
|
|
@@ -96,13 +96,13 @@ deck 每页先判断它要让观众完成什么阅读动作：抓结论、看证
|
|
|
96
96
|
- **字体与排版角色**：根据主题建立标题、正文、数字 / 数据和注释的排版角色，角色可以共享字体。综合使用字体气质、字重、字宽、行长、语义换行、数字样式和文字位置形成层级，而不只是改变字号或统一使用粗黑体；展示文字可以有个性，正文必须稳定可读。
|
|
97
97
|
- 图片先判断内容和用途：摄影 / 氛围图可满版裁切；截图、图表、产品界面、架构图必须完整展示（aspect-fit），不能裁掉关键边界或文字；透明图 / 细线图放到有对比的底色上。图上压字用品牌常见方式保护可读性（遮罩、渐变、模糊或文字容器）。
|
|
98
98
|
- 视觉要有节奏变化：全图页、大数字页、表格页、引用页、流程页、文字页交替出现；不要整套都是同一种卡片。也不要每页硬加描边卡片、固定结论框或装饰分割线——只有内容需要分组时才用容器。
|
|
99
|
-
- 扁平基线：好的 deck
|
|
99
|
+
- 扁平基线：好的 deck 不依赖阴影和悬浮卡片堆叠。优先用全页背景、色带、分隔线、编号、表格网格、图片裁切、对比色块和尺度差建立层次。只有在需要表达真实物件、票券、照片或舞台层次时才少量使用阴影。
|
|
100
100
|
- 不用 emoji、不临时手绘复杂假图；优先用用户素材、品牌资产、图标库或真实图片。
|
|
101
|
-
-
|
|
101
|
+
- **空间重心**：页面元素应形成完整构图：留白有明确作用，独立元素与主体有可感知的关系，多栏内容在视觉重量和内容关系上协调。内容可以集中在上方并保留底部呼吸空间，这通常是正确的 slide 构图；但留白必须均匀、有意、有下界。内容页主内容应占版心高度约 2/3 以上；同一页一处大空、一处拥挤要重排。允许不对称构图，不要求左右元素数量、尺寸完全相等；通过面积、色彩、留白、位置和视觉重量形成平衡，避免机械平分页面。双栏 / 多栏失衡时改不对称栅格、调整主次关系或并回单栏。内容不足以独立成页时，合并、重构或升格为确有价值的观点页，不单纯放大数字、卡片或增加留白撑页。
|
|
102
102
|
- **信息重心**：主内容区应显得有事可读，来源、页码和装饰不能成为主要视觉重量；证据说明应尽量靠近对应内容，避免制造无意义的纵向空洞。
|
|
103
|
-
-
|
|
104
|
-
- **底部安全区**：正文、图表、表格、条形图和列表必须整体落在安全区域内，和页脚 / 来源 / 页码保持可感知间距。不要把条形图最后一行、表格最后一行或长标签压到页面底边；不要用 `position:absolute`
|
|
105
|
-
- **图表尺度**：图表、表格、结构图和截图标注要按“可阅读的分析对象”设计，不按“装饰素材”缩小。主图表应形成明确视觉中心，并有足够轴线、标签、图例和注释空间；如果图表周围留白过多，优先放大图表、增加与图表直接相关的标注 / 口径 / 对比基准，或重排为更紧凑的图表 + 侧栏 /
|
|
103
|
+
- **容量与边界**：重复排列卡片、指标、步骤或图表前，先根据条目数量、文字长度、间距和可用区域判断能否容纳。空间不足时调整构图、压缩或合并信息、减少非必要元素或拆页，不得依靠 `overflow: hidden` 裁掉内容。最终按实际渲染尺寸检查完整元素和元素组是否仍在页面安全区域内。
|
|
104
|
+
- **底部安全区**：正文、图表、表格、条形图和列表必须整体落在安全区域内，和页脚 / 来源 / 页码保持可感知间距。不要把条形图最后一行、表格最后一行或长标签压到页面底边；不要用 `position:absolute` 把元素硬钉在底部来“刚好塞下”。如果底部空间不足，优先减少行数、合并组、拆页或重新选择横向构图。
|
|
105
|
+
- **图表尺度**：图表、表格、结构图和截图标注要按“可阅读的分析对象”设计，不按“装饰素材”缩小。主图表应形成明确视觉中心，并有足够轴线、标签、图例和注释空间；如果图表周围留白过多，优先放大图表、增加与图表直接相关的标注 / 口径 / 对比基准，或重排为更紧凑的图表 + 侧栏 / 注释带结构。如果放大后其他信息放不下，先减少旁支、改成侧栏 / 脚注 / 下一页，而不是缩小主图表。多个小图同时出现时，必须有一个主图或改为矩阵 / 表格，避免所有图都小而轻。
|
|
106
106
|
- **图表优先**：工作汇报、客户案例、趋势观察、竞品分析这类 deck，连续 2-3 页纯文本卡片后必须切换到图表 / 表格 / 矩阵 / 图片标注 / 流程或 KPI strip。文本卡片可以存在，但不能成为整套 deck 的主要填充方式。
|
|
107
107
|
|
|
108
108
|
## HTML 实现（deck-stage 外壳）
|
|
@@ -136,13 +136,13 @@ deck 每页先判断它要让观众完成什么阅读动作：抓结论、看证
|
|
|
136
136
|
- 构图完整：留白与主体关系明确，没有孤立漂浮、局部拥挤或失衡的多栏布局。
|
|
137
137
|
- 边界溢出检查：逐页确认所有文本、表格行、条形图、图例、数值标签、来源和页码都在画布安全区内；元素组的底边不得低于页脚安全线。凡是需要 `overflow: hidden` 才不露馅、或最后一行贴底 / 被裁切 / 与页脚碰撞，都必须重排。
|
|
138
138
|
- 实测边界检查：以浏览器实际渲染结果为准检查 bounding box，不以设计意图或静态 CSS 推断为准。每页所有可见元素的 `top/left/right/bottom` 都必须落在 slide 可视区域内；主要内容还要避开页脚 / 页码 / 来源所在的安全带。若任一元素超界、被父容器裁切、被 transform 推出画面、或与固定页脚碰撞，不允许交付。
|
|
139
|
-
-
|
|
140
|
-
-
|
|
139
|
+
- 欠填充检查：主内容视觉占用明显低于页面可用区域 60%，或卡片内部空白超过约 45%，或一屏只有 2-4 个孤立数字 / 短段落时，必须重构；不能用放大卡片、拉开列距、把来源压到底部来撑页。
|
|
140
|
+
- 过密检查：正文如果主要由长句组成、单页超过约 180-220 个可读文本单位、或单个卡片连续 5 行以上正文，必须先压缩文案并转成表格 / 矩阵 / 图表注释 / 视觉节点；不要通过缩小字体硬塞。
|
|
141
141
|
- 信息密度检查：每页应包含结论、证据和上下文中的至少两类，但证据可以是数字、图、表、来源、对比基准、趋势箭头或截图标注，不要求都写成句子。指标不能只有大数字，还要有口径 / 来源 / 对比基准 / 趋势 / 影响说明中的必要项。流程不能只有“动作 / 结果”两段短文塞进大卡片，优先用表格、泳道、时间线或 checklist。
|
|
142
142
|
- 图表主视觉检查：如果本页结论依赖趋势、对比、构成、分布或表格证据，主图表 / 主表格是否形成明确视觉中心；图表周围是否有大块无功能留白；KPI strip、文字列表、来源和装饰不得比主图表更抢视觉重量。若图表看起来像角落里的小配件，必须放大、补充相关标注或重排构图。
|
|
143
143
|
- 内容容量检查：布局是否适应真实信息量；内容少时有没有重组为更强核心表达、图解或合并页，内容多时有没有建立层级、图解、表格或拆页；不能硬塞进固定卡片，也不能让小块内容漂浮在大片空白中。
|
|
144
144
|
- 页码、来源和固定页脚不与正文争用空间；逐页检查文字、图片和固定元素没有遮挡或碰撞。
|
|
145
|
-
-
|
|
145
|
+
- 留白与平衡：同一页没有一处大空、一处拥挤；内容页主内容占版心高度约 2/3 以上；允许不对称，但左右 / 多栏应通过面积、色彩、留白、位置和视觉重量取得平衡，避免机械平分。
|
|
146
146
|
- 只读标题能讲通故事；标题语法全程一致，没有 punchline / takeaway 盒子。
|
|
147
147
|
- 已建立 storyboard，并从整套缩略图检查页面轮廓；不同内容关系没有被连续压成相似的卡片网格或单一上下布局。
|
|
148
148
|
- 转场页推动叙事，而不是只做装饰。
|