dylantarre/animation-principles - 第 3 页

modals-dialogs

Use when animating modals, dialogs, popovers, or overlay content to create smooth entrances and exits

原文语言：英语

navigation-menus

Use when animating navigation bars, menus, sidebars, or wayfinding elements to create smooth, intuitive transitions

原文语言：英语

notifications-toasts

Use when animating notifications, toasts, alerts, snackbars, or system messages to grab attention appropriately

原文语言：英语

universal-elements

Use when animating any UI element not covered by specific skills, or when applying general animation principles across multiple element types

原文语言：英语

e-commerce-retail

Use when designing animations for shopping apps, product catalogs, checkout flows, or retail experiences

原文语言：英语

education-learning

Use when designing animations for educational platforms, e-learning, tutoring apps, or skill-building experiences

原文语言：英语

enterprise-b2b

Use when designing animations for enterprise software, B2B platforms, admin dashboards, or corporate applications

原文语言：英语

fintech-banking

Use when designing animations for banking apps, payment systems, investment platforms, or financial dashboards

原文语言：英语

fitness-wellness

Use when designing animations for fitness apps, wellness platforms, workout trackers, or meditation experiences

原文语言：英语

gaming-entertainment

Use when designing animations for gaming apps, streaming platforms, entertainment portals, or interactive media

原文语言：英语

healthcare-medical

Use when designing animations for medical apps, patient portals, telehealth, or health tracking interfaces

原文语言：英语

media-publishing

Use when designing animations for news sites, content platforms, publishing apps, or media consumption experiences

原文语言：英语

saas-productivity

Use when designing animations for business tools, project management, collaboration software, or productivity apps

原文语言：英语

social-media

Use when designing animations for social platforms, messaging apps, content sharing, or community features

原文语言：英语

travel-hospitality

Use when designing animations for travel booking, hospitality apps, tourism platforms, or vacation planning experiences

原文语言：英语

universal-industry

Use when designing animations for any industry or when industry-specific guidelines do not apply

原文语言：英语

after-effects

Use when implementing Disney's 12 animation principles in Adobe After Effects

原文语言：英语

anime-js

Use when implementing Disney's 12 animation principles with Anime.js library

原文语言：英语

css-native

Use when implementing Disney's 12 animation principles with pure CSS animations and transitions

原文语言：英语

figma-prototyping

Use when implementing Disney's 12 animation principles in Figma prototypes and Smart Animate

原文语言：英语

gsap-greensock

Use when implementing Disney's 12 animation principles with GSAP (GreenSock Animation Platform)

原文语言：英语

motion-one

Use when implementing Disney's 12 animation principles with Motion One (modern, lightweight animation library)

原文语言：英语

popmotion

Use when implementing Disney's 12 animation principles with Popmotion's functional animation library

原文语言：英语

react-spring

Use when implementing Disney's 12 animation principles with React Spring's physics-based animations

原文语言：英语

rive-animations

Use when implementing Disney's 12 animation principles with Rive interactive animations

原文语言：英语

universal-tool

Use when implementing Disney's 12 animation principles with any animation tool or framework

原文语言：英语

continuous-infinite

Use when building ongoing loop animations - loading states, ambient motion, background effects that run indefinitely without user fatigue

原文语言：英语

deliberate-1200-2000ms

Use when building slow intentional animations between 1200-2000ms - app intros, loading sequences, storytelling moments that create emotional resonance

原文语言：英语

dramatic-2000ms-plus

Use when building extended animation sequences over 2000ms - cinematic intros, story sequences, premium experiences where animation IS the product

原文语言：英语

instant-0-100ms

Use when building instantaneous UI feedback under 100ms - button presses, toggles, state changes that feel immediate and responsive

原文语言：英语

large-500-800ms

Use when building larger movement animations between 500-800ms - hero transitions, complex reveals, animations that tell a story and deserve attention

原文语言：英语

medium-300-500ms

Use when building standard animations between 300-500ms - page transitions, significant UI changes, animated illustrations that need clear communication

原文语言：英语

micro-100-200ms

Use when building micro-interactions between 100-200ms - tooltips appearing, dropdown opens, small feedback animations that feel quick but perceptible

原文语言：英语

orchestrated-sequences

Use when building multi-part animation sequences - staggered reveals, choreographed UI, coordinated motion where multiple elements work together

原文语言：英语

responsive-adaptive

Use when building context-dependent animations - duration that changes based on device, distance, user preference, or interaction context

原文语言：英语

slow-800-1200ms

Use when building deliberate motion between 800-1200ms - dramatic reveals, loading sequences, storytelling moments where users should pause and absorb

原文语言：英语

small-200-300ms

Use when building small transitions between 200-300ms - modal appearances, card expansions, navigation transitions that users consciously perceive

原文语言：英语

universal-timing

Use when learning animation timing fundamentals - principles that apply regardless of duration, the foundational rules that scale across all time ranges

原文语言：英语

anticipation-mastery

Use when designing action sequences, user interactions, state transitions, or any motion that needs telegraphing to feel intentional rather than sudden.

原文语言：英语

appeal-mastery

Use when designing character personalities, creating memorable motion signatures, ensuring animations feel polished, or making visual experiences that audiences want to watch.

原文语言：英语