カラーサイクリング

カラーサイクリング（パレットシフト、パレットアニメーションとも呼ばれる）は、コンピュータグラフィックスにおいて、色を変化させることでアニメーションのような印象を与える手法です。この手法は初期のビデオゲームで使用されていました。1枚の画像を保存してパレットを変更する方が、複数フレームのアニメーションを保存するよりもメモリとプロセッサの消費量が少ないためです。^{[ 1 ]}

使用例

FractIntのようなアニメーションカラーサイクル機能

• Windows 9x の起動画面では、カラー サイクルを使用してアニメーションを実現していました。
• 以前のバージョンの Windows に含まれていた 3D 迷路スクリーンセーバーでは、カラー サイクリングを使用して、使用可能な 4 つのフラクタル テクスチャをアニメーション化していました。
• Amiga Boing Ballは、ボールのチェッカーボード模様を赤と白で交互に変化させることで、ボールが回転しているような錯覚を生み出しました。セガメガドライブ版『ソニック・ザ・ヘッジホッグ3』でも、チェッカーボード模様の球体が転がるボーナスステージで同じ手法が使用されました。
• SimCity 2000ではこの手法が広く活用され、アニメーション付きの建物はすべてカラーサイクルによってアニメーション化されました。これにより、点滅するライト、流れる水、道路を走る車、さらにはドライブインシアターの小さなスクリーンに表示される4フレームのアニメーションなど、様々な効果を実現しました。
• 多くのアドベンチャー ゲームでは、カラー サイクリングを使用して、流れる水、溶岩などの効果をシミュレートしました。
• セガジェネシスの『ミッキーマニア』では、疑似3Dセクションでカラーサイクリングを使用して地面の動きをシミュレートしました。 ^{[ 2 ]}

アプローチ

カラーサイクリングは、カラーパレット内の特定の色を変更することで、アニメーションのような錯覚を生み出します。^{[ 3 ]}マーク・フェラーリの言葉を引用します

最も単純で基本的なレベルでは、カラーサイクリングは劇場の看板の電球とほぼ同じように、アニメーションの動きの錯覚を生み出します。

劇場の看板の電球が正しい順序で点滅すると、小さな光の筋が看板の周囲を互いに追いかけ合っているように見えます。しかし、ご存知の通り、個々の電球は動いていません。単に協調的な順序で点滅しているだけで、動いているように見えるのです。カラーサイクリングでは、画面上の各ピクセルは看板の電球のように完全に静止していますが、色がループする順序で変化します。そして、隣接するすべてのピクセルがそれぞれオフセットされた順序で色を変化させることと連携して、色の帯が動いているような錯覚を生み出します。

— マーク・J・フェラーリ

参考文献

1. フェラーリ、マーク。「8ビット＆『8ビット風』グラフィックス - 型破り」（ビデオ）。YouTube。GDC。2022年10月1日閲覧
2. ミッキーマニアの「不可能」な3Dチェイス - どうやって実現したのか？ https://www.youtube.com/watch?v=nt-AxAqlrOo
3. Ferrari, Mark. 「Q & A with Mark J. Ferrari」（インタビュー） . Effect Games . Effect Games LLC . 2022年10月1日閲覧。最も単純で基本的なレベルでは、カラーサイクリングは劇場の看板の電球とほぼ同じように、アニメーションの動きの錯覚を生み出します。劇場の看板の電球が正しい順序で点滅すると、小さな光の点が看板の周囲を互いに追いかけ合っているように見えます。しかし、ご存知の通り、個々の電球は動いていません。単に協調的な順序で点滅しているだけで、それが動きの錯覚を生み出しているのです。カラーサイクリングでは、画面上の各ピクセルは看板の電球のように完全に静止していますが、ループする順序で色が変化し、隣接するすべてのピクセルがそれぞれオフセットされた順序で色を変化させることで、色の帯が動いているような錯覚を生み出します。

外部リンク

• HTML5によるカラーサイクリング効果を紹介するギャラリー
• HTML5によるカラーサイクリング効果と追加機能を紹介するギャラリー