frontend-dev

frontend-dev 用于编排 5 项能力来构建完整、可上线的生产级前端页面：设计工程、动效系统、AI 生成素材、说服性文案与生成式艺术。调用方式为「/frontend-dev <request>」，用户以自然语言提出请求（例如「为音乐流媒体应用搭建落地页」）。技能目录包含 SKILL.md、scripts（minimax 的 TTS、音乐、视频、图像生成脚本）、references（各类参考指南）、templates（p5.js 交互艺术模板）与 canvas-fonts。工作流分 6 个阶段：设计架构、动效架构、素材生成、文案撰写、构建 UI、质量门禁。素材生成需 MINIMAX_API_KEY，图片/视频/音频脚本生成后必须保存到本地（如 public/assets/），禁止使用 unsplash、picsum 等占位图或外链。设计层面规定默认 DESIGN_VARIANCE 8、MOTION_INTENSITY 6、VISUAL_DENSITY 4，并给出排版、配色、布局、卡片、状态等规则及禁用模式（如不得使用 emoji、Inter 字体、纯黑、霓虹发光等）。动效层面给出工具选择矩阵（Framer Motion、GSAP+ScrollTrigger、Lottie、Three.js/R3F、CSS）、强度分级、性能规则（只动画 transform/opacity/filter/clip-path）、弹簧与缓动参数及无障碍要求。文案层面沿用 AIDA、PAS、FAB 框架，禁用 Lorem ipsum。依赖安装命令包括 npm install framer-motion、gsap、lottie-react、three @react-three/fiber @react-three/drei。适用场景为使用 React/Next.js、Vue/Nuxt、Svelte/SvelteKit、Astro 或纯 HTML 搭建落地页与营销页面。限制：需本地环境、MINIMAX_API_KEY 及相应依赖；具体收费标准与平台支持范围暂未提供。