Back to Details

timing-principle-mastery

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Timing Mastery

时间节奏掌控

The Weight of Time

时间的重量感

Timing is the number of frames (or milliseconds) an action takes. It's deceptively simple—just duration—yet it communicates weight, emotion, and energy more powerfully than any other principle. Change the timing, change the meaning.
时间节奏（Timing）指一个动作所占用的帧数（或毫秒数）。它看似简单，无非是时长，但相比其他任何原则，它能更有力地传递重量感、情绪与活力。改变时间节奏，就改变了动作的表意。

Core Theory

核心理论

Physical communication: Timing tells us about mass and force. Heavy objects start slow, stop slow. Light objects respond instantly. A bowling ball and a balloon falling the same distance—timing alone differentiates them.
Emotional communication: Timing tells us about character state. Sluggish timing reads as tired, depressed, or massive. Snappy timing reads as alert, nervous, or lightweight.
物理层面传递信息：时间节奏能体现物体的质量与受力情况。重物启动慢、停止也慢，轻物则反应迅速。保龄球和气球从同一高度落下——仅靠时间节奏就能区分二者。
情感层面传递信息：时间节奏能体现角色状态。迟缓的节奏传递出疲惫、沮丧或笨重的感觉，明快的节奏则传递出警觉、紧张或轻盈的感觉。

The Frame Rate Foundation

帧率基础

At 24fps (film standard):
  • 1-2 frames: Instantaneous (impacts, pops)
  • 4-6 frames: Quick (snappy responses)
  • 8-12 frames: Standard (natural movement)
  • 16-24 frames: Deliberate (weighted, considered)
  • 24-48 frames: Slow (dramatic, heavy)
  • 48+ frames: Very slow (massive, underwater, dream-like)
At 60fps (UI/games), multiply by 2.5 for equivalent feels.
在24fps（电影标准帧率）下：
  • 1-2帧：瞬时动作（碰撞、爆裂）
  • 4-6帧：快速动作（敏捷反应）
  • 8-12帧：标准动作（自然运动）
  • 16-24帧：从容动作（有重量感、经过考量）
  • 24-48帧：缓慢动作（富有戏剧性、沉重）
  • 48帧以上：极慢动作（庞大、水下场景、梦幻感）
在60fps（UI/游戏帧率）下，需将上述时长乘以2.5以获得等效的感受。

Timing Categories

时间节奏分类

Physical timing: Governed by mass, gravity, and force (objective) Theatrical timing: Governed by story needs and emotional beats (subjective) Musical timing: Governed by rhythm and tempo (structural) UI timing: Governed by responsiveness and user perception (functional)
物理性时间节奏：由质量、重力和受力决定（客观） 戏剧性时间节奏：由故事需求和情感节点决定（主观） 音乐性时间节奏：由韵律和节拍决定（结构性） UI时间节奏：由响应速度和用户感知决定（功能性）

Interaction with Other Principles

与其他设计原则的关联

Slow in/slow out is timing's texture: The overall duration and the internal spacing work together.
Anticipation affects timing perception: A long wind-up makes subsequent action feel faster.
Staging uses timing for hierarchy: Important elements move on different timing than subordinate ones.
Exaggeration often means timing exaggeration: Stretched holds, compressed actions.
缓入缓出是时间节奏的质感体现：整体时长与动作内部的帧间距共同作用。
预备动作影响时间节奏感知：较长的蓄力动作会让后续动作显得更快。
构图布局通过时间节奏建立层级：重要元素的运动节奏与次要元素不同。
夸张手法通常伴随时间节奏的夸张：延长停顿、压缩动作时长。

Domain Applications

领域应用

UI/Motion Design

UI/动效设计

  • Instant (0-100ms): Button feedback, toggle switches—no perceptible delay
  • Quick (100-200ms): Micro-interactions, hover states—responsive but visible
  • Standard (200-300ms): Page transitions, modals—comfortable, comprehensible
  • Deliberate (300-500ms): Complex transitions, onboarding—time to absorb
  • Slow (500ms+): Dramatic reveals, ambient animation—contemplative
  • 瞬时（0-100毫秒）：按钮反馈、切换开关——无明显延迟
  • 快速（100-200毫秒）：微交互、悬停状态——响应迅速且可见
  • 标准（200-300毫秒）：页面过渡、模态框——舒适且易于理解
  • 从容（300-500毫秒）：复杂过渡、引导流程——留足时间让用户消化
  • 缓慢（500毫秒以上）：戏剧性展示、氛围动画——引人沉思

Character Animation

角色动画

  • Personality through timing: Bouncy = fast timing; grumpy = slow timing
  • Mass through timing: Elephant walk = 24+ frames per step; mouse = 4-6 frames
  • Emotional state: Depression slows timing; excitement speeds it
  • Age indication: Young = snappy recovery; old = slow, deliberate
  • 通过时间节奏塑造性格：活泼好动=快节奏；暴躁易怒=慢节奏
  • 通过时间节奏体现质量：大象行走=每步24帧以上；老鼠行走=4-6帧
  • 情感状态体现：抑郁会放慢节奏；兴奋会加快节奏
  • 年龄特征体现：年轻人=快速恢复动作；老年人=缓慢、从容的动作

Motion Graphics

动态图形设计

  • Rhythm establishment: Consistent timing creates beat
  • Contrast through timing: Slow builds, fast reveals
  • Musical sync: Animation locked to audio tempo
  • 建立韵律：一致的时间节奏形成节拍
  • 通过时间节奏制造对比：缓慢铺垫，快速展示
  • 音乐同步：动画与音频节拍锁定

Game Design

游戏设计

  • Responsiveness: Input-to-response timing defines "game feel"
  • Hit stop: Momentary pause on impact (adds weight)
  • Juice: Quick, satisfying timing on feedback events
  • 响应性：输入到反馈的时间节奏定义了“游戏手感”
  • 击中停顿：碰撞时的短暂停顿（增加重量感）
  • 反馈优化（Juice）：反馈事件采用快速、令人愉悦的时间节奏

Common Mistakes

常见误区

  1. Uniform timing: Everything same duration feels monotonous
  2. Too fast: Motion becomes invisible, jerky, unpleasant
  3. Too slow: Interface feels sluggish, unresponsive
  4. Ignoring context: Casual game timing in enterprise software
  1. 统一化时间节奏：所有动作时长一致会显得单调乏味
  2. 节奏过快：动效变得难以察觉、生硬且令人不适
  3. 节奏过慢：界面显得迟缓、响应不及时
  4. 忽略场景适配：在企业软件中使用休闲游戏的时间节奏

The Timing Contrast Principle

时间节奏对比原则

Timing gains meaning through contrast. A fast action feels fast because something before it was slow. A held pose feels dramatic because motion surrounds it. Monotonous timing lacks emphasis.
时间节奏通过对比产生表意。一个快速动作之所以显得快，是因为之前的动作很慢。一个静止姿势之所以富有戏剧性，是因为周围有运动的元素。单调的时间节奏缺乏重点。

The Duration Hierarchy

时长层级体系

Create timing systems where relationships are consistent:
  • Base unit (e.g., 200ms)
  • Quick = base × 0.5 (100ms)
  • Slow = base × 1.5 (300ms)
  • Dramatic = base × 2 (400ms)
Systematic timing feels cohesive; random durations feel chaotic.
创建关系一致的时间节奏体系：
  • 基础单位（如200毫秒）
  • 快速=基础单位×0.5（100毫秒）
  • 缓慢=基础单位×1.5（300毫秒）
  • 戏剧性=基础单位×2（400毫秒）
系统化的时间节奏会让人感觉协调统一；随机的时长则会显得混乱无序。

The Hold

停顿技巧

One of timing's most powerful tools is the absence of motion. Held poses create:
  • Emphasis (letting a moment land)
  • Anticipation (pregnant pause before action)
  • Readability (time for audience to register)
Never underestimate the power of stillness.
时间节奏最有力的工具之一是静止。停顿姿势可以实现：
  • 强调效果（让某个时刻深入人心）
  • 预备感（动作前的悬念停顿）
  • 可读性（让受众有时间理解内容）
永远不要低估静止的力量。

Implementation Heuristic

实用实施准则

Start with 200-300ms as default duration for standard interactions. Adjust based on: mass (heavier = longer), distance (further = longer), importance (crucial = longer to register), emotional tone (playful = snappier). When something feels "off," timing is often the culprit—experiment with 50% shorter and 50% longer before other adjustments.
标准交互的默认时长从200-300毫秒开始。根据以下因素调整：质量（越重=时长越长）、距离（越远=时长越长）、重要性（关键内容=时长更长以便用户理解）、情感基调（活泼=节奏更明快）。当感觉某个动效“不对劲”时，时间节奏往往是问题所在——先尝试将时长缩短50%或延长50%，再进行其他调整。