impeccable 原生 Android 设计准则用 Material 3 让 AI 交付可信的 Android 体验【免费下载链接】impeccableThe design language that makes your AI harness better at design.项目地址: https://gitcode.com/GitHub_Trending/im/impeccableimpeccable 是面向 AI 编程/设计助手的一套设计语言与技能体系其目标正如项目描述所言——让 AI harness 更懂设计。当目标表面是原生 Android 应用时技能会加载 android.md 作为平台规则手册无论 Jetpack Compose、Android Views、React Native、Expo 还是 Flutter只要最终装到 Android 硬件上都以这份准则为校验基准。读完本文你将掌握 impeccable 对原生 Android 界面的全部硬性规范布局、触控、排版、色彩、组件与动效以及一套可复制的adb真机/模拟器验证流程并能理解这份参考在技能路由体系中如何被调用与测试。一、这份文档在 impeccable 中的位置与职责impeccable 的技能目录下reference/汇集了按领域拆分的规则文档其中android.md是原生平台三件套之一ios.md覆盖 Apple 硬件、android.md覆盖 Android 硬件而跨平台、需要同时遵守双方系统保证的情形则对应adaptive。这一点可以从两个副本得到印证仓库根目录的 skill/reference/android.md 与各 AI 客户端目录如 .kiro/skills/impeccable/reference/android.md、plugin/skills/impeccable/reference/android.md中的副本内容一致区别仅在于skill/下的正本为每条规则标注了形如!-- rule:android-layout-adaptive-nav --的机器可读规则 ID。从 .kiro/skills/impeccable/SKILL.md 的说明可以看出它的调用时机命令表中的adapt [target]、audit [target]都区分Web 与原生变体adapt.native.md明确写着——当平台为ios/android/adaptive时应先阅读目标平台的 ios.md 或 android.mdinit在记录到原生平台时也会自行加载对应参考文档。也就是说android.md并不是一份孤立的设计博客而是adapt、audit、animate、polish等一系列命令在 Android 项目上共用的事实标准与评分依据。核心原则一句话概括在原生平台访客模式会收窄表现层可以覆盖的范围——结构、导航与交互在任何模式下都由 Material Design 3 主导品牌只能通过 Material 的主题化层color roles、type scale、shape、motion来表达。即使一个处处 Material的跨平台应用同时发往 iPhone它在 Apple 硬件上依然欠着 iOS 的操作系统级保证安全区 inset、Reduce Motion、边缘滑动返回。二、Android slop 测试一眼识别套皮界面文档给出了一个可操作的质量门槛slop test一个流利的 Android 用户会信任这个应用还是会被不合规格的组件绊住最常见的穿帮是披着 Android 皮肤的 iOS 应用从 iPhone 照搬来的仅底部导航忽略系统Back 手势的返回箭头Cupertino 形状的开关switch与对话框dialog。结论非常直接Material 3 就是规则书——先使用它的组件再把品牌通过主题化渗透进去而不是用 iOS 控件等价物或自创控件。这与ios.md中reinventing these for flavor is the most common native slop的判断互为镜像只是 Android 侧的红线是Material 3 组件库。三、布局与结构Layout structure四条布局硬规则均带有可追踪的规则 ID见 skill/reference/android.mdMaterial 导航与宽度匹配rule:android-layout-adaptive-nav紧凑宽度compact width用底部导航栏Navigation bar3–5 个目的地展开宽度expanded width切换为导航 rail 或 drawer。绝不把手机版的底部栏原样放到平板上。系统返回永远可用rule:android-layout-system-back尊重 predictive Back 手势与 Back 按钮不允许困住用户或劫持该手势。对应 iOS 侧的edge-swipe back stays alive。Edge-to-edge 窗口 insetrule:android-layout-window-insets正确处理状态栏、导航栏、display cutout挖孔/刘海与 IME软键盘inset保证内容永远不会躲到系统栏或键盘后面。顶部应用栏提供屏幕语境rule:android-layout-top-app-bar当屏幕只有一个主操作时配合一个 FAB 使用。这组规则的意图是自适应不是缩放——adapt.native.md 强调结构要由 size class / 窗口尺寸类别驱动而不是靠机型判断并把把拉长的手机布局放上平板列为NEVER条款。四、触控目标48×48 dp 与 8 dp 间距规则rule:android-touch-target-48dpandroid.md每个触控目标最小 48×48 dp目标之间至少留 8 dp。对比 iOS 侧的 44×44 pt 即可看出这是平台差异所在——Android 的可访问性指南把可点区域下限定在 48dpimpeccable 直接将其固化为不可妥协的验收线。它是 slop test 中可机械化校验的指标之一而检测器 hook 恰好可以承担这类规则扫描见 .kiro/skills/impeccable/SKILL.md 中/impeccable hooks的说明。五、排版Material type scale、Roboto 与 sp 单位三条排版规则Material type scalerule:android-typo-type-scaleDisplay、Headline、Title、Body、Label 五类角色每类再分 large/medium/small。文本一律映射到角色上绝不在每个屏幕手挑字号。Roboto 是系统字体rule:android-typo-system-font品牌字体通过 type scale 注入主题保证正文、标签与控件始终易读、一致。sp 单位而非固定 pxrule:android-typo-scalable-sp让文字跟随系统字号设置。之所以强调角色映射而非手挑字号是为了让整套排版在 light/dark、大字号、不同密度设备上都能自洽——这也是后文字号缩放实测能直接暴露固定布局问题的原因。六、色彩与主题化色板角色、动态取色与深浅双主题四条色彩规则rule:android-color-*见 android.mdMaterial color rolesprimary、on-primary、surface、surface-variant、secondary-container、outline、error。角色 token 会自动解析浅/深色与对比度变体一旦裸写 hex 色值这套自适应就断了。Dynamic ColorMaterial You在合适处从 Android 12 用户的壁纸派生配色方案同时保留静态回退static fallback。深色主题是一等公民要专门设计与测试而不是简单反相never a quick invert。Tonal elevation色调高程用标准 surface tonal 层级表达高程必要时加阴影禁止随意添加投影。规则的统一指向是用平台给的 token 表达品牌品牌色通过 Material 主题层注入而不是绕过它。这也呼应了文档开头brand expresses through Materials theming的立场。七、组件与动效Material 组件库、单一 FAB、Snackbar 语义与无障碍动效7.1 组件边界必须使用 Material 组件rule:android-components-materialButtonsfilled / tonal / outlined / text、FAB、Switches、Chips、Snackbars、Bottom sheets、Material dialogs、Navigation bar / rail / drawer。禁止移植 iOS 控件也禁止自造等价物——这正是第二节 slop test 的落地清单。7.2 单一 FAB 与反馈层级一个 FAB 一个主操作rule:android-components-single-fab不堆叠多个 FAB也不把 FAB 浪费在次要任务上。Snackbar 承担瞬时反馈rule:android-components-snackbar需要时可带 action不要用 toast 承担这类反馈toast 在 Android 语义里不是可操作通知的载体。对话框只用于必须打断用户才能继续的决策。7.3 动效模式与无障碍动效遵循 Material motion patternsrule:android-motion-material-and-reducecontainer transform、shared-axis、fade-through配合标准 easing 与时长同时尊重系统移除动画设置——此时回退为 crossfade 或直接切换。换言之动效的可达性对应 iOS 的 Reduce Motion与 Material 的 motion language 必须同时成立。八、验证构建一套完整的 adb 实测流程文档的 Verifying the build 一节给出了最可操作的命令级工作流这是全文最有工程价值的部分值得逐条拆解8.1 截图必须来自模拟器或真机绝不来自浏览器规则rule:android-verify-emulator-capture# 构建安装后用 adb 截屏设备列表中有多台时用 -s serial 指定 adb exec-out screencap -p path adb -s serial exec-out screencap -p path要求覆盖应用发布到的每一种设备类别——至少一台手机若目标含平板则至少一台平板并把截图写到评审流程review flow期望的位置。8.2 深色主题与字号缩放必须进入验收规则rule:android-verify-theme-and-scale# 切换深色模式 adb shell cmd uimode night yes # 把系统字号调到 1.3 倍测完务必还原 1.0 adb shell settings put system font_scale 1.3 adb shell settings put system font_scale 1.0字号 1.3 正是用来暴露固定布局藏住的被截断标签的探针——与第五节sp 跟随系统字号形成闭环验证。多台设备连接时这些命令同样要带上-s serial。8.3 模拟器与真机的分工规则rule:android-verify-hardware-honesty模拟器提供广度设备矩阵但手势、刷新率与性能必须依赖真机。产出证据时必须声明证据来自哪一类。九、与技能体系的联动规则 ID、变体命令与验收闭环android.md的技术含量还体现在它并非一次性建议而是被系统性消费规则 ID 贯穿命令体系如 adapt.native.md 要求把 Web 页面移植到 Android 时reconform, dont reflow用平台导航模型替换 Web 导航、用平台控件替换 HTML 控件、用 sp 替换 px 字号最后用 slop test 作为验收线audit.native.md技术审计变体明确从 Compose / React Native / Flutter 等源码打分时以 ios.md / android.md 为评分基准。也就是说同一份规则既驱动设计命令adapt/animate/polish也驱动审计命令audit/critique与检测 hook 的rule:android-*标记。跨平台约束在本文件中显式声明A Material-everywhere cross-platform app that also ships to iPhone still owes iOS its OS guarantees on that hardware——即便应用全程 Material只要发布到 iPhone就必须在 Apple 硬件上兑现 iOS 的操作系统保证safe-area insets、Reduce Motion、edge-swipe back此时应合并参考 ios.md。十、小结一份可执行、可校验、平台对标的 Android 设计契约回到项目定位——让 AI 助手产出配得上被称赞的设计——android.md正是把 Android 平台的专业判断编码成机器可执行规则的那一环结构与交互交给 Material 3品牌只通过主题化层发声color roles / type scale / shape / motion每个可点目标 ≥ 48×48 dp、间距 ≥ 8 dp排版走 type scale、用 sp、以 Roboto 为底反馈与层级用平台语义Snackbar 管瞬时反馈、dialog 只管必须打断的决策、一个屏幕只许一个 FAB动效走 Material 模式并尊重移除动画设置验证以模拟器/真机为准深色模式与 1.3 倍字号是必测项证据必须标注来源模拟器或硬件。对任何正在用 Compose / Android Views / React Native / Expo / Flutter 开发 Android 应用、并希望让 AI 协作者按平台规范而非网页习惯做设计的开发者这份准则配合仓库中的 SKILL.md 路由说明、adapt.native.md 移植守则与 ios.md 对照文档即可搭出一套完整的原生设计—代码审计—实测验收闭环。【免费下载链接】impeccableThe design language that makes your AI harness better at design.项目地址: https://gitcode.com/GitHub_Trending/im/impeccable创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考