ピクセルアートのアンチエイリアス

概要

ピクセルは正方形なので、完全にまっすぐでもきれいな角度でもない線は階段になります。盾の縁や頭のてっぺんのようななだらかな曲線では、その段が1×ズームでギザギザに見えることがあります。

手作業のアンチエイリアス（AAとも書きます）は、線が跳ぶ角に中間色のピクセルを1〜2個置いて段を和らげます。目がそれを混ぜ合わせ、曲線は実際のピクセルより滑らかに見えます。色は通常、既存のランプから、線とその隣にあるものの間の色を選びます。

手作業の効果です：スプライト全体にかけるフィルターではなく、選んだ数ピクセルです。

役立つとき

• 長くなだらかな曲線。2〜3ピクセルずつ段になる円や斜面が最も恩恵を受けます。
• 大きなスプライト。64px以上なら、ディテールを失わずに中間ピクセルを置く余地があります。
• 内側の線。スプライトのパーツ間の線は既知の色の上にあるので、中間の階調を選びやすく、常に正しくなります。

使わないほうがよいとき

• 小さなスプライト。16pxや24pxでは、どのピクセルも形を担います。そこでの中間ピクセルは、汚れや余計なディテールに見えがちです。
• 背景がわからないときの外縁。アンチエイリアスをかけたシルエットは、1つの背景色に合わせて混ぜられています。別の背景に置くと、柔らかいピクセルがうっすらとした縁取り（ハロー）として見えます。
• ごく限られたパレット。4色や8色では、2つの色の間に入る階調がないこともあります。その場合、段差は硬いまま残りますが、それもルックの一部です。
• 太く、ごつごつしたスタイル。すべての段が見えるほうがよいゲームもあります。それは選択であって、間違いではありません。

よくある間違い

• やりすぎ。すべての段にアンチエイリアスをかけると、フィルタリングをオンにして拡大したように、スプライト全体がぼやけて見えます。
• 長さが合っていない。中間ピクセルの並びは、和らげる段の長さに合わせます。長い段の端に1ピクセルだけでは効果が薄く、短い段の横に長い並びを置くと膨らんで見えます。
• バンディング。中間ピクセルを並べて2本目の平行な線にしてしまうと、縁が二重に見えます。
• エンジンのスムージング。手作りのアンチエイリアスはバイリニアフィルタリングで台無しになります。テクスチャフィルターはニアレストにしてください。

Pixorでのやり方

PixorはL字の角のない1ピクセル幅の線を描き、3段階のアンチエイリアス設定を持っています。0はすべての線をくっきりさせたままにします。1はシルエットだけを和らげます。2は外縁だけでなく、すべての線の角を和らげます。小さなスプライトやごちゃごちゃした背景には0を、曲線に余裕のある大きなスプライトには1か2を試してください。この設定はスタイルグラフのルックの一部で、設定マニュアルにほかの線のオプションと一緒に載っています。

関連

• アウトライン：アンチエイリアスで和らげる線
• セルアウト：すでに縁を和らげている色付きのアウトライン
• スプライトのサイズ：スプライトに中間ピクセルを置く余地がどれだけあるか