用途
该技能用于设计 Android 界面或流程。其交付物是带设备外框的 HTML 原型稿（按目标窗口尺寸类别）以及一份可供 Compose 使用的交接规范（颜色、字体、形状、间距、状态、色调高度）。该技能从不编写 Jetpack Compose 代码，实现工作留给 Android 开发者。
主要能力
- 将设计系统令牌映射到 Material 3 字体角色。references/type-scale.md 提供 15 个角色的基线比例（displayLarge 57/64sp … labelSmall 11/16sp，Roboto）。Material 3 Expressive 在其上增加一套平行的 15 角色 Emphasized 集（共 30 个角色），用于更强的视觉节奏；默认使用基线，当设计方法要求相应基调时再使用 Emphasized。来源：m3.material.io/styles/typography/type-scale-tokens。
- 将令牌映射到 Material 3 颜色角色。references/color-roles.md 记录了从种子颜色派生的核心角色族（primary/secondary/tertiary + surface/onSurface）。Material 3 的完整角色系统更大——45 个颜色角色，包括 surface-container 阶梯（从低到高：surfaceContainerLowest、surfaceContainerLow、surfaceContainer、surfaceContainerHigh、surfaceContainerHighest——5 个层级，用于在不使用阴影的情况下分层表面）、error/onError/errorContainer（保持静态，绝不从动态种子派生，因此无论主题如何错误状态都保持清晰），以及动态颜色：在 Android 12+ 上，所有角色都可以从用户的壁纸/种子进行色调生成，而不仅仅是设计种子。来源：m3.material.io/styles/color/roles、m3.material.io/styles/color/system/how-the-system-works。缺口：color-roles.md 记录的是核心族，而非完整的 45 角色/surface-container 枚举——在扩展该参考文件之前，请使用上述事实。
- 将令牌映射到形状。references/shape-scale.md（绝不使用任意 border-radius）。Material 3 的完整形状比例扩展到 32dp、48dp 和 Full（胶囊形），超出当前列出的范围——Expressive 默认按钮为胶囊形（Full），除非产品原因要求更小的圆角。来源：m3.material.io/styles/shape/shape-scale-tokens。缺口：shape-scale.md 止于 28dp（Extra Large）；在扩展之前，请在上面的 m3.material.io 页面重新确认 32/48/Full。
- 将高度作为令牌应用，而非临时阴影。6 个层级，0 → 5，映射到 0 / 1 / 3 / 6 / 8 / 12dp。高度在每个层级通过阴影表达——旧的仅 surfaceTint 方法已弃用；不要仅依赖色调来传达高度。来源：m3.material.io/styles/elevation/overview。缺口：尚无 references/elevation.md——这些令牌值有依据但内联于此，待专门的参考文件。
- 从 references/window-size-classes.md 选择窗口尺寸类别——按匹配目标设备类别（手机/折叠屏/平板/桌面）的 dp 宽度进行原型设计。
- 构建 HTML 原型：一个以 dp 等效 px 设定尺寸的设备外框 <div>，全程遵循 4dp 基准 / 8dp 网格。
- 验证触控目标和间距：最小触控目标 48×48dp，相邻目标之间间距 ≥ 8dp——参见 references/touch-targets.md。
- FAB：从 3 个层级中选择一个，按屏幕主要操作的权重设定尺寸——小号 FAB 在 Material 3 Expressive 中已弃用，不要使用。来源：m3.material.io/components/floating-action-button/overview。缺口：尚无专门的 FAB 参考文件；在最终确定原型之前，应在上述页面重新确认 3 个保留层级及其确切 dp 尺寸。
- 动效：Material 3 Expressive 使用基于弹簧物理的动效（而非固定时长/缓动曲线）来实现其标志性手感；在未指定弹簧动效的地方，旧版时长/缓动曲线令牌仍然适用。来源：m3.material.io/styles/motion/overview。缺口：尚无 references/motion.md——在存在之前，请在交接规范中明确注明弹簧与旧版缓动的选择。
- 按 references/handoff-compose.md 编写交接规范：颜色 → MaterialTheme.colorScheme.，字体 → MaterialTheme.typography.，形状 → MaterialTheme.shapes.*，自定义间距比例（以 dp 为单位），明确尺寸，状态 + 色调高度（命名高度层级 0–5，而不仅仅是“凸起”/“扁平”），以及 start/end（绝不使用 left/right）以确保 RTL 正确性。
使用方式
输入：design-system.md——OKLCH 调色板、字体方向、动效个性；要原型设计的界面/流程以及目标窗口尺寸类别。
步骤：
- 将令牌映射到 Material 3 字体角色。
- 将令牌映射到 Material 3 颜色角色。
- 将令牌映射到形状。
- 将高度作为令牌应用。
- 从 references/window-size-classes.md 选择窗口尺寸类别。
- 构建 HTML 原型。
- 验证触控目标和间距。
- 选择 FAB 层级。
- 处理动效。
- 编写交接规范。
失败处理：
- 截图/预览工具不可用 → 在交接规范中用精确的 dp 值描述原型，而不是因视觉稿而阻塞。
- 所需事实不在下方参考中 → 在输出中标记为“需在 developer.android.com / m3.material.io 上重新确认”；绝不编造数字。这尤其适用于步骤 2–4、8、9 中标记的缺口（完整的 45 角色颜色系统、32/48dp/Full 形状、FAB 层级 dp 尺寸、动效弹簧参数）——这些参考文件尚未扩展/创建；不要静默地回填编造的数字来填补缺口。
适用场景
在已有设计系统令牌之后使用。适用于需要为 Android 界面或流程产出带设备外框的 HTML 原型稿和开发者交接规范的场景。
限制
- 该技能从不编写 Jetpack Compose 代码。
- 部分参考文件尚未创建或扩展，存在缺口：完整的 45 角色颜色系统、32/48dp/Full 形状、FAB 层级 dp 尺寸、动效弹簧参数、高度令牌参考文件、动效参考文件。
- 输出：带设备外框的 HTML 原型稿（按目标窗口尺寸类别）；handoff.md（或等效文件），包含 Compose 主题映射、间距、尺寸、状态、色调高度（层级 0–5），可供 Android 开发者使用。
- 下一步 → design-review（以原型为范围：对原型截图、验证对比度，不做完整站点审计循环）。
参考文件
- references/type-scale.md：规范的 Material 3 基线字体比例——已验证 material-components-android（Expressive Emphasized 集：见步骤 1，尚未成为单独文件）。
- references/shape-scale.md：规范的形状/圆角半径比例——已验证 m3.material.io（止于 28dp——32/48/Full 缺口，见步骤 3）。
- references/color-roles.md：规范的 Material 3 核心颜色角色族——已验证 m3.material.io（45 角色/surface-container/动态颜色缺口，见步骤 2）。
- references/window-size-classes.md：规范的窗口尺寸类别——已验证 developer.android.com。
- references/touch-targets.md：48×48dp 目标 + 8dp 间距——已验证。
- references/handoff-compose.md：可供 Compose 使用的交接规范格式。
缺口（有依据的事实，尚无参考文件——内联于上述步骤中，标记为未来 references/elevation.md、references/motion.md、FAB 层级细节）：高度令牌 0–5、FAB 层级、弹簧动效。