テクスチャ圧縮フォーマットPVRTCのTips CEDEC2013復習編(2)

ウェブテクノロジ R&D部の上田です。

今回は前回に引き続いて、CEDEC2013の公募セッションから、テクスチャ圧縮フォーマットのPVRTCに関するTipsをピックアップしてご紹介したいと思います。

なお、CEDEC2013公募セッションの全スライド資料は、下記からダウンロードできますので、本記事で興味を持たれた方は、ぜひそちらもご覧ください。
CEDEC2013『工程の手戻りを最小限に圧縮テクスチャ(PVRTC・DXTC・ETC)における傾向と対策』発表資料

>PVRTCのTips

1.1 UIパーツ圧縮時の劣化対策

PVRTCのTips一つ目は、UIパーツをPVRTC圧縮した時に発生する劣化の対処法です。
上の図のように、UIパーツのような画像サイズが小さくて色のクッキリしている画像をPVRTC圧縮すると、色がにじむように劣化してしまうことが多いです。
このような場合、劣化を回避する一つの方法として、文字・輪郭・背景などをそれぞれ別パーツにして圧縮し、表示する時に合成する、というものがあります。
このように、文字・輪郭・背景とそれぞれを別パーツにしてから圧縮し、表示する時に重ねて表示するようにします。
こうすることで、UIパーツを直接圧縮するよりも、綺麗な表示を実現することができます。ただし、画像を別パーツに分割することで、全体のファイルサイズの増加や表示する時のリソース使用量が増加してしまう、といった副作用もあります。

1.2 テクスチャアトラス作成時の注意点

二番目のTipsは、テクスチャアトラス作成時の注意点です。
下の図はカラーバーをPVRTC圧縮したものですが、接触していないカラーブロックの間で色が干渉してしまっています。（カラーブロック間の薄緑部分は透過色部分です）
このように、PVRTC圧縮ではパーツが接触していなくても、色が干渉して劣化してしまうことがあります。
このような劣化が発生した場合には、単純にパーツ間のマージンを増やすことで解決できます。
マージンを倍にすることで、色の干渉による劣化を防ぐことができました。
実際のところ、テクスチャアトラスをPVRTCで圧縮する場合、各パーツ間のマージンは8ピクセル程度は作っておく方が良い結果が出る傾向にあります。

1.3 アルファグラデーション対策

PVRTCでアルファグラデーション画像を圧縮すると、アルファチャンネル部分が劣化していることが多いです。
上の図では、オリジナル画像に比べてアルファグラデーションがもやもやとした雲のように劣化しています。
この原因としては、PVRTCはアルファチャンネルの扱いが苦手、ということがあります。
上の図は、PVRTC4bppモードで4×4ピクセルに割り当てられるビット数を、アルファ有りの場合とアルファ無しの場合で比較しています。
PVRTCではアルファがある画像も無い画像も、4×4ピクセルに割り当てられるビット数は64ビットで一定になっています。
そのため、同じようにアルファチャンネルを扱うDXTCが、4×4ピクセルあたり64ビットをアルファチャンネルに割り当てるのに対して、PVRTCではアルファチャンネルに割り当てるビット数がすごく少なくなっています。
結果として、PVRTCはアルファチャンネルの扱いが苦手となっているのです。
それならば、アルファグラデーション画像を綺麗に圧縮するにはどうすればいいの？ということなんですが、こんな方法があります。
つまり、アルファグラデーションは劣化しやすいので、RGBプレーンのみで同じグラデーション表現が使える場合であれば、アルファグラデーションを使わない、という方法です。特定の条件でのみ使える解決法ですが、ちょっとしたテクニックの一つとして覚えておくと良いでしょう。

1.4 PVRTC 2bppモードの特性

Tipsの4つ目は、PVRTC2bppモードの特性についての話です。

例えば次のような例を考えてみましょう。
PVRTC2bppモードは、PVRTC4bppモードと比べて、圧縮率が2倍になっているので、当然劣化の度合いも大きくなっています。特に上の例のような、色の変化がクッキリしていてファイルサイズの小さい画像は、かなり劣化します。
ところが、PVRTC2bppモードにはその圧縮特性に特徴があって、ちょっとした工夫で少しだけ劣化を抑えることができます。
上の解説のように、PVRTC2bppモードでは8×4ピクセルあたり64ビットを割り当てて圧縮しているのですが、PVRTC4bppモードに比べて、割り当てられているピクセルが水平方向について2倍になっています。

このため、PVRTC2bppモードは水平方向に劣化しやすいという特性があります。

この特性を先程の「あ」の画像を使って検証してみます。
このように、縦と横の一方だけを半分にしたものと、両方を半分のサイズにしたものを比べてみます。
こうしてみると、わずかな違いではあるんですが、縦に半分のサイズにしたものを拡大した場合が、他の2つの場合と比べて劣化が少なくなります。
ちなみに、同じことをPVRTC4bppモードで試してみると、
分かるほどの違いは出なくなります。
このようにPVRTC2bppモードの特性として、垂直方向に比べて水平方向に劣化しやすいということがあるので、特に水平方向にダウンサイジングする時には注意する必要があります。