CCM
/Skills
SkillsMCPMarketplacesDigestToolsAdvertise

This week in Claude

Every Monday: Claude Code, Agent SDK, MCP, and the Anthropic platform moves worth your time.

Skills by Category
Frontend DevelopmentBackend & APIsTesting & QASecurityDevOps & CI/CDGit & Pull RequestsDocumentationCode Review & QualityAI & Agent BuildingSkill Development
MCP Servers by Category
Sales & MarketingWeb & Browser AutomationDatabasesAI & LLM ToolsCloud & InfrastructureCommunication & MessagingDeveloper ToolsDesign & CreativeDocuments & KnowledgeSearch & Web Crawling
Marketplaces by Category
AI Agents & OrchestrationLLM IntegrationDevelopment ToolsFrontend & UIBackend & APIsDatabasesTesting & Code QualityDevOps & CloudSecurity & ComplianceGit & Version Control

Claude Code Marketplaces

Discover Claude Code plugins, extensions, and tools. Automatically updated directory of Anthropic Claude AI marketplaces with development tools, productivity plugins, and integrations.

Resources

  • Browse Skills
  • Browse MCP Servers
  • Browse Marketplaces
  • Skill index
  • MCP index
  • Marketplace index
  • Plugins Reference

Community

  • About
  • Tools
  • Feedback
  • Privacy Policy
  • Advertise

Built for the Claude Code community with Claude Code by mertbuilds.com

Independent project, not affiliated with Anthropic
dylantarre avatar

Popmotion

dylantarre/animation-principles
362 installs70 stars
Summary

If you need to implement Disney's animation principles in code, this gives you working examples for all 12 using Popmotion's functional API. You get squash and stretch with scale transforms, anticipation through sequenced animations, follow-through with delayed timing, and physics-based spring animations for exaggeration. The examples are practical and copy-paste ready, covering everything from basic tweens to keyframe sequences and secondary actions. Popmotion is the library that powers Framer Motion, so if you want fine-grained control over web animations without the framework overhead, this is a solid reference. The code snippets assume you know your way around JavaScript and DOM manipulation.

Install to Claude Code

npx -y skills add dylantarre/animation-principles --skill popmotion --agent claude-code

Installs into .claude/skills of the current project.

CodeRabbit
CodeRabbit
AI writes the code. CodeRabbit catches the slop.
Try For Free →
Lid closed, agents working
Lid closed, agents working
Keeps your Mac awake while Claude Code, Codex or Cursor works. Lets it sleep when they are done.
Try free for 7 days →
Block distraction from your iPhone for freeBlock distraction from your iPhone for free
Block distraction from your iPhone for free
Block distracting apps from your iPhone permanently without a 3rd party app. Free and open source.
Block now (100% free) →
Granola, the best AI meeting recorder
Granola, the best AI meeting recorder
Notes, actions and memory. Without a meeting bot. First month 100% off.
Download for free →
belt - the only tool your agent needs
belt - the only tool your agent needs
belt cli automatically finds the best tools and skills for your agent. image, video, music, tts...
one prompt install →
Open Steps
Open Steps
Free an open-source skills that make AI coding agents easier to understand, verify, and control.
Download for free →
AppSignal
AppSignal
Monitor with ease. Code with confidence.
Start Free Trial →
Agent, connect blockchain
Agent, connect blockchain
Connect your Claude agent to live crypto prices and trading routes via 1inch
Get the MCP →
CodeRabbit
CodeRabbit
AI writes the code. CodeRabbit catches the slop.
Try For Free →
Lid closed, agents working
Lid closed, agents working
Keeps your Mac awake while Claude Code, Codex or Cursor works. Lets it sleep when they are done.
Try free for 7 days →
Block distraction from your iPhone for freeBlock distraction from your iPhone for free
Block distraction from your iPhone for free
Block distracting apps from your iPhone permanently without a 3rd party app. Free and open source.
Block now (100% free) →
Granola, the best AI meeting recorder
Granola, the best AI meeting recorder
Notes, actions and memory. Without a meeting bot. First month 100% off.
Download for free →
belt - the only tool your agent needs
belt - the only tool your agent needs
belt cli automatically finds the best tools and skills for your agent. image, video, music, tts...
one prompt install →
Open Steps
Open Steps
Free an open-source skills that make AI coding agents easier to understand, verify, and control.
Download for free →
AppSignal
AppSignal
Monitor with ease. Code with confidence.
Start Free Trial →
Agent, connect blockchain
Agent, connect blockchain
Connect your Claude agent to live crypto prices and trading routes via 1inch
Get the MCP →
Files
SKILL.md

Select a file.

Featured
CodeRabbit
CodeRabbit
AI writes the code. CodeRabbit catches the slop.
Try For Free →
Lid closed, agents working
Lid closed, agents working
Keeps your Mac awake while Claude Code, Codex or Cursor works. Lets it sleep when they are done.
Try free for 7 days →
Block distraction from your iPhone for freeBlock distraction from your iPhone for free
Block distraction from your iPhone for free
Block distracting apps from your iPhone permanently without a 3rd party app. Free and open source.
Block now (100% free) →
Granola, the best AI meeting recorder
Granola, the best AI meeting recorder
Notes, actions and memory. Without a meeting bot. First month 100% off.
Download for free →
belt - the only tool your agent needs
belt - the only tool your agent needs
belt cli automatically finds the best tools and skills for your agent. image, video, music, tts...
one prompt install →
Open Steps
Open Steps
Free an open-source skills that make AI coding agents easier to understand, verify, and control.
Download for free →
AppSignal
AppSignal
Monitor with ease. Code with confidence.
Start Free Trial →
Agent, connect blockchain
Agent, connect blockchain
Connect your Claude agent to live crypto prices and trading routes via 1inch
Get the MCP →
Categories
Design & UI/UX
First SeenJun 3, 2026
View on GitHub

More from dylantarre/animation-principles

All 144 skills →
  • Continuous Loops361
  • Lists Grids361
  • Responsive Adaptive361
  • Technical Constraints361
  • Continuous Infinite360
  • Emotional Disconnect360
  • State Changes360
  • Exaggeration Mastery359
  • Problem Diagnosis359
  • Universal Industry359
  • Follow Through Overlapping358
  • Friendliness Approachability358
  • Large 500 800ms358
  • Medium 300 500ms358
  • Professionalism Credibility358
  • Straight Ahead Pose Mastery358
  • Comfort Safety357
  • Secondary Action Mastery357
  • Trust Reliability357
  • Exaggerated Clarity356
  • Feedback Indicators356
  • Product Manager356
  • Small 200 300ms356
  • Universal Elements356

Recommended

More Design & UI/UX →
dylantarre avatar
lists-grids

dylantarre/animation-principles

Use when animating lists, grids, tables, or collections of items to create smooth ordering, filtering, and loading states
361
70
dylantarre avatar
technical-constraints

dylantarre/animation-principles

Use when animation is limited by browser support, platform capabilities, or technical requirements
361
70
dylantarre avatar
emotional-disconnect

dylantarre/animation-principles

Use when animation feels wrong, creates unintended emotional response, or mismatches context
360
70
dylantarre avatar
state-changes

dylantarre/animation-principles

Use when elements transform in place - toggle switches, expanding accordions, checkbox animations, button states, or any transformation without entering/exiting.
360
70
dylantarre avatar
universal-industry

dylantarre/animation-principles

Use when designing animations for any industry or when industry-specific guidelines do not apply
359
70
dylantarre avatar
friendliness-approachability

dylantarre/animation-principles

Use when creating animations that feel warm, welcoming, and make users feel comfortable engaging.
358
70