SuperAPI AI 工具集

design-ios

设计与创作

查看项目

更新于 10-15 21:48

技能介绍

用途:在已有设计系统 token 后,为 Apple 平台设计单个界面或流程,交付两样东西——按画布生成、带设备边框的 HTML 原型及其截图,以及一份交给 swift-expert 或 Apple 平台开发者的 SwiftUI 交接规范(命名 token、按名称的文本样式、语义颜色、尺寸固定/内容自适应/填充、全部状态、以 pt 计的间距、画布来源)。该技能不写 SwiftUI 代码。

主要能力与用法:先选定目标平台并读取对应参考文件(iPhone 叠加 Dynamic Type;iPad、可缩放窗口与 iPhone Duo 叠加 iPadOS/iPhone Duo;Mac 叠加 macOS 与其它字号表;Watch、TV、Vision Pro 叠加 watch-tv-vision 与字号表)。将 token 映射到平台角色:排版映射到 HIG 文本样式名称(iOS/iPadOS Dynamic Type:Body 17 pt 至 Caption 2 11 pt;macOS 固定样式 Body 13 pt 至 Large Title 26 pt),颜色映射到语义角色而非原始十六进制。

画布按尺寸类别而非设备选择,至少包含紧凑宽度、常规宽度和 AX5 字号下的关键屏;HIG 不再公布设备点数,需从 Xcode Device Hub 获取并记录来源。按记录点数构建 HTML 原型(1 pt = 1 CSS px),使用 viewport-fit=cover 与 env(safe-area-inset-*) 处理灵动岛与主屏幕指示条;macOS 用标准系统窗口边框。Liquid Glass 只用于功能层(标签栏、工具栏、侧边栏、关键控件),默认常规变体,仅在丰富媒体上用 clear 并加 35% 暗色遮罩;原文称无公布圆角半径,采用同心嵌套。核对控件尺寸(iOS 44×44 pt、macOS 28×28、tvOS 66×66、visionOS 60×60、watchOS 44×44)与对比度(最低 4.5:1,≥18 pt 或粗体 3:1,自定义颜色和小字目标 7:1),在浅色、深色与增强对比度下检查。侧边栏不超过两级,更深层级改用分栏视图。

限制与失败处理:如无法截图,需在报告中说明“视觉检查:未运行”,不得声称已做视觉检查。参考文件或所引 HIG 页面未给出的数值标注“需在 developer.apple.com 复核”,不得编造数字;Apple 未公布间距或圆角数值网格,不强行套用 8 pt 网格。完成后交给 design-review 做原型范围的截图与对比度检查。