ピクセルアートのサイズを徹底解説：16×16、32×32、64×64、128×128（無料ガイド）

16×16 のピクセルアートは 256 セルのグリッドです。16 列、16 行、1 セルにつき 1 色。この数字が設計の指針です。置くすべての点は、固定された予算からの引き算であり、その予算は何かを描く前に決まっています。

サイズは、1 ピクセルを描く前にディテールを決めます。16×16 のグリッドに読める顔は収まりません。64×64 のグリッドに群衆は収まりません。このガイドでは、ゲーム、アイコン、壁紙の仕事の大半を占める 4 つのサイズ — 16×16、32×32、64×64、128×128 — を取り上げ、それぞれのセル数、主な用途、破綻のしかた、色の予算を解説します。さらに、人が「ピクセルアートのグリッド」と言うとき通常指す 2 つの系統、つまり単位がピクセルではなくブロックであるマインクラフトのブロック建築と、単位がセルである表計算ソフトについても扱います。

早わかり：サイズ＝ディテールの予算

グリッドサイズは、得られる異なる点の数の上限です。16×16 なら 256 セル。32×32 なら 1,024。64×64 なら 4,096。128×128 なら 16,384。それが予算のすべてで、シルエットを置いた時点で使い切っています。

その結果、ディテールは最後に付け足すものではなく、グリッドが最初から許すものです。目は 16×16 では 2〜6 セルを消費します。同じ目でも 64×64 なら、まぶたの線、虹彩、瞳孔、1 つの鏡面ハイライトに 20〜40 セルを割けます。同じ要素でコストが違うのは、グリッドが分母を変えたからです。

塗りつぶしは他のすべてと競合します。16×16 でキャラクターの体はベタ塗りに 60〜120 セルを食います。残るのはおおよそ 130 セルで、そこに輪郭、顔、手、持っている物、内部の陰影を入れます。3 つの独立した内部形状はそこで生き残れません。接していれば 2 つなら可能です。

16×16：キャラクターとアイテム

256 セルの 16×16 ピクセルアートは、記号ではなくキャラクターとして読める最小のサイズです。制約はシルエットです。外側の輪郭がそれだけで判別できなければ、グリッドの内側で何をしても直りません。その形が何なのかを説明する内部の余地がないからです。

作業手順は、まず全体を 1 つのベタ色で描き、それから輪郭を読み取ることです。胸当てと腕が 1 つの塊に溶けているなら、間違っているのはポーズであり、パレットではありません。変更が全面描き直しではなく 8 セルで済むベタ塗りの段階で直します。

16×16 はタイルとも自然に組み合わせられます。タイルセットは繰り返されるので、目は個々のセルを吟味するのをやめ、模様とリズムを読むようになります。これが、これほど小さなグリッドが妥協でなくなる唯一の状況です。

1 グリッドにつき 1 つのオブジェクト、1 つのポーズ、1 つのアイデア。剣、ポーション、コイン、樽、スライム、道しるべ、壁タイル、インベントリの枠。強いはっきりした輪郭と 1 つのアクセントカラーをもつ平たいアイテムが最適です。盾がうまくいくのは、形が 1 つの丸みのある板だからです。ベルト、中心の飾り、縁を 3 つの独立した内部形状として加えた瞬間に、読めなくなります。

顔と文字です。目と口で、陰影を入れる前に 2〜4 セル。そのサイズでは口は表情ではなく、はみ出した 1 ピクセルとして読まれます。接していない 2 つの内部形状をもつもの — ガラスの線と液体の線をもつポーション — は塊に潰れます。高さ 5 セル未満の文字は読めません。グリッドに文字を描くのではなく、別の UI フォントを使いましょう。

32×32：ゲームのスプライト

32×32 は 1,024 セルで、多くの 2D ゲームのスプライトがこのサイズで描かれます。ポートレートを要求せずに読めるポーズが収まるからです。頭と胴を分け、手に武器を持たせ、どちらの脚が前かを示し、それでも体に 2 階調の影を残すセルが余ります。

これに合う色数は、輪郭を含めて合計 12〜16 色です。実用的な配分は、輪郭 1 色、それぞれ 3 段（ベース、影、ハイライト）のランプを 3〜4 本、アクセントを 1〜2 色、そして透明です。2 階調の影とは、体の色が少なくとも 2 回 — 明るい側と陰った側 — 現れることを意味します。パレットのすべての色がちょうど 1 回ずつしか現れないなら、描いたのは形ではなくノイズです。

よくある間違い：32×32 のスプライトがおかしいとき、ほとんどの人は色を足します。それでは何も直りません。原因はほぼ必ずシルエット、つまり胴から分かれていない手足か、肩と同じ幅の頭だからです。輪郭を黒のベタで描き直して見てみましょう。その黒い形が判別できなければ、どんなパレットも救えません。

64×64：アイコンとポートレート

64×64 は 4,096 セルで、この一覧で初めて顔が記号ではなく顔になるサイズです。目に 8〜20 セルを割けます。白目、虹彩、瞳孔、まぶたの線、1 つの鏡面ハイライト。このハイライトがあるから 64×64 のポートレートは成立し、32×32 では成立しません。32×32 ではそれを割くセルがないからです。

このサイズで変わるのは、描画のどの部分が読みを担うかです。16×16 では輪郭が担います。64×64 では陰影が担います。ここでは形を描くので、ランプが必要です。素材ごとに 3〜5 段で、各素材は自分のランプにとどまります。同じランプに照らされた肌と鋼は、鋼のランプが肌のランプより高いコントラストをもつときだけ一貫して見えます。金属が金属に見えるのは、色相ではなく明度の飛びのおかげです。

破綻するのは群衆です。64×64 は 1 つの被写体用です。2 体がグリッドを分け合うとそれぞれ約 2,000 セルになり、構図がもっと悪い 32×32 の問題に逆戻りします。64×64 は単一の被写体にとどめ、余ったセルは意図的に低いコントラストの背景に使いましょう。そうすれば被写体は色ではなく明度で分かれます。

128×128：壁紙とシーン

128×128 は 16,384 セルです。このサイズでは、1 つのスプライトは被写体であることをやめ、構図の中の 1 つのオブジェクトになります。キャンバスの 3 分の 1 を占めるキャラクターはおよそ 42×128 — 約 5,300 セル — で、グリッドの残りはすべて環境です。地面、空、建築、小物。

直感に反するのは、大きなグリッドほどオブジェクトごとの色数が多くではなく少なくて済むことです。16×16 では、12 色すべてが構造的な役割を果たすので、1 体のキャラクターに 12 色を使うかもしれません。128×128 で 6 つのオブジェクトがそれぞれ 12 色だと 72 色が競合し、目はどれが前景か分からなくなります。このサイズのシーン制作では通常、各オブジェクトを 4〜6 色のランプに保ち、オブジェクトを色相ではなく明度の帯 — 暗い前景、中間の地面、明るい空 — で分けます。

ここでは機械的な設定が小さなサイズのときより重要です。1× で描き、2× か 3× にズームします。滑らかなズームは決して使いません。壁紙として書き出すときは、整数倍 — 2×、3×、4× — でのみ拡大します。2.5× の拡大は幅の不均一なピクセルを生み、グリッドが意図的に見えなくなります。

サイズごとの色数

人を驚かせる原則：グリッドが大きくなるほど、要素あたりのパレットはたいてい小さくなります。小さなグリッドは再利用を強制します。1 つの色が輪郭、影、髪を兼ねる。そしてその再利用こそが 16×16 のアートを一貫して見せるものです。大きなグリッドは、すべての面に固有の色を使いたくさせ、その結果は解像度を落とした写真のように見えます。

重要な数字はパレット全体の大きさではなく、要素ごとの色数です。4 つの要素に 16 色を使う 32×32 のスプライトは一貫しています。合計 24 色の 128×128 のシーンも、その色を明度 — 暗、中間、明 — で割り当て、オブジェクト間で再利用すれば豊かに見えます。

機械的な理由は、ピクセルアートは隣接するコントラストで読まれるからです。明度が異なる隣り合う 2 つのセルは輪郭を作ります。色相が異なっても明度が同じ隣り合う 2 つのセルは、濁った塊を作ります。明度のコントラストを加えずに色を足すのは、パレットの枠を 1 つ消費して、読める形を何も得られません。だから「平らに見える」は通常、色相の問題ではなく明度の問題なのです。

マインクラフトのピクセルアートとグリッド

マインクラフトのピクセルアートはピクセルではなくブロックで測ります。1 ブロックが画像の 1 セルです。16×16 のスプライトは 16×16 のブロックの壁になり、256 ブロックで、一晩で仕上げられる建築です。同じスプライトを 64×64 にすると 4,096 ブロックで、別の種類の覚悟が要る別の種類のプロジェクトになります。

対応関係が重要なのは、ブロックはピクセルではないからです。ピクセルは自分で選ぶベタ色です。ブロックは、テクスチャと光が焼き込まれたベタ色です。同じ名目の色でも羊毛とコンクリートは遠くからでは同じようには見えず、ごちゃごちゃしたブロックのテクスチャはピクセルには決してないノイズを加えます。だから写真は線画より多くのブロック数を必要とします。写真はグラデーションを含み、グラデーションはセルを消費するからです。32×32 では顔はブロックだと泥になりますが、64×64 か 128×128 なら形はテクスチャのノイズに耐えます。

建築グリッドとアートグリッドの違いは別の区別です。アートグリッドは定義上平らで、1 セル、1 色、奥行きなしです。建築グリッドは立体で、ブロックを好きな高さに置け、グリッドは平らな面を見たときにだけ現れます。そこから、ラスターエディターが決して問わない判断が生まれます。画像の後ろに何を置くかです。低彩度のブロックの背後の壁は被写体を引き立て、画像を浮かせたままにして隙間から地形が見えると、損傷のように見えます。

表計算ソフトと Google スプレッドシートのピクセルアート

表計算ソフトでは、1 セルが 1 ピクセルです。グリッドはシートが許す範囲であり、あなたがスクロールすることを厭わない範囲です。32×32 の画像は 1,024 セル。64×64 の画像は 4,096。128×128 の画像は 16,384 セルで、表示はできますが手入力は退屈です。

条件付き書式がパレットです。セルの値に基づいて色を付けるルールを書き、各セルに文字か数字を入力して色を選びます。もう 1 つの方法は手作業の塗りつぶしで、設定は簡単ですが、1 つのルールを編集して作品全体の色を変える方法がなくなります。アートを修正するつもりならルールを使いましょう。一度きりなら塗りつぶしのほうが速いです。

表計算ソフトという道が本当に適した道具になるのは 2 つの場合です。共同作業：シートはもともと共有でき、複数人が同時に編集でき、変更履歴もあります。PNG をやり取りするより優れています。データ駆動のグリッド：セルの色を数式から計算できるので、作品が数値に反応できます。これはどのラスターエディターにもできないことです。アニメーションには不向きな道具です。シートにはフレームもオニオンスキンもタイムラインもありません。シートでアニメーションするとは、グリッドを複製して範囲を入れ替えることで、2 フレームほどでどの専用エディターより遅くなります。

サイズ別の無料ツール

機能一覧ではなく、すでに手元にあるもので選びましょう。写真があり、出発点となるシルエットが必要なら変換ツールを使います。白紙のページと決まったサイズがあるならメーカーを使います。何を描けばいいか分からないなら生成ツールを使います。どれも、後で別の場所で編集し続けられるグリッドを生み出します。

各ツールには専用のページがあります。このセクションは道案内にすぎません。

16×16 の世界を 3D で見る

16×16 のタイルは 256 セルで、3D の世界ではテクスチャになります。このサイズのテクスチャがくっきり見えるのは、正しくフィルタリングしたときだけです。Three.js の用語で言えば、テクスチャの magFilter と minFilter を NearestFilter に設定し、近くでくっきり見せたいオブジェクトではミップマップをオフにします。遠くの地形ではミップマップをオンにしておかないと、カメラが動くたびに地面のグリッドがちらつきます。これが小さなサイズ側でのトレードオフです — 最近傍フィルタリングは 2 メートルではピクセルを読みやすく保ちますが、50 メートルではエイリアスが出ます。

『サイクロプスの島』はほぼすべてが小さなグリッドのタイルで動いています。木、岩、海岸線、小物とアイテムはそれぞれ 16×16 か 32×32 で描かれ、シーン全体で再利用されます。Mini World も同じ手法を、オブジェクトごとの設置面積をより小さくして使っています。スプライトは Agent Sprite Forge から出力され、アトラスにまとめられ、3D ゲームビルダーによってオブジェクトとして配置されます。ここで書かれた説明が遊べるレイアウトに変わります。

見返りは見た目ではなく算数です。16×16 では特定の顔を描く能力を失い、繰り返す余裕のあるタイルを得ます。256 セル × 数十枚のタイルは 1 つの場所になります。16,384 セル × 数十枚は誰も仕上げないプロジェクトです。下のシーンを見るときは、空ではなく地面と小物を見てください。グリッドが見えるのは地面です。

それが属する世界へ、歩いて入ろう

スプライトは、立つ場所のないキャラクターです。最後のステップは他にはないものです。作ったばかりのシートを、誰かが歩き回れる世界 — 小さな島、惑星、雨の街角 — に置くのです。このサイトのすべての世界は、1 つの書かれた記述から作られ、遊べるページとして公開されています。

FAQ