前端设计模板使用说明
这套笔记用于收集前端网站的资源、要求、设计方向和实现约束。它既适合在 Obsidian 里整理，也适合让 Codex 读取后直接参与开发。
推荐工作流
- 新建项目时，复制整个「前端设计模板」文件夹。
- 先填写 [[前端设计模板/01 项目总览]] 和 [[前端设计模板/02 需求清单]]。
- 做设计前填写 [[前端设计模板/03 设计系统]] 和 [[前端设计模板/06 灵感与参考]]。
- 每个页面复制一份 [[前端设计模板/04 页面模板]]。
- 复杂组件复制一份 [[前端设计模板/05 组件模板]]。
- 重要取舍记录到 [[前端设计模板/08 决策记录]]。
- 需要交给 Codex 时，参考 [[前端设计模板/09 Codex 导入说明]]。
文件用途
- [[前端设计模板/01 项目总览]]：项目目标、用户、业务背景、成功标准。
- [[前端设计模板/02 需求清单]]：功能要求、范围、优先级、验收标准。
- [[前端设计模板/03 设计系统]]：视觉方向、颜色、字体、间距、组件规范。
- [[前端设计模板/04 页面模板]]：单个页面的目标、结构、交互和状态。
- [[前端设计模板/05 组件模板]]：复杂组件的 API、状态、交互和边界情况。
- [[前端设计模板/06 灵感与参考]]：竞品、参考网站、截图、喜欢和避免的点。
- [[前端设计模板/07 文案与内容]]：页面文案、按钮、空状态、错误提示。
- [[前端设计模板/08 决策记录]]：为什么这么做，哪些方案被放弃。
- [[前端设计模板/09 Codex 导入说明]]：如何把这些笔记稳定地提供给 Codex。
填写原则
- 写清楚「必须做」和「不要做」。
- 每条参考链接都写明喜欢它的具体原因。
- 截图尽量保存为本地图片，并在笔记里引用。
- 给 Codex 的要求越具体，生成结果越稳定。