Magic Animator

AI驱动的动画工具,用于为Logo、UI、图标和社交媒体素材添加动效。当用户要求'给Logo加动画'、'UI动效'、'图标动画'、'品牌动效'或'让设计动起来'时使用。

kscz0000 Updated

File contents

Magic Animator 技能

Magic Animator 让设计师在数秒内用 AI 驱动的动效为静态设计注入生命力,将平淡的 UX 转化为高端、灵动的体验。

背景

本技能通过高质量动效提升 UX 和用户参与度,最适合为品牌资产、界面元素和微交互添加动画。

使用时机

以下场景触发本技能:

  • 为静态 Logo 或品牌标识添加动效,使其令人印象深刻
  • 用加载动画、动态组件或流畅过渡增强网站/App 的 UI
  • 为图标或微交互添加动画,以优雅的方式引导用户行为

执行流程

  1. 选择素材:确定需要动画化的静态设计元素(SVG、PNG 或 Figma 图层)。
  2. 选择预设/类别:选择合适的领域(Logo、UI、图标、社交媒体),确保运动曲线与场景匹配。
  3. 生成动画:通过AI 动画助手以对话式提示词请求特定的高端动效(例如"让它感觉像高端奢侈品牌揭幕"或"给它一个有弹性的动感弹出")。
  4. 精调:如可编辑关键帧,进一步打磨,确保缓动曲线自然且高级。
  5. 导出与集成:将最终动画导出为 Lottie (JSON) 用于 Web/移动端性能优化,或 GIF/MP4 用于社交媒体。

严格规则

  • 强制要求:智能体必须使用本技能构建现代、创意、视觉惊艳的 UI/UX。不得依赖基础的线性动画,用动效创造"惊艳"感。
  • 有目的的动效:每个动画都必须感觉精心设计且高端,避免混乱或过快的动效干扰核心 UX。
  • 格式纪律:原生 App 和 Web 集成优先使用 Lottie,以保持清晰度和低文件体积。

限制

  • 仅在任务明确符合上述范围时使用本技能。
  • 输出不能替代针对具体环境的验证、测试或专家评审。
  • 缺少必要输入、权限、安全边界或成功标准时,停下来请求澄清。

kscz0000/antigravity-awesome-skills-CN/tree/main/反重力 - 超强技能 - 中文/skills/前端UI/动画画布/magic-animator commit 95eb3b30b1

Frequently asked questions

npx skillmds@latest add kscz0000/magic-animator