Common mobile animation

Skill ComeOnOliver/skillshub/skills/HoangNguyen0403/agent-skills-standard/common-mobile-animation

🧠 The right skill, one API call. AI agent skills registry with token-efficient skill resolution. 5,000+ skills from 500+ top repos.

Install

npx -y skills add ComeOnOliver/skillshub --skill common-mobile-animation

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

What its author says it does

Copied from the file, not written here

Motion design principles for mobile apps. Covers timing curves, transitions, gestures, and performance-conscious animations. (triggers: **/*_page.dart, **/*_screen.dart, **/*.swift, **/*Activity.kt, **/*Screen.tsx, Animation, AnimationController, Animated, MotionLayout, transition, gesture)

SKILL.md

1.4 KB, as published. Nobody here has run it

Mobile Animation

Priority: P1 (OPERATIONAL)

Native-feeling motion design. Optimize for 60fps and platform conventions.

Timing Standards

Short: 100-150ms (Toggles, cell press)
Medium: 250-350ms (Nav, modals)
Long: 400-600ms (Shared element, complex state)
Limit: Never >600ms.

Guidelines

Easing: Use Curves.fastOutSlowIn (Material) or easeInOut (iOS). Avoid linear.
Performance: Animate transform (Scale/Translation) and opacity. Avoid width/height.
Gestures: Implement onPan / interactivePopGesture for fluid UX.
Optimization: Use FadeTransition / SlideTransition over AnimatedBuilder for simple cases.

Animation Patterns

Anti-Patterns

No Linear Easing: Feels robotic.
No Layout Trashing: Avoid animating properties that trigger layout (width, padding).
No Memory Leaks: Always dispose() AnimationControllers.
No Blocking UI: Run heavy calculations outside animation frames.