Camera & controls · 10 / 10

Parallax Scrolling

奥行き層ごとのスクロール速度を変える。

Compare in motion

Interactive demo

重なる背景

Synchronized comparison

AReference

背景が同じ速さで動く

BParallax Scrolling100%

二次元画面に奥行き感を出せる

Loading demo…

Speed

Time1.20 / 8.00 sB · effect amount100%

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. Start
奥行き層が並ぶ
2. Change
奥ほど少なくスクロール
3. Result
背景に奥行きを感じる

二次元画面に奥行き感を出せる。時間変化を示す模式図です。実際の描画結果や処理速度を再現したものではありません。

How it works

1. Input
背景の複数の層
2. Process
奥ほど少なく動かす
3. Result
奥行きを感じるスクロール

A schematic of Parallax Scrolling. It shows the relationship between input, process, and result; exact values and rendering depend on the implementation.

Compare in motion

重なる背景

How it works

Further reading