Motionsites-AI/claude-skill

选用指南

AI 根据 README 整理 · 2026/10/26 23:41:32

使用方式

作为Claude技能安装，通过Claude对话使用，也可作为Claude Code插件。

查看 README 依据

- **A spec template:** the precise brief Claude writes before coding. That's where quality is decided. - **A look-and-fix loop:** a screenshot + QA script (broken assets, mobile overflow, fonts, video playback) and a scoring rubric. - **Prompt mode:** ask for a prompt instead of code, and get one tuned for Lovable, Bolt, v0, Cursor, Manus, Google AI Studio or Kimi. ## Install ### Claude.ai and Claude desktop 1. Download **`motionsites-web-builder.zip`** from the [latest release](../../releases/latest).

2. In Claude, open **Customize → Skills → + → Create skill → Upload a skill**, choose the zip, and switch the skill on. (Code execution must be enabled in Settings → Capabilities.) ### Claude Code (plugin) ``` /plugin marketplace add Motionsites-AI/claude-skill /plugin install motionsites-web-builder@motionsites ``` No GitHub SSH key? Use `/plugin marketplace add https://github.com/Motionsites-AI/claude-skill.git` instead. ### Claude Code (manual) Copy `plugins/motionsites-web-builder/skills/motionsites-web-builder` into `~/.claude/skills/`. ### Optional: let Claude see its work

部署要求

需要Claude.ai或Claude桌面版，并启用代码执行；可选安装Playwright以支持自动截图检查。

查看 README 依据

2. In Claude, open **Customize → Skills → + → Create skill → Upload a skill**, choose the zip, and switch the skill on. (Code execution must be enabled in Settings → Capabilities.) ### Claude Code (plugin) ``` /plugin marketplace add Motionsites-AI/claude-skill /plugin install motionsites-web-builder@motionsites ``` No GitHub SSH key? Use `/plugin marketplace add https://github.com/Motionsites-AI/claude-skill.git` instead. ### Claude Code (manual) Copy `plugins/motionsites-web-builder/skills/motionsites-web-builder` into `~/.claude/skills/`. ### Optional: let Claude see its work

The look-and-fix loop works best with Playwright: ``` pip install playwright && python -m playwright install chromium ``` ## Try it Just ask Claude for a site. The skill kicks in automatically: - *"Build a landing page hero for a luxury sleep-tracking ring."* - *"Make a portfolio homepage for an architectural photographer in Lisbon. Editorial and quiet."* - *"Write a Lovable prompt for a waitlist page for my AI travel app."* - *"Here's my current site: make it look award-winning."* ## Want the full library?

已知限制

技能中的示例和媒体是免费样本，完整库需付费订阅；示例提示词和媒体版权归MotionSites所有，但可在使用该技能构建的网站中使用。

查看 README 依据

The examples and media in this skill are a **free sample**. **[MotionSites Unlimited](https://motionsites.ai/unlimited?utm_source=github&utm_medium=claude-skill&utm_campaign=web-builder&utm_content=readme)** unlocks: - **500+ premium website prompts,** ready for Lovable, Bolt, v0, Cursor and Claude - **Animated hero backgrounds** and **section prompts** (features, pricing, footers…) - **40+ Lovable templates** - **The MotionSites MCP,** so Claude can search and pull any premium prompt straight into your build - Use for personal and client work

👉 **[Go Unlimited](https://motionsites.ai/unlimited?utm_source=github&utm_medium=claude-skill&utm_campaign=web-builder&utm_content=readme)** ## License See [LICENSE](LICENSE). The skill's instructions and code are MIT. The example prompts and media remain © MotionSites; you may use them in sites you build with this skill.