design

设计技能

用于在各个平台实现 Apple 现代设计系统的技能。

此技能的触发条件

在以下情况下使用此技能：

• 询问 Liquid Glass 设计
• 想要实现 Apple 现代 UI 效果
• 需要视觉设计模式方面的指导
• 询问材质、透明度或模糊效果
• 想要创建流畅的动画
• 询问 spring、bounce 或 snappy 动画
• 需要 PhaseAnimator 或 KeyframeAnimator 方面的帮助
• 需要 视图转场、匹配几何效果 或 英雄转场
• 想要使用 SF Symbol 效果（弹跳、脉冲、摆动、呼吸）
• 询问 动画完成回调 或 withAnimation
• 说应用感觉平淡，或想要更有冲击力／游戏感（庆祝效果、触觉反馈、音效）
• 想要进行反馈审查——事件是否通过正确的渠道传达给用户？
• 需要 UX 结构方面的帮助：导航清晰度、可发现性、信息架构
• 正在编写或审核界面文案、警告或功能名称
• 询问 SF Symbols 的使用／创作、字体、动态字级或字体层级

可用技能

liquid-glass/

适用于 iOS 26+、macOS 26+ 的全面 Liquid Glass 实现。

• SwiftUI .glassEffect() API
• AppKit NSGlassEffectView
• GlassEffectContainer 模式
• 形变转场
• 交互效果
• 按钮样式

animation-patterns/

适用于 iOS 13–18+ 的 SwiftUI 动画模式。

• 弹簧配置（三代 API）
• PhaseAnimator 和 KeyframeAnimator（iOS 17+）
• 视图转场、匹配几何效果、导航转场
• SF Symbol 效果
• 动画完成回调、事务、时间曲线

game-feel/

将游戏感（“爽感”）作为一门设计学科——事件×渠道反馈审查、触觉反馈词汇设计（Core Haptics 服务架构），以及可与音乐共存的音效层。运动技巧可跳转至 animation-patterns，生成代码可跳转至 generators/milestone-celebration。

ui-prototyping/

为屏幕探索多种不同的 UI 方向，以命名且可运行的 Swift #Preview 变体呈现——在确定一种设计前进行比较、混搭和调整。

ux-writing/

打造有效的界面文案——语气与风格、PACE 框架、警告结构、功能命名、空状态，以及能切实改善 UX 的细微措辞调整。

sf-symbols/

全面使用 SF Symbols——选择／配置系统符号（渲染模式、可变颜色／绘制），创作可在不同字重间插值的自定义符号，以及了解动画预设词汇。

typography/

UI 排版——文本样式和动态字级、带宽度轴的 San Francisco 字体系列、光学字号、字间距与字偶距，以及自定义字体的缩放要求。

核心原则

1. 平台一致性

• 遵循 Apple 人机界面指南
• 使用系统提供的 API
• 尊重用户的外观偏好

2. 性能

• 多个效果并用时使用 GlassEffectContainer
• 限制每个视图上的玻璃效果数量
• 考虑 GPU 资源

3. 视觉层级

• 玻璃效果营造深度和层次
• 使用色调突出重要性
• 搭配适当的阴影

参考文档

• 为自定义视图应用 Liquid Glass（SwiftUI）
• NSGlassEffectView（AppKit）
• 本地保存的文档（可选）：如果存在 ~/Downloads/docs/SwiftUI-Implementing-Liquid-Glass-Design.md 或 ~/Downloads/docs/AppKit-Implementing-Liquid-Glass-Design.md，请阅读以获取更多细节；如果不存在，则静默跳过。