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

Motion One

dylantarre/animation-principles
412 installs70 stars
Summary

This walks through all 12 Disney animation principles using Motion One, a 3kb animation library that wraps the Web Animations API. You get working examples for squash and stretch, anticipation, arcs, timing with spring physics, and the rest. The code is clean and shows practical patterns like stagger delays, scroll-linked animations, and timeline sequencing with the "at" parameter for precise timing control. If you're tired of bloated animation libraries or fighting with CSS keyframes, this gives you hardware-accelerated animations with a tiny bundle. The spring physics alone makes button interactions feel way better than standard easing curves.

Install to Claude Code

npx -y skills add dylantarre/animation-principles --skill motion-one --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 →
  • Navigation Menus412
  • Character Appeal410
  • Rive Animations408
  • Buttons Ctas407
  • Frontend Developer406
  • Playfulness Fun404
  • Fintech Banking402
  • Gaming Entertainment401
  • Gesture Responses401
  • Accessibility Advocate400
  • Brand Marketing399
  • Icons Badges394
  • Modals Dialogs392
  • Ux Researcher392
  • Spatial Thinking390
  • Micro 100 200ms387
  • Attention Direction385
  • Joy Delight385
  • Entrance Animations383
  • React Spring383
  • Universal Emotion383
  • Naturalistic Motion382
  • Solid Drawing Mastery382
  • Attention Grabbers381

Recommended

More Design & UI/UX →
motion-team avatar
visual-formats

motion-team/creative-strategy-skills

A reference library of 45+ visual ad formats for Meta and paid social, each with a definition, funnel stage guidance, and medium (video/static/both). Use this whenever choosing how an ad should look and feel, building out a creative concept, writing a creative brief, or deciding which format best serves a messaging angle and awareness stage. Trigger when the user asks "what format should this be," "how should we execute this," "give me concept ideas," or any time a creative concept needs a production structure. Always pair with creative-mechanics to fully flesh out the concept — format defines the vessel, mechanic defines the cognitive move inside it. Either can come first; they work in both directions.
388
147
dylantarre avatar
naturalistic-motion

dylantarre/animation-principles

Use when animation should feel organic and lifelike—creature animation, realistic characters, nature elements, or any motion that needs to breathe with authentic living quality.
382
70
dylantarre avatar
accessibility-issues

dylantarre/animation-principles

Use when animation excludes users with vestibular disorders, cognitive disabilities, or assistive technology needs
352
70
dylantarre avatar
motion-sickness

dylantarre/animation-principles

Use when animation causes dizziness, nausea, disorientation, or vestibular discomfort
352
70
dylantarre avatar
ux-friction

dylantarre/animation-principles

Use when animation causes user confusion, delays task completion, or creates frustration
351
70
nexu-io avatar
motion-frames

nexu-io/open-design

A single-frame motion-design composition with looping CSS animations — rotating type ring, animated globe, ticking timer, parallax labels. Renders as a hero video poster you can hand straight to HyperFrames or any keyframe-based exporter. Use when the brief asks for "motion design", "animated hero", "loop", "video poster", "title card", or pairs Open Claude Design with HyperFrames for a kinetic export.
253
84.7k