在需要设计、实现或评审网站与 Web 应用 UX/UI 时…

当你需要设计、实现或评审网站/Web 应用的界面与交互（信息结构、用户流程、响应式布局、视觉系统、内容与交互状态）时，按此流程从真实内容出发、先结构后装饰、实现完整状态并实际验证。

适用场景

解决思路

1. 先明确真实的设计任务：阅读需求、现有实现、设计系统、素材和相关内容，识别用户、页面目的、关键旅程、品牌信号、目标平台和约束；使用已提供的答案，推断常规默认值，并说明有影响的假设，而不是重复发问卷。
2. 对于局部打磨请求，保持局部修改，除非结构性问题阻碍了所请求的结果；对于新站点，选择连贯的方向并实现所请求的交付物，而不是只返回规划文档；对于审计，展示实质问题、位置、影响和具体修复方案；只有截图时不要声称与页面交互过。
3. 先结构后装饰：追踪用户从进入到完成和恢复的关键任务，让标签、内容顺序、导航和反馈无需内部术语即可理解；保留做决策所需的上下文，更少的文字或点击不一定更好；区分必需步骤与意外摩擦（权限、确认、取消、帮助入口）。
4. 从内容和优先级出发做布局，而不是套用通用应用外壳；使用有意义的编组、对齐和留白；定义真实长文本、翻译、缺失图片、表格、错误、加载、空结果和成功状态如何呈现；为窄屏、缩放和键盘使用设计信息顺序与控件，而不只是缩小版桌面截图。
5. 给界面一个视觉观点：优先使用项目已有的视觉系统；新方向时选择少量有意图的特征（如出版物的编辑式排版与非对称构图、技术工具的精确紧凑控件、酒店网站的大幅摄影与温暖材质），这些是可能方向而非模板。
6. 先通过字号、字重、行长、间距、对比度和位置建立层级，再添加装饰；以一致的间距/字号比例作为起点，然后允许有理由的视觉或内容特定调整；根据构图使用边框、阴影、背景和插画，不要一概偏好阴影优于边框。
7. 让主导内容和操作可见，次要信息更安静；使用有意图的图像和裁剪/焦点选择，而非随意图库素材；只使用有合适授权的素材；不要为填充布局而编造客户 logo、评价、奖项、统计数据或产品能力；合成内容标记为占位符；避免虚假稀缺、隐藏拒绝或误导性价格呈现。
8. 使用克制、有目的的动效来帮助定位或反馈，并提供减少动效和可用的静态状态；不要为简单 CSS 已能实现的效果引入重型库、动画系统或客户端边界。
9. 实现完整状态与语义：按钮作为操作、链接作为导航；使用现有组件系统和框架约定；重设样式时保留 refs、焦点、表单提交、校验和加载/错误语义；看起来禁用的控件必须有正确的交互行为；定义网络失败、重复激活、取消或数据过期后的行为，视觉反馈不能证明写入成功。
10. 表单要保留已输入数据，错误要具体且可恢复；菜单/对话框/标签页使用合适的语义模式和键盘/焦点行为，而不只是带 role 属性的样式容器；不要将重要内容隐藏到脆弱的 JavaScript 显示成功之后；字体/媒体加载时保持布局稳定。
11. 阅读 accessibility 参考做针对性检查；对比度比值或自动化扫描只是一项证据，不是无障碍合格证书。
12. 检查、测试并迭代：快速第一印象或启发式走查是有用的专家检查，但不是有测量的用户测试，不能确定转化率或任务成功率；若要求测试，使用真实参与者或观察到的交互，并记录范围、条件和结果；不要编造成功的扫视测试。
13. 实现时在授权范围内运行相关项目的 typecheck/build/tests，然后在有意义的宽度、缩放/文字大小、交互状态和输入方式下检查渲染输出；检查焦点、可访问名称、滚动、裁剪、内容换行和浏览器/控制台失败；记录实际测试了什么；静态截图不能确定键盘或屏幕阅读器行为，测试计划不等于完成的测试；避免无依据的性能或转化声明。
14. 交接时给出实际补丁或所请求的设计产物、变更的 token 和有用的组件/状态规则，以及未解决的验证事项；小改动不需要新的站点地图、完整设计系统或七段式报告；当工作已服务任务时停止，不要为新颖而不断重设计已连贯的选择。
15. 只加载相关参考：视觉设计（排版、层级、构图）、信息架构（导航与结构）、交互（状态、控件、表单）、内容（有用标签与微文案）、响应式（内容主导布局与边界情况）、无障碍（语义与输入检查）、设计审计（finding/impact/fix 格式）、页面模式、可用性、工作流和清单（可选深入方法，非强制输出格式）。
16. 参考/脚本路径属于已安装的技能目录，而非目标项目；较旧的数字设计范围是可调整的启发式，不是通用标准；没有来自实际界面的证据，不要声称可用性、无障碍、转化或性能改进。
17. 作者基线审查于 2026-09-13：https://agentskills.io/specification；当前无障碍来源列在 accessibility 参考中。

适用边界 · 注意事项

• 只拿到静态截图时，不要声称已与页面交互或验证了键盘/屏幕阅读器行为。
• 不要把小范围的组件编辑扩大成未被请求的产品整体重设计。
• 不要在没有真实参与者或观察交互的情况下编造用户测试、转化率或任务成功率结论。