io.github.baptisteArno/typebot.io/web-animation-design · vmain
Design and implement web animations that feel natural and purposeful. Use this skill proactively whenever the user asks questions about animations, motion, easing, timing, duration, springs, transitions, or animation performance. This includes questions about how to animate specific UI elements, which easing to use, animation best practices, or accessibility considerations for motion. Triggers on: easing, ease-out, ease-in, ease-in-out, cubic-bezier, bounce, spring physics, keyframes, transform, opacity, fade, slide, scale, hover effects, microinteractions, Framer Motion, React Spring, GSAP, CSS transitions, entrance/exit animations, page transitions, stagger, will-change, GPU acceleration, prefers-reduced-motion, modal/dropdown/tooltip/popover/drawer animations, gesture animations, drag interactions, button press feel, feels janky, make it smooth.
web-animation-design 是一个Agent Skill，收录自 SkillsMP。本页提供 Cursor、Claude Code 等客户端的安装配置片段。
Agent Skill 是带 SKILL.md 的指令包。安装后，AI 会根据 description 在匹配任务时自动加载，无需每次手动粘贴提示词。
选择你的平台查看安装方式
# 通用 CLI（Cursor / Claude Code / Codex 等均支持）
npx skills add baptisteArno/typebot.io@web-animation-design安装完成后，在对话中直接描述你的任务（或提及技能名称）。Agent 会先读取 SKILL.md 的 description 判断是否启用，再按其中的步骤执行。可用 /skills（Claude Code）或在设置中查看已加载的 Skills。
vmain
io.github.millionco/react-doctor/react-doctor
Use when finishing a feature, fixing a bug, before committing React code, or when the user types `/doctor`, asks to scan, triage, or clean up React diagnostics. Covers lint, accessibility, bundle size, architecture. Includes a regression check and a full local-triage workflow that fetches the canonical playbook.
vmain
io.github.simstudioai/sim/emcn-design-review
Review UI code for alignment with the emcn design system — components, tokens, patterns, and conventions
vmain
io.github.mastra-ai/mastra/react-best-practices
React performance optimization guidelines from Mastra Engineering. This skill should be used when writing, reviewing, or refactoring React code to ensure optimal performance patterns. Triggers on tasks involving React components, data fetching, bundle optimization, or performance improvements.
vmain
io.github.sgl-project/sglang/cookbook-review-pr
Review a pull request against the SGLang Cookbook (docs_new/, Mintlify) contribution checklist — the config-driven format (per-model config + benchmarks JSX consumed by the shared _deployment.jsx / _playground.jsx engines). Run with /cookbook-review-pr <PR number>.
vmain
io.github.first-fluke/oh-my-agent/oma-mobile
Mobile specialist for Flutter, React Native, and Swift native iOS development. Use for mobile app, Flutter, Dart, React Native, Swift, SwiftUI, iOS, Android, Riverpod, swift-openapi-generator, and widget work.
vmain
io.github.first-fluke/oh-my-agent/oma-backend
Backend specialist for APIs, databases, authentication with clean architecture (Repository/Service/Router pattern). Use for API, endpoint, REST, database, server, migration, and auth work.
{
"id": "io.github.baptisteArno/typebot.io/web-animation-design",
"type": "skill",
"version": "main",
"displayName": "web-animation-design",
"description": "Design and implement web animations that feel natural and purposeful. Use this skill proactively whenever the user asks questions about animations, motion, easing, timing, duration, springs, transitions, or animation performance. This includes questions about how to animate specific UI elements, which easing to use, animation best practices, or accessibility considerations for motion. Triggers on: easing, ease-out, ease-in, ease-in-out, cubic-bezier, bounce, spring physics, keyframes, transform, opacity, fade, slide, scale, hover effects, microinteractions, Framer Motion, React Spring, GSAP, CSS transitions, entrance/exit animations, page transitions, stagger, will-change, GPU acceleration, prefers-reduced-motion, modal/dropdown/tooltip/popover/drawer animations, gesture animations, drag interactions, button press feel, feels janky, make it smooth.",
"author": {
"name": "baptisteArno",
"url": "https://github.com/baptisteArno"
},
"repository": {
"url": "https://github.com/baptisteArno/typebot.io",
"source": "github",
"subfolder": ".agents/skills/web-animation-design"
},
"homepage": "https://skillsmp.com/skills/baptistearno-typebot-io-agents-skills-web-animation-design-skill-md",
"distribution": {
"packages": [
{
"registryType": "source",
"identifier": "baptisteArno/typebot.io@web-animation-design",
"version": "main",
"runtimeHint": "npx skills add"
}
],
"remotes": []
},
"dependencies": [],
"installTargets": [
"claude-code",
"claude-desktop",
"cursor",
"codex",
"vscode"
],
"keywords": [
"stars:10013"
],
"provenance": {
"origin": "skillsmp",
"originalId": "baptistearno-typebot-io-agents-skills-web-animation-design-skill-md",
"originalUrl": "https://skillsmp.com/skills/baptistearno-typebot-io-agents-skills-web-animation-design-skill-md",
"isOfficial": false,
"status": "active"
}
}