AIピクセルアート生成ツール — 説明ひとつで描き、自分の世界を歩き出そう
自分のAIピクセルアート生成ツールを作る
ひとことの文か1枚の画像から、AIでピクセルアートを生成 — ブラウザで無料。そのまま、実際に歩き回れる 3D ピクセルワールドへ持ち込めます。ダウンロードもコードも不要。
AIピクセルアート生成ツールは、書かれたひとことの文 — あるいはすでにある1枚の画像 — を受け取り、ゲームで使えるスプライトシートを返します。Neta Studio では、そのシートはダウンロードで終わりません。インストールもコードもなしで、ブラウザのタブの中で、歩き回れる 3D ワールドの部品になります。
このページでは、文が実際に何を制御するのか、生成がどこで確実に崩れるのか、パイプラインがテキストを再利用できる部品に変える仕組み、そして生成したフレームの帯からシーンの中で動くキャラクターまでの道のりを扱います。手短に言うなら、被写体・視点・グリッド・フレーム数を指定し、輪郭は手作業で直しましょう。
AIピクセルアート生成ツール（ライブ）
入力欄がインターフェースです。ひとことの文で3つのことが決まります。被写体（スライム、騎士、樽、床タイル）、スタイルの手がかり（パレットと時代 — 4色の携帯機、16色の据え置き機、くすんだ砂漠、冷たい地下水道）、そしておおよそのキャンバスサイズ（16×16、32×32、64×64）です。
すべてが決まるわけではありません。フレーム数を指定しない限り、正確なフレーム数が確実に出ることはありません。一定方向のきれいな 1px の輪郭も保証されず、6回の別々の生成で光の向きが同じになることもありません。最初の結果が良いシルエットで輪郭が悪いなら、輪郭のほうが直すのは安上がりです — 2分の描き直しのほうが、あと6回の生成より優れています。
ですから、文を既定値つきの仕様書として扱いましょう。既定のグリッドは 32×32、既定のパレットは16色、既定の出力は1フレームの正面図です。大事なことを指定し、残りは既定値に任せます。横向きの緑のスライム、32×32、6色、4フレームの待機なら使えるものができます。かっこいいスライムではできません。
生成できるもの
4つの出力の系統で、2Dゲームが必要とするもののほとんどがそろいます。それぞれに、結果が使えるかどうかを決めるたった1つの制約があり、それはたいてい、人が心配する制約ではありません。
- キャラクターはっきりしたポーズの語が必要です。被写体だけでは立ち姿の1フレームが返りますが、騎士、横向き、振り下ろしの途中なら、アニメーションの帯に入れられるものが返ります。視点とポーズがないと生成ツールは推測し、正面と横向きを同じくらいの頻度で推測します。
- タイルつながる必要があるので、中央より端のほうが重要です。中央が美しくても右端の列に 1px のつなぎ目がある 32×32 の草タイルは失敗作です。タイルのバリエーションは一度にまとめて生成し、絵を見る前に端のつながりを確認しましょう。
- 小物小さなグリッドではシルエットだけです。16×16 では樽は、暗い帯が1本入った角の丸い長方形です。板の質感を求めると、縮小しても消えないノイズが加わり、汚れに見えます。2、3の明度だけで、細部は不要です。
- アニメーションの帯フレーム数と、つながるループです。帯は、最後のフレームが0番目のフレームへ自然につながって初めて役に立ちます。フレーム数を指定できなければループを確認できず、ループこそが崩れる部分です。
仕組み：ひとことの文から1つの部品へ
パイプラインには3つの段階があり、各段階はあとからでも編集できる形で出力を保ちます。変更できなくなる平坦な PNG で終わるものはありません。
01
解析。文は部品の記録になります。被写体、視点、パレット、グリッドサイズ、フレーム数、ポーズ。省略したものには既定値が入ります — 32×32、16色、1フレーム、正面図。
02
描画。部品は目標のグリッドでラスタライズされます。ピクセルはグリッドにそろい、色はパレットへ減色され、輪郭の処理で、不透明なピクセルと透明が接するシルエットの縁に沿って 1px の暗い陰が置かれます。
03
保存。完成したシートは、名前のついた部品として、グリッド、パレット、フレーム数、再生速度というメタデータを伴って素材ライブラリに入ります。サムネイルがつき、どのシーンのどのアクターからも参照できます。
04
配置。部品をアクターに割り当てると、最近傍フィルタリング、ミップマップ無効、0.5 のアルファテストを備えたスプライト素材が作られます。これが、カメラが動いても 32×32 のスプライトがのっぺり潰れるのを防ぎます。
ライブデモ：生成して、そのまま歩き出す
このデモは動画ではありません。生成ツールはページ内で動作し、その隣のシーンは、Neta Studio の他のすべてを描画しているのと同じ 3D ゲームビルダーです。どちらの半分も同じ素材ライブラリを使うので、生成したものがそのまま歩き回る世界になります。
文から最初の一歩までの道のりは短く、素材一式に本腰を入れる前にどこに継ぎ目があるかを知るため、一度は端から端までやってみる価値があります。
01
入力欄にひとことの文を打ちます。被写体、視点、パレット、グリッドサイズ、フレーム数。視点の語を入れましょう。横向きか斜め見下ろしなら、生成のやり直しを1回節約できます。
02
生成して、最初のフレームではなくフレームの帯を見ます。最初のフレームはたいてい問題なく、崩れるのはループのほうです。
03
結果を素材ライブラリへ送ります。名前とサムネイルがつき、一時的なプレビューではなくなります。
04
シーンパネルに切り替え、アクターを選び、そこへ部品を割り当てます。
05
再生を毎秒8フレームに設定します。それより速いと 32×32 ではちらつきに見え、遅いとスライドショーに見えます。
06
WASD で世界を歩きます。スプライトの大きさが合わなければ、絵を生成し直すのではなく、アクターの1ピクセルあたりのワールド単位の値を変えましょう。
07
小さなテスト用の空間なら Mini World を、同じ部品が世界の規模でもっと働くところを見たいなら The Cyclops' Island を開きましょう。
AIピクセルアニメーション
アニメーションは、ピクセル生成で人が軽く見がちな部分です。4フレームの歩行サイクルは、歩く人を描いた4枚の絵ではありません。コンタクト、ダウン、パッシング、アップの各ポーズから作られるループであり、接地のフレームどうしがそろって初めてループとして読めます。
生成されたサイクルがうまくやること：読めるループ、フレームを通じた一貫したパレット、一定のシルエットの幅、そして指定したとおりのフレーム数です。最初のフレームと最後のフレームはたいていつながり、これは手描きの初挑戦のほとんどができないことです。
たいてい間違えること：接地のポーズです。踏み出した足が、左の接地と右の接地で違う高さに着き、腕が脚と反対側ではなく同じ側で振られ、通過のフレームが中心から半ピクセルずれるのでキャラクターが横に揺れます。これらは1ピクセルの問題で、どれも手作業で直せますが、100パーセントではなく4倍ズームで探さなければなりません。
AIピクセルアート生成ツール：フレームの予算を読む
フレーム数は予算であり、その代償はメモリだけではありません。フレームが1つ増えるごとに、ループが崩れる機会が1つ増え、描き直すフレームも1つ増えます。32×32 のスプライト、1行、RGBA8 でシートが実際に占める量は次のとおりです：
| フレーム数（32×32、1行） | シートサイズ | ピクセル数 | メモリ上の RGBA8 |
|---|---|---|---|
| 4 | 128×32 | 4,096 | 16キロバイト |
| 6 | 192×32 | 6,144 | 24キロバイト |
| 8 | 256×32 | 8,192 | 32キロバイト |
| 12 | 384×32 | 12,288 | 48キロバイト |
| 16 | 512×32 | 16,384 | 64キロバイト |
無料、ダウンロード不要、コード不要
生成ツールとエディターはブラウザのタブで動きます。インストーラーも、ビルドの手順も、素材の取り込み用のパイプラインも、書くべきスクリプトもありません。ページを開き、文を打ち、結果を見る。準備の手間はそれだけです。
同じパイプラインが、キャラクターだけでなくタイルや小物も生成します。グリッドサイズとパレットは3つの場合すべてで同じ設定で、違うのはそのあとに走らせる確認だけです。キャラクターはループの確認、タイルは四辺すべてのつなぎ目の確認、小物は等倍ズームでのシルエットの確認です。
Neta Studio の姉妹となるピクセル関連ページが、このページで扱わない部分を担います。生成された部品の中の個々のピクセルを手で編集すること、そしてすでに持っているフレームをシートに詰め込むことです。フレームはあるが詰め込む道具がないなら、そちらから始めましょう。何もないなら、ここから始めましょう。
画像からピクセルアートへ
テキストは入力経路の1つです。もう1つは画像です。写真や既存のスプライトをアップロードすると、パイプラインはそれを記述するのではなく、スタイルを変えます。構図とシルエットを保ち、パレットとグリッドを選んだとおりに合わせます。
この経路が適するのは、正しいポーズのスプライトがすでにあり、パレットの差し替えや解像度の変更をしたいとき、無地の背景にくっきりしたシルエットの写真があるとき、気に入っているタイルに合わせて新しいタイルが必要なときです。テキストが適するのは、参考がないとき、誰も撮影していないポーズが必要なとき、指定したいのがフレーム数であるときです。
画像入力で失敗する原因は細部です。32×32 に縮小された写真は、シルエット以外のすべてを失うので、目標のグリッドはアップロードの前に決めましょう。柔らかい縁 — 髪、煙、モーションブラー — は半透明のピクセルの縁取りになり、明るい背景の上では灰色の光輪に見えます。アルファをはっきりしきい値で切って、ピクセルを不透明か消えるかのどちらかにし、残りはアルファテストに任せましょう。
AIピクセルアート生成ツール：テキスト入力か画像入力か
どちらの入力も同じ部品の記録に行き着きます。違いは、手間をどこに費やしたいかです。結果を前もって指定するか、すでにあるものを直すかです。
| 入力 | 適する場合 | 注意点 |
|---|---|---|
| テキスト | 名前で指定できる特定のポーズ、視点、フレーム数、パレットが必要なとき | 曖昧な文。フレーム数を省略すると既定で1フレームになる |
| 画像 | 構図がすでにあり、スタイル、パレット、グリッドを変えたいとき | 柔らかい縁、ごちゃついた背景、目標のグリッドでは残らない細部 |
そのスプライトが属する世界を歩く
スプライトは、立つ場所のないキャラクターです。最後の一歩は、他にはないものです。作ったばかりのシートを、誰かが歩き回れる世界 — 小さな島、惑星、雨の街角 — に置きます。このサイトのどの世界も、1つの書かれた説明から作られ、遊べるページとして公開されています。
FAQ
無料ですか？ +
ブラウザでの生成は無料で試せます。インストーラーもビルドの手順もないので、出力が自分のプロジェクトに合うかどうかを確かめる手間は、ひとことの文と数秒だけです。
アカウントは必要ですか？ +
生成して結果を見るだけなら不要です。アカウントは、プロジェクトを1つのブラウザタブではなく自分に結びつけるもので、部品を明日も残しておきたいと思った瞬間から意味を持ちます。
スプライトのサイズは？ +
グリッドは自分で選びます。16×16、32×32、64×64 で、既定は 32×32 です。シートの幅はグリッドの幅にフレーム数を掛けたもので、8フレームの 32×32 のキャラクターなら 256×32 の画像になります。フレームを1行にまとめておけば、寸法が2の累乗かどうかを WebGL2 は気にしません。
結果をアニメーションできますか？ +
できます。文の中でフレーム数とループを指定し、最後のフレームが最初のフレームへ自然につながるか確認しましょう。再生は毎秒8フレームで始まり、6を下回ると 32×32 ではスライドショーに見え、12を超えるとちらつきに見えます。
背景を透明にできますか？ +
できます。シートはアルファチャンネルを持ちます。よくある問題は、背景を消した場所に半透明のピクセルの縁取りが残り、明るい地形の上で光輪に見えることです。アルファをはっきりしきい値で切り、スプライト素材のアルファテストを 0.5 に設定しましょう。
商用ゲームで使えますか？ +
それは技術ではなくライセンスの問題で、答えはピクセルがどう作られたかではなく、そのツールに付された条件によります。その条件を読み、プロジェクトが大事なら、自分で専門家の助言を受けましょう。
結果を編集できますか？ +
できます。部品はグリッド、パレット、フレーム数をメタデータとして保つので、個々のピクセルを描き直したり、パレット全体を差し替えたり、残りを作り直さずに1フレームだけ再生成したりできます。編集はピクセルのグリッド上にとどまるので、再書き出しのときに作り直されるものはありません。
絵描きの代わりになりますか？ +
いいえ。量産と下書きは得意です。仮のセット、タイルのバリエーション、小物の散らかり、パレットの試し描きなどです。苦手なのは意図です — 16×16 で読めるシルエット、一式を通した一貫した光の向き、重みを感じさせるキーフレームの間の取り方。絵描きはこれを、白いキャンバスを飛ばすために使い、作業そのものを飛ばすためには使いません。
3D ゲームビルダーに戻る
完成した31の 3D ワールド、ゲーム、シーンが1つのページにそろっています — そのすべてがプレイ可能です。