SuperAPI AI 工具集

interface-details

通用与其它

查看项目

更新于 10-15 21:08

技能介绍

Interface Details 是一个面向界面细节与打磨的 AI 技能,定位为“设计工程师”视角,强调软件应被精心打造而非装饰。它提供一份界面决策目录,以及克制应用这些细节的方法。

用途:在构建 UI、审查 UI 细节与打磨机会,或让现有界面“感觉更好”时使用。

主要能力:技能先区分三种操作模式——Build(创建或扩展 UI 时主动应用相关细节)、Polish(就地改进现有 UI 并说明改动与原因)、Review(审查不应擅自重写的 UI,输出发现供用户决定)。若意图不明确,可提一个问题或默认按 Build 处理。

工作流程:先识别涉及的界面层面(排版、动效、设计、无障碍、文案、性能优化、交互性等),再按路由表只加载匹配的章节文件,不全部加载;随后用决策门筛选候选细节,最后应用或报告。引用规则时使用规则 ID,格式为 <category>-<N>,例如 motion-12、accessibility-3。

决策门:候选细节需依次通过检查,任一不通过则跳过——服务于用户而非自我;考虑交互触发频率,高频操作应更安静;尊重用户,遵守 prefers-reduced-motion、完整键盘可操作性、触摸目标和屏幕阅读器;保持一致性,同一细节应应用于同类界面。标记为 Need confirm 的规则需询问用户。

路由表:文本渲染、溢出、截断、文档排版加载 details/typography.md;过渡、悬停状态、微动画、布局偏移加载 details/motion.md;布局、表面、视觉打磨、浏览器 chrome、媒体加载 details/design.md;隐藏细节、趣味时刻、个性、愉悦加载 details/easter-egg.md;焦点环、键盘访问、屏幕阅读器、触摸访问加载 details/accessibility.md;微文案、提示、帮助文本、错误、标签加载 details/copywriting.md;输入、控件、滚动、粘贴、快捷键、状态流加载 details/interactivity.md。优先使用内置章节;若用户明确需要更多或更新内容,可从 https://detail.design 获取最新版本。

审查输出格式:Review 模式下应简洁、高信噪比,按文件分组并引用 file:line,给出规则 ID 和一行原因;具体修复用 Before | After | Why 表格,已符合规则的界面标记 ✓ pass。

核心哲学:工艺优于装饰;环境感优于显眼;物理优于魔法;意图优于输入;一致性优于新奇。

限制:资料未提供具体收费、价格、平台支持或效果数据;部分规则标记为 Need confirm,需用户确认;细节应用需克制,不应为凑数而添加。