AIの「ドット絵っぽい画像」を、使えるドット絵へ整える無料ツールを作りました
AIでドット絵を作ると、一見きれいでも拡大した時に気になることがあります。
・場所によってドットの幅が違う
・輪郭だけ細かくガタつく
・同じ色に見える場所へ近い色が大量に混ざる
・小さい画像へ縮めると、線や顔が崩れる
見た目はドット絵でも、実際には一定のマス目で描かれていないことが多いからです。
そこで、画像の格子と色を整理し、PNGとして保存できるWebツールを作りました。
ピクセルアートコンバーター
https://holometer.net/pixel-maker/
無料・登録不要です。画像はサーバーへ送信せず、ブラウザ内だけで処理します。
まずは画像を選ぶだけ
基本操作は3段階です。
写真、イラスト、AI生成画像を選ぶ
仕上がりを選ぶ
変換後を確認してPNGで保存する
最初は「ピクセルアート」のままで構いません。画像を読み込むと、ドットの大きさと色を自動で調整します。
AI生成の疑似ドット絵で格子が崩れている場合は「AIピクセルアートを補正」、近い色の浮いた点や色ムラまでまとめたい場合は「手打ちドット風」を試せます。
変換後と元画像を、その場で比較
プレビュー上の「変換後／元画像」を押すと、同じ位置のまま表示を切り替えられます。ドットを粗くしすぎていないか、輪郭や顔の情報が残っているかを確認してから保存できます。
設定を変えている間もプレビューが見えるよう、スマートフォンでは変換後の画像を画面上部へ固定しました。長い設定画面を行き来せず、変化を見ながら調整できます。
256pxの背景素材を作る
出力サイズはドット数で選べます。今回はAI生成の背景画像を整理し、横256pxの素材へ変換しました。完成画像は256×170px・18色です。
保存時には2倍・3倍などの整数倍も選べます。ニアレストネイバーで拡大するため、ドットの輪郭をぼかさず大きなPNGとして保存できます。
画像に合わせて仕上がりを選べる
「ピクセルアート」は写真やイラストを分かりやすいドット絵へ変換する初期設定です。
「AIピクセルアートを補正」は、AIが作ったドット絵風画像の不揃いな格子を検出し、一定のマス目へ揃えます。
「手打ちドット風」は、近い色の浮いた点や色ムラを抑え、パレットを整理した見た目へ寄せます。
「写真の色」は、元画像の階調や色を多めに残しながらドットへ変換します。
自動判定が合わない画像もあるため、ドットの大きさや色数は後から手動で調整できます。格子候補が見つかった場合は、別候補も試せます。
最後は1ドットずつ直せる
自動変換だけで完全に仕上がらない時は「ドットを手直し」から修正できます。欠けた輪郭を塗る、不要な1ドットを消す、スポイトで既存色を拾う、元に戻す・やり直す、といった操作に対応しています。
AI変換で大枠を作り、人の目で気になる場所だけ直す使い方を想定しています。
背景透過とパレット保存
背景は元の透明部分を維持できるほか、外周からつながった背景を自動で透明にする機能もあります。
使った色はGPLまたはPNGのパレットとして書き出せます。AsepriteやPixeloramaへ持っていき、続きを描く時にも使えます。
複数画像も同じ設定で処理
連番画像やゲーム素材はZIPでまとめて読み込めます。先頭画像で仕上がりを確認した後、同じ設定でPNG一式を書き出せます。複数画像を1枚へ並べたスプライトシートの保存にも対応しています。
Color Cleanerとどう使い分けるか
Holometerには、画像の大きさや形を変えず、近い色だけを整理するColor Cleanerもあります。
https://holometer.net/color-cleaner/
・ドット絵へ変換したい → Pixel Maker
・元の見た目を保って色だけ減らしたい → Color Cleaner
・AI画像の色ノイズを減らしてからドット化したい → Color Cleanerの後にPixel Maker
今回の256px背景は、最初にColor Cleanerで46,817色を343色へ整理し、そのPNGをPixel Makerで18色の背景素材へ変換しました。
うまくいかない時のコツ
すべての画像を一発で完璧なドット絵にできるわけではありません。元画像の線、ぼかし、圧縮ノイズによって向く設定は変わります。
・細かすぎる → ドットを大きくする
・輪郭が崩れる → AIピクセルアートを補正、または別の格子候補を試す
・色が多い → 手打ちドット風、または先にColor Cleanerを使う
・色が薄くなる → 色数を増やす、鮮やかさ補正を切り替える
・背景だけ消したい → 自動で透過を試す
自動変換を完成品と考えず、「手直ししやすい土台を短時間で作る」ために使うと扱いやすいです。
最後に
AI画像のドット絵化は、単純に画像を小さくして拡大するだけでは整いません。
格子、代表色、輪郭、背景を整理し、最後に必要な1ドットだけ直せるところまでを、ブラウザだけで完結できるようにしました。
写真やイラストをドット絵にしたい時、AI生成の疑似ドット絵をゲーム素材へ整えたい時に試してみてください。
https://holometer.net/pixel-maker/
#ドット絵 #ピクセルアート #AI画像 #ゲーム制作 #画像編集 #Webツール #個人開発
