60fps

60fps

描述你想要的动效。获取一个实现该动效的真实 iOS 片段，以及一个可复现它的 SwiftUI 文件。

这个库收录了 2,000 多个已上线应用的交互片段。每个片段都附有动效说明：初始状态、过渡过程、结束状态，以及背后的时长和缓动参数。用它来查找参数，不必再靠猜。

你将获得什么

工具	功能
60fps_search_shots	语义搜索。描述动效，而非关键词。
60fps_list_filters	列出库中使用的所有筛选条件，便于精确筛选搜索。
60fps_get_shot	获取单个片段的完整内容，包括关键帧。
60fps_get_motion_breakdown	获取初始状态、过渡过程、结束状态，以及时长和缓动参数。
60fps_get_motion_code	获取可独立使用、用于复现该片段的 SwiftUI 文件。
60fps_get_related_shots	当第一个选中的片段接近但不够合适时使用。

同时还附带一些技能。每项技能都能使用同一套工具，教 Agent 完成更复杂的任务：

• find-animation-opportunities 解答“我的应用哪些地方应该加入动效？”。Agent 会读取你的 SwiftUI 代码，找出适合动效的少数关键时刻，指出有问题或过度使用动效的地方，说明哪些地方应保持静止，并为每处推荐可参考的真实片段。
• motion-system 根据你自己的代码以及具有相同风格的真实应用，为应用提供一套统一的时长、弹簧参数和触觉反馈，集中放在一个 Motion.swift 文件中。
• feedback-states 为某项功能设计加载、成功、空白、错误和重试状态，并为每种状态设计相应的动效、触觉反馈和文案。
• motion-spec 将一个片段整理成开发者可据此实现的交接规格，其中时长取自该片段的复现方案，并将判断与其余内容分开。
• motion-reference 告诉 Agent 何时使用该库，何时不应使用。

未经你同意，这些技能都不会更改你的代码。

任何编码 Agent（Claude Code、Cursor、Codex 等）都可以自行添加这些技能：

npx skills add 60fps-Design/plugin

这只会添加技能。按如下方式连接服务后，它们才能使用服务。

安装

该服务托管在线上，因此无需在本地运行任何内容。登录时会在浏览器中打开 OAuth。

• Cursor：从 Settings > MCP 添加服务，使用下方 URL；或者复制 mcp.json。

• Grok Build：通过 URL 添加服务。

• Gemini CLI：将此仓库安装为扩展。

  gemini extensions install https://github.com/60fps-Design/plugin
  

• Claude Code：将此仓库添加为市场，然后安装插件。

  /plugin marketplace add 60fps-Design/plugin
  /plugin install 60fps@60fps-design
  

  或者跳过插件，只添加服务： claude mcp add --transport http 60fps https://mcp.60fps.design/mcp

• 其他支持 MCP 的客户端：通过可流式传输的 HTTP 连接到 https://mcp.60fps.design/mcp。参见 mcp.json。

你需要一个 60fps 许可证密钥：可使用 60fps MCP 密钥，或在 2026 年 9 月 12 日当天或之前购买的 60fps PRO 密钥。此日期之后购买的 PRO 不包含 MCP。没有密钥时，工具仍可连接，但会返回 401。这是预期行为，并非故障。

与 Xcode 搭配使用

Xcode 26.3 及更高版本内置了 MCP 服务，因此 Agent 可以驱动构建系统、Simulator、预览和调试器。与此同时，让这个 Agent 使用 60fps，整个流程便打通了：它找到真实的交互，阅读动效拆解，编写 SwiftUI，进行构建，并查看结果。

Xcode 会为你启动 Agent，并预先接入自己的工具：

xcrun mcpbridge run-agent claude

你在该 Agent 中安装的任何内容都会一并接入，因此借助这个插件，会话同时拥有两套工具。像“找出 Threads 如何实现下拉刷新，然后在这个项目中构建出来并向我展示预览”这样的提示词，只需让 Agent 执行一次，而不必调用三个工具再复制粘贴。

xcrun mcpbridge --help 会列出其余选项，包括用于排除 Xcode 工具的 --no-xcode-tools，以及用于导出 Xcode 随附技能的 run-agent skills export。要移交任何内容，桥接工具需要 Xcode 打开一个项目，并且在 Xcode 设置中启用 Agent 访问权限。

涵盖范围

仅限 iOS，且仅限动效。

它无法帮助处理 Android、Material、Flutter、React Native 或 Web。它不会设计图标、配色、徽标或品牌。它与帧率分析毫无关系，除了名称相同之外没有任何关联。技能会指示 Agent 直接回答这些问题，而不是进行搜索。

搜索总会返回结果，因为它会根据相似度为整个库排序。请根据结果本身的质量进行判断，而不是根据搜索数量。

关于代码

每个文件都是独立的。将其粘贴到 Xcode 中即可运行。

根据设计，每个文件都不包含原应用的文字、颜色、品牌或资源。请按照自己的设计系统重新设计样式。值得保留的是动效。

链接

• 60fps.design/mcp
• 隐私 和 条款

mcp.60fps.design 不设置 Cookie，也不运行分析工具。它只会发出一个外部第三方请求，用于获取来自 Framer 图片 CDN 的故事板帧，并且不会发送有关调用方的任何信息。

许可证

仅适用于此代码库的 MIT 许可证：清单、技能文本和徽标。

该许可证不涵盖 60fps 库、托管服务，也不涵盖它们返回的片段和代码。这些内容仍受条款约束。