浏览 AI使用教程

写代码前先定信息架构、页面状态和异常路径

只画登录后的理想页面，开发到最后一定会补空状态、失败状态和权限分支。先把页面、状态和异常路径列全，接口与组件才有稳定边界。

沿完整工作流推进

前一阶段的可检查结果，是下一阶段的输入；中间证据不足时停在当前阶段。

沿同一任务走到交付

设计稿只有登录成功后的看板。开发完成后才发现还缺未登录、首次空数据、加载失败、无权限和会话过期，排期被迫重估。

本例材料

需要确认	本例内容
现有材料	产品包含登录、项目列表和项目详情三页；角色为成员与管理员；接口可能返回 401、403、404 和 500。
不能越过的边界	先列页面、状态和转移，再做视觉；错误状态必须给用户下一动作；权限由后端验证。
要交付的结果	页面清单与状态矩阵

处理记录

当前阶段	实际处理
列用户任务和入口	按用户目标而不是部门或数据库表组织导航，标明主要入口和返回路径。
画页面与数据关系	每个页面写核心对象、主要动作、来源和去向，删除没有任务的展示页。
补全常规状态	加载、空、部分数据、成功、校验错误、系统错误和离线各自定义可见反馈。
补权限与危险动作	未登录、无权限、只读、删除、付款和发布要有阻止、解释和确认路径。
用主流程走一遍	从首次进入到完成任务逐屏检查返回、刷新、重复提交和中断恢复。

页面/状态	触发	可见反馈	下一动作
登录/未登录	无有效会话	登录入口并保存允许的站内回跳	成功后返回项目列表
列表/加载	GET /projects 未完成	加载提示，保留筛选	等待或取消
列表/空	结果[]	有创建权限显示创建项目，否则说明暂无可见项目	创建或清除筛选
列表/错误	请求500	保留筛选并显示重试	重试相同请求
详情/不存在或隐藏	契约返回404	资源不存在或不可访问，不确认其存在	返回列表
详情/已知资源无操作权限	契约允许暴露存在性且返回403	显示只读信息或联系管理员，按产品约定	返回列表或申请权限
任一页/会话过期	401	先保存可恢复的非敏感输入	重新登录并校验回跳

响应语义和资源可见性应由后端与产品共同确定；前端隐藏按钮不能替代服务端权限。

最终输出

预期矩阵覆盖登录、项目列表与项目详情。列表空态仅向有创建权限者显示创建入口；详情403还是隐藏资源存在性的404由接口契约决定，前端不得自行把两者互换。

常见失败

验收方式

关键页面都有加载、空、错误和权限状态状态转移可以从入口走通接口状态与页面文案一致

进一步核对

从用户需求、服务流程、可访问性和上线运行条件组织产品，而不是只列功能愿望。

涉及账号、权限和数据的项目应在设计阶段写入可验证的安全要求。