AIなしのドット絵拡大 · 整数倍ニアレスト1×〜8×
ストアページ・トレーラー・SNS用のドット絵は、ぼかさずに拡大する必要があります。整数倍のニアレスト拡大は各ピクセルを正確なN×Nのブロックにし、保存前に出力サイズを表示します。
ドット絵をぼかさずに拡大するには、ニアレストネイバーで整数倍にします。4倍なら32 × 32のスプライトは128 × 128になり、すべてのピクセルが正確な4 × 4のブロックになります。4.25倍のような小数倍は一部のピクセルを太くし、なめらかな拡大やAIアップスケーラーはぼけや作られたディテールを加えます。Nerulioのピクセルラボはフレームを1×〜8×のニアレストで拡大し、先に画像がすでに拡大済みかを調べるので、拡大されたコピーではなく1倍の元画像を拡大できます。
- PNG frames測定確認· Pillow
- Palette測定確認· re-import
- pixel-lab.json未検証
整数倍はグリッドを守り、それ以外はグリッドをゆがめる
ニアレストネイバーは元のピクセルをブロックに写すだけで、新しい値を計算しません。整数k倍ならすべてのブロックがk × kなので、1ピクセルの線は1ブロックの太さのまま、斜め線は規則的な階段のまま、色はパレットのままです。
4.25倍では32ピクセルの1行が136ピクセルになりますが、136を32個の等しいブロックに分けることはできません。ニアレストだと幅が5、4、4、4、5、4、4、4…となり、4つに1つのピクセルが25 %太くなって、きれいな斜め線が不揃いな階段になります。バイリニアやバイキュービックは隣を混ぜて不揃いを隠しますが、それこそ避けたかったぼけです。
目標サイズが絵の倍数でないとき — 400 × 225の絵から1920 × 1080のトレーラーを作ると4.8倍 — は最大の整数倍（4倍 → 1600 × 900）で拡大し、残りは余白や枠で埋めます。入力も先に確認しましょう。3倍のスクリーンショットをさらに4倍すると12倍になり、元からあった不揃いも一緒に大きくなります。チェッカーは画像が正確な整数倍の拡大なら1倍の元画像を復元します。
- ニアレストネイバー
- 出力の各ピクセルが最も近い元のピクセルをコピー。混ぜない。
- 整数倍
- 2×、3×、4×…：すべてのドットが同じ正方形のブロックになる。
- 論理サイズ
- 絵の1倍のサイズ。128 × 128で表示するスプライトなら32 × 32。
例：サイズとブロックの幅
32 × 32のスプライトと400 × 225の場面：
32 × 32 ×2 → 64 × 64 全ピクセル2 × 2
32 × 32 ×4 → 128 × 128 全ピクセル4 × 4
32 × 32 ×8 → 256 × 256 全ピクセル8 × 8
32 × 32 ×4.25 → 136 幅5,4,4,4,5,4,4,4 …（不揃い）
1920 × 1080のトレーラー用に400 × 225：1920/400 = 4.8、1080/225 = 4.8
最大の整数倍4 → 1600 × 900、左右160px・上下90pxの余白5、4、4、4のパターンはニアレストのサンプリングから生まれます。出力のピクセルxは元のピクセル⌊x ÷ 4.25⌋を表示するので、元の0番はx = 0〜4（5ピクセル）、1番はx = 5〜8（4ピクセル）を占めます。
できること
- ニアレストネイバーだけの1×〜8×整数倍。フィルターも生成されたディテールもなし。
- チェッカーがすでに拡大済みか（正確な倍率とオフセット）を検出し、拡大した画像をさらに拡大するのを防ぎます。
- 正確なグリッドがあれば、まず1倍を復元してから拡大してください。
- アニメーションはフレームごとに処理し、PNGで書き出し。
使い方
- 画像かフレームをドロップ。
- 倍率レポートを読み、拡大済みなら1倍を復元。
- 整数倍率を選ぶ。
- PNGで書き出し。
結果の確認
- 出力サイズが入力サイズ × 倍率とぴったり同じです（32 × 4 = 128）。
- 結果をチェッカーに通すと、オフセット0, 0の正確な整数倍率と出るはずです。
- 表示される場所（ストアページ、動画編集ソフト）で100 %で見ます。そこで縁がぼけていれば、プラットフォームがサイズを変え直しています。
トラブルシューティング
| 症状 | 考えられる原因 | 確認方法 | 対処 |
|---|---|---|---|
| 拡大したPNGがWebページでぼやける | ページが別のサイズで表示し、ブラウザがなめらかに補間している | CSSのサイズとファイルのサイズを比べる | 元のサイズで表示するか、CSSでimage-rendering: pixelatedを指定（MDNによれば、最も近い整数倍まではニアレスト、残りはなめらかに） |
| トレーラーやストアページでドットが不揃い | 編集ソフトやストアが倍数でないサイズ（4.8倍）に変えた | ファイルのサイズと出力解像度を比べる | 収まる最大の整数倍で拡大し、引き伸ばさずに余白を付ける |
| 結果が予想よりずっと大きくカクカク | 入力がすでに拡大済みだった（3倍のあと4倍 = 12倍） | チェッカーが入力に正確な整数倍率を報告する | 先に1倍に戻してから拡大 |
| アップロード後に輪郭のまわりに色のノイズ | プラットフォームがJPEGで再エンコードした | アップロードされたコピーの縁を拡大 | PNGのまま扱う場所ならPNGでアップロード |
ほかの方法
| 方法 | こんなときに向いています |
|---|---|
| パック＆書き出しの拡大バリエーション（スプライトシートメーカー） | 1倍と一緒に@2x・@4xのエンジン用アトラスが必要なとき。このバリエーションはニアレストのみです。 |
| Aseprite：File › Export › Export AsのResize欄 | すでにAsepriteで作業しているとき。Asepriteのドキュメントはアニメーションの投稿に400 %のような倍率を勧めています。 |
| エンジンに1倍の絵を拡大させる | ゲーム内では1倍のテクスチャのまま、画面を整数倍で拡大します（Godot、Unity）。事前に拡大したテクスチャはメモリを使うだけです。 |
出力ファイルと検証方法
「測定確認」は、ダウンロードしたファイルをページ外（Pillow・numpy・独立したパーサー）で開き直して性質を測ったという意味です。ゲームエンジンでの読み込みは試していません。
| 書き出し先 | ファイル | 検証 |
|---|---|---|
| PNG frames | anim_N.png · 1×–8× nearest | 測定確認 Pillow書き出したPNGを読み直し、すべての色が固定パレット内にあることを確認。 |
| Palette | .gpl · .hex (Lospec) · .json | 測定確認 re-import各形式を書き出してUIで読み戻し、16 → 16色を確認。 |
| pixel-lab.json | generic frames + palette | 未検証汎用JSONで、どのエンジンでも読み込んでいません。 |
検証の根拠
アンチエイリアスのかかった8フレーム → 16色パレット1つ、パレット外の色0。ディザーなしとBayer 4×4の両方で変化のない領域が全8フレームで同一。アンチエイリアス除去で271色 → 16色、シルエットの移動0ピクセル。整数倍率・オフセット・2.5倍の非整数倍率を正確に検出。
制限
- 1×〜8×の整数倍だけで、小数倍やなめらかな方式はありません。
- シートは1枚の絵として拡大されます。フレーム間の2pxの余白は4倍で8pxになります。
- ディテールは足しません。ドット絵には正しい動作ですが、写真のアップスケーラーを求めているなら向きません。
- 4096 × 4096より大きいフレームは受け付けません。すべての処理がメインスレッドで動き、まだキャンセルボタンがありません。
- スプライトシートは1枚の画像として扱います。先にフレームに分割してください（スプライトシート分割）。
- ディザーを有効にすると、クリーンアップの件数にディザーのピクセルが含まれます。先にディザーを「なし」にしてください。
- 書き出すJSONは汎用形式で、Godot・Unityへの読み込みは試していません。
バージョンと出典
Chromiumでのピクセルラボのテストより：1×・2×・3×・4×・8×のニアレスト拡大をオフセット0, 0で正確に検出し、2.5倍ニアレストは2.500倍と読み、3倍のスプライトを16 × 16でピクセル単位まで同じに復元しました。CSSの動作はMDNの説明に、Asepriteの書き出しダイアログは公式ドキュメントに従っています。
参照した公式ドキュメント
よくある質問
なぜ整数倍だけ？
非整数倍は一部のピクセルを太くします。チェッカーはそれも測り、2.5倍ニアレスト拡大は2.500倍と判定して整数とは言いません。
AIアップスケーラーのようにディテールを足しますか？
いいえ。出力のすべてのピクセルは元のピクセルのコピーです。
無料ですか？アカウントは必要ですか？
このページの機能はすべて無料で、アカウントなしで使えます。透かしや制限された書き出しはありません。
スプライトはアップロードされますか？
いいえ。Studioはこのブラウザのタブ内でデコード・パック・書き出しを行います。プロジェクトはブラウザ（IndexedDB）に自動保存され、.nerulioファイルとして保存できます。
Asepriteやエンジンのプラグインは必要ですか？
いいえ。.asepriteファイルはブラウザで読み書きします。エンジン別のバンドルには必要なものが入っています（Godotはインポート設定とシーン、UnityとGodotのタイルセットは小さなエディタースクリプト）。