关于 mobile-redesign-screen
mobile-redesign-screen 是用于审查和重设计单个移动屏幕或紧密关联的 2 至 3 屏流程的技能。它通过范围受控的审查与修复流程开展工作，同时保留导航和交互语义。
主要功能
- 01审查屏幕样式、布局与交互
- 02按严重程度标记问题
- 03提出聚焦的视觉调整
- 04通过前后对照跟踪逐项修复
- 05限制范围并监控变更风险
- 06检查移动设计预检项
适用场景
- 01重设计单个移动屏幕
- 02审查简短且相关的移动流程
- 03在不改变导航的情况下改善屏幕视觉
- 04跟踪视觉变更及未解决问题
安装
复制下面的命令，在终端中运行。
$
npx skills add https:/安装后在 Claude Code 中输入/mobile-redesign-screen确认已加载。
详细介绍
mobile-redesign-screen：单个屏幕，先审计
范围：一个屏幕，或一段紧密衔接的流程（2-3 个屏幕共同完成一项任务）。范围再大，就属于 mobile-redesign-app。
方法文件，请先完整阅读：../_shared/references/redesign-protocol.md（审计、杠杆、修复循环、风险管控）和 ../_shared/references/review-rubric.md（问题格式）。../_shared/references/tells.md 提供问题描述词汇。
流程
- 识别技术栈 + 审计（redesign-protocol.md）：检查屏幕当前使用的设计令牌或内联样式、拨盘读数、在路由树中的位置、标志性交互和无障碍改进。如果可以访问设备或预览，则截取 BEFORE 状态。
- 模式。 保留还是全面改造——如果不明确，就询问一次。
- 问题：仅针对该屏幕，按高/中/润色级别评级。
- 提出改进方案。 将采用哪些杠杆（字体/间距 → 颜色转为设计令牌 → 状态 → 反馈/动效 → 重新组合），分别解决哪些问题，以及哪些内容不会改变。发送一条简短消息；获得批准后继续，或在用户已表示“直接动手”时继续。
- 修复循环（redesign-protocol.md）：每个问题对应一个原子提交，每处视觉改动都提供前后对比，并遵守风险管控（变更超过 20% 时停止，最多修复 20 项）。
- 结束。 汇总已解决和未解决的问题、前后对比；如果存在
design-baseline.json或MOBILE-DESIGN.md，则更新它们（注明差异）。
严格边界
- 绝不更改： 路由名称、深层链接、在导航树中的位置、表单字段语义、用户已掌握的手势。如果某个问题需要更改这些内容，则将其报告为 SCOPE 外事项，并指向 mobile-redesign-app。
- 优先使用模块： 如果屏幕属于某种原型（设置、信息流、身份验证、付费墙、空状态），则将其与对应的
../_shared/blocks/模块进行对比，并优先向该模块靠拢，而不是另创第三种模式。 - 不扩大范围： 只有在改动不会影响其他屏幕的情况下，才更改与其他屏幕共用的组件；否则需先获得用户批准其影响范围。风险管控规定每个文件 +5% 的变更限额，正是为了让这类改动成本更高。
- 完成后，屏幕仍须通过 mobile-taste 第 14 节的预检——未通过预检的改版屏幕不算完成。
评论
支持 Markdown