个人笔记 · 2026-04-29 17:31:23 CST
首页模块调整的 AI 协作提问复盘
复盘首页个人笔记、关于我模块和卡片样式调整过程中的提问方式，总结哪些表达清楚、哪些可以补充验收标准。
记录时间：2026-04-29 17:31:23 CST
本轮协作目标
这轮主要是在首页已有结构基础上，继续调整模块宽度、增加个人笔记入口、重做关于我入口，并把卡片细节打磨到更统一。
这不是大规模重构，而是一组连续的 UI 微调。关键不在于一次说完所有需求，而在于每次都指出具体页面、具体模块和明确差异。
我提出的问题
- 首页底部模块宽度比上面的模块多出来了，请修改。类型：bug 排查 / 样式调整。
- 首页添加个人笔记列表，展示最近 3 条，使用列表形式，有“个人笔记”标题，“查看全部”跳转到个人笔记页面。类型：结构新增。
- 个人笔记模块每一条采用白底、圆角、有阴影的设计。底部关于我模块也要设计成标题“关于我”和“查看全部”跳转。类型：视觉统一 / 结构重构。
- 个人笔记和关于我卡片里的箭头去掉。类型：样式细节调整。
- 关于我卡片里的内容右边留白太多，修改为文字到右边框的距离和左边对齐。类型：视觉细节修正。
- 使用
write-collaboration-review-noteskill 生成本轮协作复盘。类型：总结复盘。
好问题
| 问题 | 为什么好 | 可复用提问方式 |
|---|---|---|
| “首页底部模块宽度比上面的模块多出来了” | 指出了页面、模块和视觉差异。AI 可以直接检查容器宽度、margin、max-width，而不是泛泛地“美化”。 | “某页面的 A 模块比 B 模块宽，请检查容器宽度、margin、padding，并让它们视觉对齐。” |
| “首页添加个人笔记列表，展示最近的 3 条” | 有数据范围、数量、展示形式和跳转目标，属于可直接实现的需求。 | “在某页面新增某模块，数据来源是某 collection，展示最近 N 条，点击跳转到某详情页。” |
| “每一条都采用白底、有圆角、有阴影” | 给出了明确视觉属性，避免 AI 自行选择列表、分割线或卡片样式。 | “把列表项改成独立卡片：白底、圆角、轻阴影、保留整行点击。” |
| “箭头去掉” | 目标很小，范围很明确，能直接清理模板和对应样式。 | “去掉某模块卡片里的某元素，并清理对应 CSS。” |
| “右边留白太多，文字到右边框的距离对齐左边” | 虽然是视觉反馈，但已经说明了问题方向：左右内边距不一致或内容宽度被限制。 | “某卡片内文字列右侧留白过大，请检查 max-width / grid / padding，让内容区撑满卡片内部宽度。” |
可改进的问题
| 原问题 | 问题在哪里 | 更好的问法 |
|---|---|---|
| “展示最近的3三条” | 语义能理解，但有错字。AI 通常会自动纠正，不过正式需求里最好减少歧义。 | “展示最近 3 条个人笔记，按 date 倒序。” |
| “使用列表形式” | “列表形式”可以是分割线列表，也可以是卡片列表。后续又补充了白底圆角阴影，说明最初还可以更具体。 | “使用列表结构，但每条视觉上是独立卡片，不使用表格。” |
| “也要设计成标题 关于我 查看全部跳转” | 方向明确，但跳转目标需要 AI 推断是 /about。 | “关于我模块也改成标题行：左侧标题‘关于我’，右侧‘查看全部’，链接到 /about。” |
| “右边留白太多” | 已经能定位，但如果附带截图或说明桌面端 / 移动端，会更快验证。 | “桌面端关于我卡片文字列只占左侧，右边空太多。请只改首页关于我卡片，让文字区撑满卡片内部宽度，左右内边距一致。” |
下次直接复制的提问模板
视觉调整类
请调整首页的 [模块名]。
当前问题：[具体视觉问题，例如右侧留白太多 / 宽度比上方模块宽 / 卡片之间间距不一致]。
目标效果：[具体规则，例如左右内边距一致，和上方内容容器对齐]。
修改范围：只改首页模板和相关 CSS，不改其他页面结构。
验收：桌面端和移动端都不横向溢出，模块宽度视觉统一。
bug 修复类
首页 [模块名] 出现了 [异常现象]。
请先定位原因，再修改。
重点检查：HTML 结构、CSS 容器宽度、max-width、margin、padding、响应式规则。
验收：和 [对照模块] 的左右边界一致。
内容生成类
请基于本轮对话生成一篇个人笔记复盘。
时间范围：从上一篇复盘之后到现在。
重点：
1. 我提了哪些问题。
2. 哪些问题表达清楚，为什么。
3. 哪些问题可以改得更具体。
4. 下次可以复用的提问模板。
要求：沿用 content/notes 现有 frontmatter 格式，保存为新 Markdown 文件。
组件重构类
请把首页的 [模块 A] 和 [模块 B] 统一成同一套模块结构。
每个模块都包含：标题、查看全部链接、内容卡片。
差异只保留在内容展示方式上。
要求：不要改数据 collection，不要改详情页，只改首页结构和样式。
本轮最大的经验
- UI 微调最有效的表达方式，是“当前差异 + 目标对齐对象”，比如“底部模块比上面宽”。
- 先说结构，再说视觉属性，比单纯说“设计一下”更稳定。
- 小问题可以连续提出，但每次最好只改一个清晰目标，这样返工成本低。
- 对卡片类界面，要明确是“列表结构”还是“卡片视觉”，二者不是一回事。
- 视觉留白问题最好指出是 padding、内容宽度还是容器宽度；如果不确定，也可以要求 AI 检查这三类原因。