パララックス背景

ひとことで

背景を何枚かの層に分け、奥の層ほどゆっくり、手前の層ほど速くスクロールさせて奥行きを感じさせる方法です。電車の窓から見ると、遠くの山はほとんど動かず、近くの電柱はすばやく流れていきます。人の目はこの速さの違い（運動視差）から奥行きを感じるので、平らな絵を重ねただけでも、奥行きのある景色に見えます。

ゲームでの使いどころ

• 2D の横スクロール：空・遠くの山・近くの森・地面・手前の草の順に層を分け、それぞれ違う速さで動かす。16 ビット時代から続く定番の表現。
• 2.5D の表現：3D のエンジンで横スクロールを作るとき、背景の層を本当に奥へ置いて、透視投影で自然な視差を出す。
• 縦スクロールのシューティング：雲や地上の層を別の速さで流し、高さを感じさせる。
• メニュー・タイトル画面：マウスや端末の傾きに合わせて層を少しずつずらし、立体感を出す。

しくみ

カメラの位置を $c$ とし、層ごとに「動く割合」$f$ を決めます。層の画面上の位置は

です。$f = 1$ の層（地面やプレイヤー）はカメラと同じ速さで流れ、$f = 0$ の層（空）は画面に張り付いたまま、$0 < f < 1$ の層はその間の速さで流れます。$f > 1$ にすると、プレイヤーより手前を流れる前景になります。

3D の透視投影では、カメラからの距離 $D$ の平面にいるプレイヤーに対して、奥行き $d$ だけ奥にある層は、画面上で

の割合で動いて見えます。つまり、層を本当に奥へ置けば、割合を計算しなくても視差は自然に生まれます。このとき、奥へ置いた層は小さく見えるので、$\dfrac{D + d}{D}$ 倍に拡大して元の大きさに見せます。

実装のポイント

• くり返し並べる：背景の絵は、左右の端がつながる 1 枚を作り、層の幅でくり返し並べます。端がつながる絵を自動で作るには、周期ノイズ（円周上でノイズを読む）が便利です。
• 遠い層ほど淡く：遠い層ほど空の色に近い淡い色にすると（空気遠近法）、速さの違いと合わせて奥行きがさらに強く感じられます。
• 縦方向の視差：ジャンプで上下にカメラが動くときも、同じ割合で縦に動かします。縦を忘れると、遠くの山がプレイヤーと一緒に上下して不自然になります。
• ピクセルアートの場合：小数の位置で描くと、層ごとに細かく揺れて見えます。層の位置を整数ピクセルにそろえます。

つまずきやすい点

• 割合と大きさが合わない：遠くに見せたい層を速く動かすと、近いのか遠いのか目が混乱します。絵の大きさ（遠いほど小さい）と動く割合をそろえます。
• 手前の層が邪魔：$f > 1$ の前景は迫力が出ますが、プレイヤーや敵を隠さないよう、薄く・まばらにします。
• 3D での奥行きの限界：本当に奥へ置く方法では、とても遠い層ほどカメラの描画範囲（far）や深度の精度が問題になります。空は別に描くなどの工夫をします。

デモで試すこと

1. 「層ごとに動く割合を決める（2D）」では、遠くの山がほとんど動かず、丘・森・地面・手前の草の順に速く流れます。右下の棒グラフが、各層の流れる速さです。
2. 「視差なし」にすると、すべての層が同じ速さで流れ、景色が一枚の平たい絵に見えます。遠くの山が、プレイヤーのすぐ後ろにあるように感じられます。
3. 「本当に奥へ置く（3D）」に切り替えても、見た目はほとんど変わりません。割合を計算する代わりに、層を奥へ置いて拡大し、透視投影で同じ視差を作っています。
4. 「視差の強さ」を 0 から少しずつ上げると、奥行きの感じ方が変わっていく様子がわかります。