AIで生成したピクセルアートを、正方形ドットに変換できるツール「Dot Create」を作ってみた

AI活用

AIでピクセルアート風の画像を生成すると、雰囲気はそれっぽいのに、よく見るとドットが正方形になっていないことがあります。

ピクセルアートっぽく見えるけれど、実際には線がにじんでいたり、1マスごとの形がバラバラだったり、ドット絵として扱うには少し使いづらい。

そこで、画像を正方形のドットとして再構成し、さらにアニメーションとして書き出せるツールを作りました。

それが、今回公開した Dot Create (名前は適当に決めたのであとで変えるかも)です。

Dot Createはこちら

作ったきっかけ

きっかけは、AIで生成したピクセルアート画像でした。

最近は画像生成AIでも、かなり雰囲気のあるドット絵風イラストを作ることができます。

ただ、実際に生成された画像を拡大して見てみると、正方形のドットで描かれているわけではなく、細かい描画やぼかし、アンチエイリアスが入っていることが多いです。

見た目はドット絵でも、厳密には「ドット絵風のイラスト」になってしまう。

そこで、

「AIで作ったピクセルアート風の画像を、ちゃんとした正方形ドットに変換できたら便利なのでは?」

と思ったのが制作の始まりです。

Dot Createでできること

Dot Createは、画像を読み込んでドット化し、正方形のピクセルアート風に変換できるツールです。

AIで作成した画像をそのまま使うのではなく、一度ドット単位に変換することで、よりレトロゲーム風、ピクセルアート風の表現に近づけることができます。

また、変換したドット画像を使って、簡単なドットアニメーションを作ることもできます。

画像をアップロードして、ドットの見え方を調整しながら、ピクセルアート風の表現を試せるようにしています。

AIのみでコーディング

今回のツールは、コーディング部分をAIのみで制作しました。

使用したAIは Codex です。

「こういうツールを作りたい」という目的を伝えながら、機能の実装、調整、修正を進めていきました。

実際に作ってみると、AIだけでもかなり形にすることはできます。

ただし、すべてを一発で完成させられるわけではありません。

こちら側で、

・どういう挙動にしたいのか
・どこが意図と違うのか
・どの部分を調整したいのか
・ユーザーにとって使いやすい流れになっているか

を確認しながら進める必要があります。

つまり、AIに全部任せるというより、AIを開発パートナーのように使いながら作っていく感覚に近いです。

AI生成画像とドット表現の相性

AIで生成した画像は、雰囲気作りがとても得意です。

キャラクター、背景、色味、世界観などを短時間で作ることができます。

一方で、ピクセルアートのように「1マス単位の正確さ」が重要な表現では、まだそのまま使いづらい場面もあります。

特にドット絵は、単に画像が小さいだけではなく、正方形のピクセルが並ぶことで独特の見た目になります。

そのため、AIで作った画像をそのまま使うのではなく、Dot Createのようなツールでドット化することで、より目的に合った素材として使いやすくなります。

現時点での課題

現在のDot Createは、まずは「AIで生成したピクセルアート風画像を、正方形ドットに変換する」という基本機能を優先して制作しています。

そのため、スマートフォンでの操作性や、細かいUIまわりについては、まだ十分に最適化できていない部分があります。

特に、画面サイズによって操作しづらい箇所や、ボタン・設定項目の見せ方などは、今後改善していく予定です。

まずはPC環境での利用を前提にしつつ、今後はスマートフォンでも使いやすいレイアウトへの調整、UIの整理、操作手順のわかりやすさの改善などを進めていきます。

まだまだデバッグもしっかりしてないので挙動がおかしい部分もあると思います。
ここが変だよとかあればコメントに入れてもらえると助かります。

今後やってみたいこと

今後は、さらに使いやすくするために、機能追加や調整もしていきたいと考えています。

現在は基本機能を優先して公開しているため、スマートフォン対応やUIまわりには、まだ改善の余地があります。

スマートフォンでも操作しやすいレイアウトへの調整、ボタンや設定項目の整理、操作手順のわかりやすさの改善などを進めていく予定です。

また、ドットサイズの調整、色数の制限、アニメーションの細かい設定、書き出し形式の追加など、機能面でも改善できそうな部分があります。

AIで作った画像を、Web素材やゲーム風素材、SNS用のアニメーションなどに活用できるように、少しずつアップデートしていけたらと思っています。

まとめ

AIでピクセルアート風の画像を作れるようになったことで、表現の幅はかなり広がりました。

ただ、実際に使おうとすると「ドット絵っぽいけど、正方形ドットではない」という問題も出てきます。

Dot Createは、そうしたAI生成画像を正方形ドットに変換し、さらにアニメーションとして楽しめるようにするために作ったツールです。

現時点では、スマートフォン対応やUIまわりなど、まだ改善が必要な部分もあります。

ただ、まずは基本機能を公開し、実際に使いながら少しずつアップデートしていく予定です。

AIで作ったものを、さらに別のツールで整えて使う。

これからの制作では、こうした組み合わせ方がもっと増えていきそうです。

気になる方は、ぜひ触ってみてください。

Dot Createを使ってみる

コメント

タイトルとURLをコピーしました