SuperAPI AI 工具集

better-mobile-interface

通用与其它

查看项目

更新于 10-15 20:31

技能介绍

用途:把移动端屏幕当作一套设计系统来设计,而非孤立页面;在 Compose 与 SwiftUI 间共享同一套层级、节奏与视觉语义,适配各自原生组件而不盲目复制像素。

主要能力:提供语义化 Design Token(background、surface、surfaceElevated、textPrimary/Secondary/Tertiary、border/separator、accent/primary、onAccent、success/warning/danger、overlay),要求明暗主题在同一张 Token 表中成对定义;规定排版层级(display、title、body、label、caption)、4/8 网格间距、命名圆角、安全区与触控目标(≥44–48pt/dp)、触觉与动效(200–350ms,遵循 Reduce Motion)、图标与媒体一致性,以及空/加载/错误等状态设计。给出 Compose ColorScheme/isSystemInDarkTheme 与 SwiftUI Color assets/preferredColorScheme 的落地方式,以及跨平台组件角色映射(如 CTA、列表、导航、Sheet)。

使用方式:先明确产品与受众、一个视觉签名、基调与 Token;若已有设计系统或品牌规范则以其为准,只补齐缺失部分;在根节点应用主题,屏幕仅使用 Token 与系统组件,并在明暗、普通与放大字体下预览校验。React Native/Expo 对应版本为 better-mobile-interface-react-native;架构方向为 android-development / mvvm-architecture。

适用场景与限制:适用于 Android(Jetpack Compose)与 iOS(SwiftUI)的原生移动界面设计规范与实现评审,强调可访问性(WCAG AA 对比度、Dynamic Type/fontScale)与明暗对等。资料未提供具体定价、安装命令或版本信息,暂未提供。