Design
1,149 skills.
Browse
joy-delightdylantarreUse when creating animations that evoke happiness, surprise, or delightful moments in the user experience.large-500-800msdylantarreUse when building larger movement animations between 500-800ms - hero transitions, complex reveals, animations that tell a story and deserve attentionlists-gridsdylantarreUse when animating lists, grids, tables, or collections of items to create smooth ordering, filtering, and loading statesloaders-spinnersdylantarreUse when creating loading indicators, spinners, progress bars, or skeleton screens to communicate system statusloading-statesdylantarreUse when indicating progress or waiting - spinners, progress bars, skeleton screens, shimmer effects, or any animation showing the system is working.lottie-bodymovindylantarreUse when implementing Disney's 12 animation principles with Lottie animations exported from After Effectsmedia-publishingdylantarreUse when designing animations for news sites, content platforms, publishing apps, or media consumption experiencesmedium-300-500msdylantarreUse when building standard animations between 300-500ms - page transitions, significant UI changes, animated illustrations that need clear communicationmicro-100-200msdylantarreUse when building micro-interactions between 100-200ms - tooltips appearing, dropdown opens, small feedback animations that feel quick but perceptiblemodals-dialogsdylantarreUse when animating modals, dialogs, popovers, or overlay content to create smooth entrances and exitsmotion-onedylantarreUse when implementing Disney's 12 animation principles with Motion One (modern, lightweight animation library)motion-sicknessdylantarreUse when animation causes dizziness, nausea, disorientation, or vestibular discomfortnaturalistic-motiondylantarreUse when animation should feel organic and lifelike—creature animation, realistic characters, nature elements, or any motion that needs to breathe with authentic living quality.navigation-menusdylantarreUse when animating navigation bars, menus, sidebars, or wayfinding elements to create smooth, intuitive transitionsnotifications-toastsdylantarreUse when animating notifications, toasts, alerts, snackbars, or system messages to grab attention appropriatelyorchestrated-sequencesdylantarreUse when building multi-part animation sequences - staggered reveals, choreographed UI, coordinated motion where multiple elements work togetherpage-transitionsdylantarreUse when implementing route changes, view transitions, modal opens/closes, or navigation animation in web and mobile applications.physics-intuitiondylantarreUse when motion needs to feel physically grounded—objects falling, characters jumping, things colliding, or any element that should obey believable weight and momentum.playfulness-fundylantarreUse when creating animations that entertain, engage with humor, or create lighthearted interactive experiences.popmotiondylantarreUse when implementing Disney's 12 animation principles with Popmotion's functional animation librarypower-confidencedylantarreUse when creating animations that convey strength, authority, or bold confidence in brand and product.presentationsdylantarreUse when creating Keynote, PowerPoint, Google Slides animations, or any presentation motion design work.problem-diagnosisdylantarreUse when animation "feels wrong" but you can't pinpoint why—debugging floaty movement, stiff characters, unclear action, or any motion that isn't working and needs systematic troubleshooting.professionalism-credibilitydylantarreUse when creating animations for business contexts that require seriousness, competence, and trustworthy presentation.responsive-adaptivedylantarreUse when building context-dependent animations - duration that changes based on device, distance, user preference, or interaction contextrhythm-pacingdylantarreUse when animation needs musical flow—dance sequences, action choreography, comedic timing, scene pacing, or any motion that should feel rhythmic and well-composed over time.rive-animationsdylantarreUse when implementing Disney's 12 animation principles with Rive interactive animationssaas-productivitydylantarreUse when designing animations for business tools, project management, collaboration software, or productivity appsscroll-animationsdylantarreUse when triggering animations on scroll - reveal effects, parallax, sticky headers, progress indicators, or any scroll-linked motion.secondary-action-masterydylantarreUse when enriching primary animations, adding supporting details, creating depth in motion, or making scenes feel alive without distracting from main action.slow-800-1200msdylantarreUse when building deliberate motion between 800-1200ms - dramatic reveals, loading sequences, storytelling moments where users should pause and absorbslow-in-out-masterydylantarreUse when designing easing curves, controlling motion pacing, creating natural acceleration/deceleration, or making movements feel physically grounded.small-200-300msdylantarreUse when building small transitions between 200-300ms - modal appearances, card expansions, navigation transitions that users consciously perceivesocial-mediadylantarreUse when designing animations for social platforms, messaging apps, content sharing, or community featuressolid-drawing-masterydylantarreUse when creating motion that needs dimensional grounding, designing transforms that maintain object integrity, or ensuring animations feel structurally sound.spatial-thinkingdylantarreUse when animation involves depth, perspective, volume, or three-dimensional awareness—camera moves, character positioning, environmental interaction, or maintaining consistent spatial relationships.squash-stretch-masterydylantarreUse when implementing deformation effects, bounce animations, impact responses, or any motion requiring organic elasticity and weight expression.staging-masterydylantarreUse when composing scenes, designing layouts, directing user attention, or ensuring a single clear idea is communicated at any given moment.state-changesdylantarreUse when elements transform in place - toggle switches, expanding accordions, checkbox animations, button states, or any transformation without entering/exiting.straight-ahead-pose-masterydylantarreUse when planning animation workflows, deciding between spontaneous vs controlled approaches, or balancing creative freedom with structural precision.timing-calibrationdylantarreUse when animation speed feels wrong—too fast, too slow, or inconsistenttiming-masterydylantarreUse when determining how fast or slow motion should be—pacing action sequences, dramatic pauses, comedic beats, or any situation where the duration of movement matters.timing-principle-masterydylantarreUse when determining animation durations, controlling pacing, establishing rhythm, or making motion feel appropriately weighted and emotionally resonant.transition-sequencesdylantarreUse when orchestrating multi-step animations - page transitions, onboarding flows, wizard steps, complex reveals, or any choreographed animation sequence.travel-hospitalitydylantarreUse when designing animations for travel booking, hospitality apps, tourism platforms, or vacation planning experiencestrust-reliabilitydylantarreUse when creating animations that build user confidence, establish credibility, and communicate dependability.universal-elementsdylantarreUse when animating any UI element not covered by specific skills, or when applying general animation principles across multiple element typesuniversal-emotiondylantarreUse when you need to achieve any emotional outcome through animation—provides a framework for mapping Disney principles to any target emotion.universal-fallbackdylantarreUse when the animation domain is unclear or spans multiple contexts—provides general-purpose Disney animation principle guidance.universal-industrydylantarreUse when designing animations for any industry or when industry-specific guidelines do not apply