game-development

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Game Development Animation

游戏开发动画

Apply Disney's 12 animation principles to game engines, player feedback, and interactive entertainment.

将迪士尼的12条动画原则应用于游戏引擎、玩家反馈和互动娱乐场景中。

Quick Reference

快速参考

Principle	Game Implementation
Squash & Stretch	Character deformation, impact frames
Anticipation	Wind-up animations, charge indicators
Staging	Camera focus, environmental cues
Straight Ahead / Pose to Pose	Procedural vs keyframed animation
Follow Through / Overlapping	Capes, hair, weapon trails
Slow In / Slow Out	Animation curves, attack/recovery
Arc	Projectile paths, jump trajectories
Secondary Action	Particles, screen shake, audio sync
Timing	Frame data, hit-stop, response windows
Exaggeration	Stylized movement, hit reactions
Solid Drawing	Consistent silhouettes, read at distance
Appeal	Character personality, satisfying feedback

原则	游戏场景实现
Squash & Stretch	角色形变、冲击帧
Anticipation	蓄力动画、充能指示器
Staging	镜头聚焦、环境提示
Straight Ahead / Pose to Pose	程序化动画 vs 关键帧动画
Follow Through / Overlapping	披风、头发、武器轨迹
Slow In / Slow Out	动画曲线、攻击/恢复动作
Arc	抛射物路径、跳跃轨迹
Secondary Action	粒子特效、屏幕震动、音频同步
Timing	帧数据、击中停顿、响应窗口
Exaggeration	风格化移动、受击反应
Solid Drawing	一致剪影、远距离辨识度
Appeal	角色个性、反馈爽快感

Principle Applications

原则应用

Squash & Stretch: Deform characters on landing impact. Stretch during fast movement. Impact frames freeze and squash for power. Keep volume consistent in deformation.

Anticipation: Attack wind-ups telegraph to players. Jump squats before leaving ground. Charge attacks show buildup. Enemy tells warn of incoming damage.

Staging: Camera frames important action. Environmental lighting guides attention. Enemy placement creates readable combat scenarios. UI doesn't obscure critical gameplay.

Straight Ahead vs Pose to Pose: Procedural animation (ragdoll, physics) is straight ahead. Keyframed attack combos are pose to pose. Blend both—keyframed base with procedural secondary motion.

Follow Through & Overlapping: Secondary elements (hair, cloth, tails) continue after body stops. Weapon trails persist after swing. Landing recovery extends past initial impact.

Slow In / Slow Out: Use animation curves—never linear for character motion. Attack startup fast-out, recovery slow-in. Ease jumps at apex for floatiness control.

Arc: Jumping follows parabolic arc. Sword swings trace curved paths. Projectiles arc naturally unless hitscan. Dodge rolls curve rather than linear translate.

Secondary Action: Screen shake on impact. Particle bursts on hits. Controller rumble synced to action. Sound design reinforces visual timing.

Timing: Hit-stop (freeze frames) emphasizes impact—2-5 frames typical. Attack startup/active/recovery frame data matters for game feel. Response to input under 100ms.

Exaggeration: Game animation reads at distance and speed. Exaggerate poses 20-30% beyond realistic. Hit reactions more dramatic than physics would suggest. Stylization serves clarity.

Solid Drawing: Silhouettes must read at all zoom levels. Consistent character proportions across animations. Strong poses at keyframes. Avoid tangent lines that confuse form.

Appeal: Characters have personality in idle animations. Movement feels satisfying independent of mechanics. Players should enjoy watching their character move.

Squash & Stretch（挤压与拉伸）：角色落地冲击时发生形变。快速移动时进行拉伸。冲击帧冻结并挤压以体现力量感。形变过程中保持体积一致。

Anticipation（预备动作）：攻击前的蓄力动作给玩家明确提示。跳跃前先下蹲。蓄力攻击展示能量积累过程。敌人的动作预告即将到来的伤害。

Staging（构图）：镜头聚焦重要动作。环境灯光引导玩家注意力。敌人的位置布局打造清晰的战斗场景。UI界面不遮挡关键游戏内容。

Straight Ahead vs Pose to Pose（逐帧动画与关键帧动画）：程序化动画（如布娃娃系统、物理模拟）属于逐帧动画类型。关键帧动画用于制作攻击连招。可混合两种方式——关键帧制作基础动作，程序化实现次要运动。

Follow Through & Overlapping（跟随与重叠动作）：次要元素（头发、布料、尾巴）在身体停止后继续运动。武器挥砍后的轨迹残留。落地后的恢复动作延续至初始冲击之后。

Slow In / Slow Out（缓入缓出）：使用动画曲线——角色运动绝不采用线性曲线。攻击启动阶段快速输出，恢复阶段缓慢进入。跳跃顶点处添加缓动效果以控制浮空感。

Arc（弧线运动）：跳跃遵循抛物线轨迹。挥剑动作沿曲线轨迹进行。抛射物自然沿弧线运动，除非是即时命中类型。闪避翻滚采用曲线移动而非线性平移。

Secondary Action（次要动作）：冲击时屏幕震动。击中时触发粒子爆发。手柄震动与动作同步。音效设计强化视觉节奏。

Timing（时机控制）：击中停顿（冻结帧）强调冲击感——通常为2-5帧。攻击的启动/生效/恢复阶段的帧数据对游戏手感至关重要。输入响应需控制在100ms以内。

Exaggeration（夸张）：游戏动画需保证在远距离和高速下仍清晰可读。将姿势夸张至超出真实范围20-30%。受击反应比物理模拟的效果更夸张。风格化处理以提升辨识度。

Solid Drawing（扎实造型）：剪影在所有缩放级别下都需清晰可辨。角色比例在所有动画中保持一致。关键帧处的姿势要有力。避免使用混淆造型的切线。

Appeal（吸引力）：角色的Idle动画体现个性。即使脱离游戏机制，角色移动仍需带来爽快感。玩家应享受观看角色移动的过程。

Engine Patterns

引擎实现方案

Unity

csharp

// Squash and stretch on landing
IEnumerator LandingSquash() {
    transform.localScale = new Vector3(1.2f, 0.8f, 1.2f);
    yield return new WaitForSeconds(0.05f);
    // Ease back to normal
    float t = 0;
    while (t < 1) {
        t += Time.deltaTime * 8f;
        transform.localScale = Vector3.Lerp(
            new Vector3(1.2f, 0.8f, 1.2f),
            Vector3.one,
            EaseOutElastic(t));
        yield return null;
    }
}

// Hit-stop for impact
IEnumerator HitStop(int frames) {
    Time.timeScale = 0f;
    for (int i = 0; i < frames; i++)
        yield return null;
    Time.timeScale = 1f;
}

csharp

// Squash and stretch on landing
IEnumerator LandingSquash() {
    transform.localScale = new Vector3(1.2f, 0.8f, 1.2f);
    yield return new WaitForSeconds(0.05f);
    // Ease back to normal
    float t = 0;
    while (t < 1) {
        t += Time.deltaTime * 8f;
        transform.localScale = Vector3.Lerp(
            new Vector3(1.2f, 0.8f, 1.2f),
            Vector3.one,
            EaseOutElastic(t));
        yield return null;
    }
}

// Hit-stop for impact
IEnumerator HitStop(int frames) {
    Time.timeScale = 0f;
    for (int i = 0; i < frames; i++)
        yield return null;
    Time.timeScale = 1f;
}

Unreal

cpp

// Animation curve for easing
UPROPERTY(EditAnywhere)
UCurveFloat* JumpArcCurve;

// Apply curve to movement
float CurveValue = JumpArcCurve->GetFloatValue(NormalizedTime);

cpp

// Animation curve for easing
UPROPERTY(EditAnywhere)
UCurveFloat* JumpArcCurve;

// Apply curve to movement
float CurveValue = JumpArcCurve->GetFloatValue(NormalizedTime);

Timing Reference

时机参考

Action Type	Startup	Active	Recovery
Light attack	3-6f	2-4f	8-12f
Heavy attack	12-20f	4-8f	16-24f
Jump	3-4f	--	4-6f
Dodge	2-4f	8-12f	6-10f

Frame data at 60fps. Adjust for target framerate.

动作类型	启动帧	生效帧	恢复帧
轻攻击	3-6f	2-4f	8-12f
重攻击	12-20f	4-8f	16-24f
跳跃	3-4f	--	4-6f
闪避	2-4f	8-12f	6-10f

以上帧数据基于60fps。可根据目标帧率进行调整。