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.
arc-mastery
Use when designing motion paths, character movement trajectories, gesture animations, or any motion that should feel natural rather than robotic.
exaggeration-mastery
Use when determining how far to push motion beyond realism, calibrating animation intensity for context, or making key moments register with audiences.
follow-through-overlapping
Use when animating multi-part objects, character appendages, fabric, hair, or any motion requiring realistic drag, momentum, and settling behavior.
secondary-action-mastery
Use when enriching primary animations, adding supporting details, creating depth in motion, or making scenes feel alive without distracting from main action.
slow-in-out-mastery
Use when designing easing curves, controlling motion pacing, creating natural acceleration/deceleration, or making movements feel physically grounded.
solid-drawing-mastery
Use when creating motion that needs dimensional grounding, designing transforms that maintain object integrity, or ensuring animations feel structurally sound.
squash-stretch-mastery
Use when implementing deformation effects, bounce animations, impact responses, or any motion requiring organic elasticity and weight expression.
staging-mastery
Use when composing scenes, designing layouts, directing user attention, or ensuring a single clear idea is communicated at any given moment.
straight-ahead-pose-mastery
Use when planning animation workflows, deciding between spontaneous vs controlled approaches, or balancing creative freedom with structural precision.
timing-principle-mastery
Use when determining animation durations, controlling pacing, establishing rhythm, or making motion feel appropriately weighted and emotionally resonant.
accessibility-issues
Use when animation excludes users with vestibular disorders, cognitive disabilities, or assistive technology needs
attention-management
Use when wrong elements get attention, important content is missed, or visual hierarchy is broken by animation
brand-consistency
Use when animation doesn't match brand personality, feels generic, or clashes with design language
emotional-disconnect
Use when animation feels wrong, creates unintended emotional response, or mismatches context
implementation-debugging
Use when animation doesn't work as expected, has bugs, or behaves inconsistently
motion-sickness
Use when animation causes dizziness, nausea, disorientation, or vestibular discomfort
fintech-banking
Use when designing animations for banking apps, payment systems, investment platforms, or financial dashboards
education-learning
Use when designing animations for educational platforms, e-learning, tutoring apps, or skill-building experiences
e-commerce-retail
Use when designing animations for shopping apps, product catalogs, checkout flows, or retail experiences
universal-elements
Use when animating any UI element not covered by specific skills, or when applying general animation principles across multiple element types
notifications-toasts
Use when animating notifications, toasts, alerts, snackbars, or system messages to grab attention appropriately
navigation-menus
Use when animating navigation bars, menus, sidebars, or wayfinding elements to create smooth, intuitive transitions
modals-dialogs
Use when animating modals, dialogs, popovers, or overlay content to create smooth entrances and exits
loaders-spinners
Use when creating loading indicators, spinners, progress bars, or skeleton screens to communicate system status
lists-grids
Use when animating lists, grids, tables, or collections of items to create smooth ordering, filtering, and loading states
icons-badges
Use when animating icons, badges, avatars, status indicators, or small visual elements to add personality and feedback
forms-inputs
Use when animating form fields, inputs, textareas, selects, or interactive form elements to improve usability and feedback
transition-sequences
Use when orchestrating multi-step animations - page transitions, onboarding flows, wizard steps, complex reveals, or any choreographed animation sequence.
universal-patterns
Use when creating any animation type - provides foundational timing, easing, and principle application that applies to all motion in interfaces.
calm-relaxation
Use when creating animations that soothe users, reduce anxiety, or create peaceful, meditative experiences.
comfort-safety
Use when creating animations that reassure users, reduce anxiety, or communicate protection and security.
elegance-sophistication
Use when creating animations that convey luxury, refinement, or premium brand experiences.
excitement-energy
Use when creating animations that generate enthusiasm, build anticipation, or create high-energy experiences.
friendliness-approachability
Use when creating animations that feel warm, welcoming, and make users feel comfortable engaging.
joy-delight
Use when creating animations that evoke happiness, surprise, or delightful moments in the user experience.
playfulness-fun
Use when creating animations that entertain, engage with humor, or create lighthearted interactive experiences.
power-confidence
Use when creating animations that convey strength, authority, or bold confidence in brand and product.
professionalism-credibility
Use when creating animations for business contexts that require seriousness, competence, and trustworthy presentation.
trust-reliability
Use when creating animations that build user confidence, establish credibility, and communicate dependability.
universal-emotion
Use when you need to achieve any emotional outcome through animation—provides a framework for mapping Disney principles to any target emotion.
urgency-action
Use when creating animations that prompt immediate user action, highlight time-sensitivity, or drive conversions.
accordions-dropdowns
Use when animating accordions, collapsibles, dropdowns, or expand/collapse elements for smooth reveal transitions
buttons-ctas
Use when animating buttons, CTAs, or clickable action elements to create satisfying, responsive interactions
ux-friction
Use when animation causes user confusion, delays task completion, or creates frustration
Page 1209 of 1642 · 82067 results
