MotionSites

MotionSites 是一个面向 AI 编程与建站工作流的网页设计提示词资源库。用户可以浏览完整落地页、App 界面、Hero、定价区块、页脚和动画背景等视觉方向，复制对应提示词，再放入 Cursor、Claude、Lovable、Bolt、v0 或 Replit 等工具生成代码。

它最适合已经决定用 AI 写网页、但缺少视觉方向和详细设计描述的人。需要先澄清的是：MotionSites 提供设计输入、模板和学习资源，并不等于托管式建站平台，也不会替用户处理域名、部署、表单后端或生产环境维护。

先决定生成整页还是替换一个区块

1. 按 Sites、Apps、Sections 或行业标签筛选，先确定要生成完整页面还是单个区块。
2. 打开喜欢的案例，阅读其视觉与交互方向，然后复制可用提示词；部分内容需要登录或付费权限。
3. 把提示词粘贴到支持代码生成的 AI 工具中，同时补充品牌名称、文案、色彩、技术栈和响应式要求。
4. 在本地或预览环境检查生成结果，修正素材路径、动画性能、移动端布局、无障碍和表单逻辑，再自行部署。

这个流程的关键不是一次复制后直接上线，而是把提示词当成设计规格的起点。不同模型、上下文长度和现有代码库会改变输出，官网展示图也不能保证在每个 AI 工具中逐像素复现。

已有网站只需要改首屏时，优先找 Hero 或 Sections 提示词，并明确要求保留现有导航、路由和其他区块；从零做落地页时再选 Landing Page。两种输入范围不同，整页案例虽然更完整，也可能让生成工具改动你原本已经满意的部分。

复制后补上自己的设计约束

• 内容：填入真实标题、行动按钮、产品截图和链接，注明哪些示例文案需要替换。
• 实现：说明当前框架、组件库和已有样式，限定需要修改的页面或区块。
• 验收：列出移动端排布、交互状态和减少动态效果的要求，再对照结果逐项修改。

资源入口对应不同的制作阶段

免费入口能试流程，完整资源需要付费

截至 2026 年 9 月 9 日，MotionSites 官方 MCP 页面说明免费账户可以打开 3 条免费提示词，付费计划解锁 500+ 高级提示词；官网同时提供部分免费教程和可浏览案例。免费层适合先确认提示词格式是否适合自己的 AI 工具，不宜直接推断整个资源库都能免费复制。

现行 Unlimited 页面列出 3 个月、年付和终身访问方案：3 个月计划标价 129 美元，并有每天复制 3 条提示词的公平使用限制；年付标价 279 美元；终身访问显示 399 美元促销价。页面另有按次数购买的提示词包。价格、促销、每日额度和包含的模板数量都可能变化，付款前应重新核对结算页、取消与退款条款。

MCP 省去手动粘贴，权限仍来自账号

官方 MCP 流程是在兼容工具注册服务后，由浏览器登录 MotionSites 账号并授权，随后让代理提取设计提示词。它与手动复制使用的是账号可访问的内容范围；接入 MCP 不会绕过免费条目、套餐或复制次数限制，也不会替代生成后的页面检查。

复制之前先处理版权、素材和技术边界

• 参考设计不等于可直接复制品牌资产：案例可用于确定布局和动效方向，但第三方 Logo、图片、字体、视频与具体文案仍需确认授权。
• 提示词不替代工程验收：生成页面要检查响应式、键盘操作、对比度、SEO 元数据、性能、表单安全和浏览器兼容性。
• 动态页面要准备降级：3D、滚动绑定动画和大体积背景素材可能影响低性能设备，应提供静态替代并尊重减少动态效果设置。
• 商业项目先看现行条款：官网套餐写有个人与客户工作用途，但具体资源、外部素材和定制提示词的使用边界仍应以购买时条款为准。

如果你的目标是快速得到有明确视觉方向的 AI 网页初稿，MotionSites 能减少从空白提示词开始摸索的时间；如果需要的是无需代码的拖拽编辑器、网站托管、CMS 或电商后台，则还要搭配其他平台完成。