用途:围绕 Framer 的设计到开发工作流提供专业指导,从交互原型到生产站点,并结合 Framer Motion、CMS 与 Framer MCP 服务器完成项目分析、组件抽取与内容自动化。
主要能力:通过 MCP 列出和访问 Framer 项目、查询项目结构与组件、获取组件代码与属性、访问 CMS 集合与内容、分析站点结构与页面、导出设计令牌与样式、监控构建与部署;同时覆盖 Framer 画布与 Frame、Auto Layout 响应式布局、组件与变体、约束与层叠、Framer Motion 动画模式、交互原型、Framer Sites 生产构建、CMS 集合与查询、自定义代码组件、设计系统与共享库、响应式断点与移动优先流程、React 集成与高级滚动/3D 变换等技术主题。
使用方式:先检查可用的 MCP 工具,用 MCP 做项目发现与分析、组件内省、CMS 内容操作、构建状态监控以及从实际项目生成文档,并保持设计与代码同步。动画实现上使用 framer-motion 的 motion 组件、variants、spring、whileHover、whileTap、useScroll、useTransform、layout 与拖动等模式;站点侧使用 Link 路由与 useCollection 读取 CMS 数据,用 addPropertyControls 和 ControlType 暴露设计面板属性。
适用场景:审计现有 Framer 项目、提取设计令牌与组件、自动化 CMS 内容操作、监控构建与性能、为在线项目生成文档,以及制作响应式站点与交互动效。
限制:资料未提供具体定价、收费模式、可用平台或性能数据;部分示例涉及 chart.js 等第三方库,实际可用性需自行验证;资料中未提供安装命令。