UV & materials · 8 / 10

Screen-Space Distortion / Refraction

背景の参照位置をずらし、熱気や屈折を画面上で近似する。

Compare in motion

熱気の背景

Synchronized comparison
AReference
歪みのない背景

歪みのない背景

BScreen-Space Distortion / Refraction100%
熱や衝撃のゆがみを近似できる

熱や衝撃のゆがみを近似できる

Loading demo…

Scrub to pause and inspect. At 0%, B matches A; at 100%, B shows the effect. The scene repeats every 8 seconds.

Look for: 参照する画素をずらす → 背景が揺らいで見える。

A small visual example of a game use case. Games combine these techniques with assets and other effects.

Read the storyboard

例: 熱気の背景

  1. 1. Start

    背景がまっすぐ見える

  2. 2. Change

    参照する画素をずらす

  3. 3. Result

    背景が揺らいで見える

熱や衝撃のゆがみを近似できる。時間変化を示す模式図です。実際の描画結果や処理速度を再現したものではありません。

How it works

  1. 1. Input

    背景画像と歪み量

  2. 2. Process

    参照する画素をずらす

  3. 3. Result

    揺らぐ背景

A schematic of Screen-Space Distortion / Refraction. It shows the relationship between input, process, and result; exact values and rendering depend on the implementation.

Further reading

Unreal Engine Material Coordinates ↗

A general reference for this subcategory.