Mobile Touch

Name: Mobile Touch
Author: dylantarre

dylantarre/animation-principles

2.1k installs
63 repo stars
Updated December 30, 2025
dylantarre/animation-principles

mobile-touch is an agent skill that Use when designing iOS/Android gestures, haptic feedback, touch interactions, or native mobile animations.

About

Apply Disney s 12 animation principles to mobile gestures haptics and native app motion Principle Mobile Implementation Squash Stretch Rubber banding bounce on scroll limits Anticipation Peek before reveal long press preview Staging Sheet presentations focus states Straight Ahead Pose to Pose Gesture driven vs preset transitions Follow Through Overlapping Momentum scrolling trailing elements Slow In Slow Out iOS spring animations Material easing Arc Swipe to dismiss curves card throws Secondary Action Haptic pulse with visual feedback Timing Touch response 100ms transitions 250 350ms Exaggeration Bounce amplitude haptic intensity Solid Drawing Respect safe areas consistent anchors Appeal 60fps minimum gesture continuity Squash Stretch Implement rubber band effect at scroll boundaries Pull to refresh should stretch content naturally Buttons compress on touch Anticipation Long press shows preview before full action Drag threshold provides visual hint before item lifts Swipe shows edge of destination content Staging Use sheet presentations to maintain context Dim and scale background during modal focus Hero transitions connect views meaningfully

description: Use when designing iOS/Android gestures, haptic feedback, touch interactions, or native mobile animations.
Apply Disney's 12 animation principles to mobile gestures, haptics, and native app motion.
| Principle | Mobile Implementation |
Follow mobile-touch SKILL.md steps and documented constraints.
Follow mobile-touch SKILL.md steps and documented constraints.

Mobile Touch by the numbers

2,082 all-time installs (skills.sh)
+31 installs in the week ending Jul 29, 2026 (Skillselion tracking)
Ranked #538 of 16,565 AI & Agent Building skills by installs in the Skillselion catalog
Security screen: LOW risk (skills.sh audit)
Data as of Jul 30, 2026 (Skillselion catalog sync)

At a glance

mobile-touch capabilities & compatibility

Capabilities: description: use when designing ios/android gest · apply disney's 12 animation principles to mobile · | principle | mobile implementation | · follow mobile touch skill.md steps and documente
Use cases: orchestration

From the docs

What mobile-touch says it does

description: Use when designing iOS/Android gestures, haptic feedback, touch interactions, or native mobile animations.

SKILL.md

Apply Disney's 12 animation principles to mobile gestures, haptics, and native app motion.

SKILL.md

| Principle | Mobile Implementation |

SKILL.md

npx skills add https://github.com/dylantarre/animation-principles --skill mobile-touch

Add your badge

Show developers this skill is listed on Skillselion. Paste this into your README.

[![Listed on Skillselion](https://skillselion.com/badge/skills/dylantarre/animation-principles/mobile-touch.svg)](https://skillselion.com/skills/dylantarre/animation-principles/mobile-touch)

Installs	2.1k
repo stars	★ 63
Security audit	3 / 3 scanners passed
Last updated	December 30, 2025
Repository	dylantarre/animation-principles ↗

When should an agent use mobile-touch and what problem does it solve?

Use when designing iOS/Android gestures, haptic feedback, touch interactions, or native mobile animations.

Who is it for?

Developers invoking mobile-touch as documented in the skill source.

Skip if: Skip when requirements fall outside mobile-touch documented scope.

When should I use this skill?

Use when designing iOS/Android gestures, haptic feedback, touch interactions, or native mobile animations.

What you get

Outputs aligned with the mobile-touch SKILL.md workflow and stated deliverables.

Gesture and haptic interaction specifications
Principle-to-pattern reference mappings

By the numbers

Covers Disney's 12 animation principles

Files

SKILL.mdMarkdownGitHub ↗

Mobile Touch Animation

Apply Disney's 12 animation principles to mobile gestures, haptics, and native app motion.

Quick Reference

Principle	Mobile Implementation
Squash & Stretch	Rubber-banding, bounce on scroll limits
Anticipation	Peek before reveal, long-press preview
Staging	Sheet presentations, focus states
Straight Ahead / Pose to Pose	Gesture-driven vs preset transitions
Follow Through / Overlapping	Momentum scrolling, trailing elements
Slow In / Slow Out	iOS spring animations, Material easing
Arc	Swipe-to-dismiss curves, card throws
Secondary Action	Haptic pulse with visual feedback
Timing	Touch response <100ms, transitions 250-350ms
Exaggeration	Bounce amplitude, haptic intensity
Solid Drawing	Respect safe areas, consistent anchors
Appeal	60fps minimum, gesture continuity

Principle Applications

Squash & Stretch: Implement rubber-band effect at scroll boundaries. Pull-to-refresh should stretch content naturally. Buttons compress on touch.

Anticipation: Long-press shows preview before full action. Drag threshold provides visual hint before item lifts. Swipe shows edge of destination content.

Staging: Use sheet presentations to maintain context. Dim and scale background during modal focus. Hero transitions connect views meaningfully.

Straight Ahead vs Pose to Pose: Gesture-following animations (drag, pinch) are straight ahead—driven by touch input. System transitions (push, present) are pose to pose—predefined keyframes.

Follow Through & Overlapping: Content continues moving after finger lifts (momentum). Navigation bar elements animate slightly after main content. Lists items settle with stagger.

Slow In / Slow Out: iOS uses spring physics—configure mass, stiffness, damping. Android Material uses standard easing: FastOutSlowIn. Never use linear for user-initiated motion.

Arc: Thrown cards follow parabolic arcs. Swipe-to-dismiss curves based on velocity vector. FAB expand/collapse follows natural arc path.

Secondary Action: Pair haptic feedback with visual response. Button ripple accompanies press. Success checkmark triggers light haptic.

Timing: Touch acknowledgment: <100ms. Quick actions: 150-250ms. View transitions: 250-350ms. Complex animations: 350-500ms. Haptic should sync precisely with visual.

Exaggeration: Pull-to-refresh stretches beyond natural—makes feedback clear. Error shake is pronounced. Success animations celebrate appropriately.

Solid Drawing: Respect device safe areas during animation. Maintain consistent transform origins. Account for notch/dynamic island in motion paths.

Appeal: Minimum 60fps, target 120fps on ProMotion displays. Gesture-driven animation must feel connected to finger. Interruptible animations essential.

Platform Patterns

iOS

// Spring animation with follow-through
UIView.animate(withDuration: 0.5,
               delay: 0,
               usingSpringWithDamping: 0.7,
               initialSpringVelocity: 0.5,
               options: .curveEaseOut)

// Haptic pairing
let feedback = UIImpactFeedbackGenerator(style: .medium)
feedback.impactOccurred()

Android

// Material spring animation
SpringAnimation(view, DynamicAnimation.TRANSLATION_Y)
    .setSpring(SpringForce()
        .setStiffness(SpringForce.STIFFNESS_MEDIUM)
        .setDampingRatio(SpringForce.DAMPING_RATIO_MEDIUM_BOUNCY))
    .start()