dylantarre/animation-principles - 4ページ

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

原文の言語: 英語

performance-optimization

Use when animation runs slow, janky, or causes frame drops

原文の言語: 英語

technical-constraints

Use when animation is limited by browser support, platform capabilities, or technical requirements

原文の言語: 英語

timing-calibration

Use when animation speed feels wrong—too fast, too slow, or inconsistent

原文の言語: 英語

universal-solutions

Use when facing any animation problem as a comprehensive diagnostic framework

原文の言語: 英語

user-feedback-clarity

Use when users don't notice feedback, miss state changes, or can't tell if their action worked

原文の言語: 英語

ux-friction

Use when animation causes user confusion, delays task completion, or creates frustration

原文の言語: 英語