Piskelの代替案：無料のブラウザピクセルエディタ、3D世界も作れる

Piskelの代替案を検索したなら、おそらく二つの壁のどちらかにぶつかっているはずです。ひとつは、クリックで打ち出すより速くスプライトのフレームを作りたいというもの。もうひとつは、ピクセルを平板なPNG以外のどこかに行かせたいというものです。Piskelは無料で、ブラウザのタブで動き、今も書き出せます。壊れてはいません。ただ、キャンバスの端で止まってしまうのです。このページは、その端の先に何があるかを扱います。

Neta Studioは、生成の工程を備えたブラウザピクセルエディタと、その背後にある3Dゲームビルダーを動かしています。32x32のスプライトを手で描き、Agent Sprite Forgeで書いた説明から生成し、スプライトシートを書き出し、そして同じピクセルで作られた場面の中を歩き回れます。インストール不要、アカウント不要。以下は率直な比較で、Piskelのほうが今も優れたツールである点も含めています。

手短な答え：無料のPiskel代替案はあるのか？

あります。そして正直に言えば、Piskelが問題だったことは一度もありません。Piskelは無料で、ブラウザで動き、今もアニメーションGIFとPNGスプライトシートを書き出せます。Piskelの代替案に乗り換える価値があるのは、Piskelがやらない二つのことのどちらかが必要な場合だけです。クリックではなく書いた説明からスプライトのフレームを生成すること、あるいはそのピクセルを、カメラを動かせる3Dの場面へ持ち込むこと。どちらもあなたのボトルネックでないなら、Piskelは今も良い描画ツールであり、離れる理由はありません。

Piskelが得意なこと

Piskelは地味なやり方で評判を勝ち取っています。中核のループをうまくやっているのです。新しいスプライトは32x32で、切り替えられるグリッド上に開き、道具立てはまさに必要な一式です。ペン、左右対称ペン、塗りつぶし、直線、矩形、楕円、そして邪魔をしないカラーピッカー。エディタはページ内で動くので、一筆がサーバーとの往復を待つことはありません。インストールもアカウントもなく、料金プランによって挙動が変わる版もありません。

フレームとレイヤーは別々の軸で、これは聞こえ以上に重要です。4フレームの歩行サイクルを別の輪郭レイヤーで作れば、輪郭を4回ではなく1回描き直すだけで済みます。プレビューパネルは設定したFPSでアニメーションを再生し、オニオンスキンを一度切り替えれば隣り合うフレームが薄く重なって見え、確定する前に間隔を判断できます。書き出しはエンジンが実際に受け取る形式を網羅します。アニメーションGIF、PNGスプライトシート、そして.piskelプロジェクトファイル。読み込みも同じくらい直接で、.piskelファイルをエディタにドラッグするか、PNGスプライトシートを持ち込んで指定したグリッドで切り分けさせます。

最初のスプライトまでの壁は本当に低いです。空のタブから、読める16x16のキャラクターまで数分で行けます。失敗の仕方も小さいものです。1倍ズームで濁るパレット、震える輪郭、レベル背景に溶けて消えるハイライト色。

二つの設計上の決断が値打ちの大半を担っています。グリッドは整数倍のズームに吸着するので、ピクセルは常に画面ピクセルの正方形の塊になり、3.5ピクセルの滲みには決してなりません。そして書き出しの形式は少なく曖昧さがなく、つまりアニメーションを見る前にパイプラインを設定させられることはありません。

Piskelが止まる場所

Piskelには生成の工程がありません。シートのすべてのピクセルは、あなたがしたクリックか、置いた塗りつぶし、直線、楕円です。それは描画ツールの欠陥ではなく、描画ツールとはそういうものです。ただ、それでは量に下限ができてしまいます。4フレーム全体でおよそ20パーセントを覆う32x32のスプライトは、約3,000回の不透明ピクセルの判断にあたり、デザインが変わるたびにそれをやり直すことになります。ボトルネックが絵の制御ではなく絵の生産量なら、Piskelは助けになりません。あなたの文章とキャンバスの間のパイプラインに、何もないからです。

Piskelには3Dの出力がありません。その書き出しは2DのラスターとJSONプロジェクトファイルです。このツールのどこも、カメラ、地面、衝突体積、光を知りません。それらのピクセルを3Dの場面に入れるのは、完全に後工程の仕事です。シートを書き出し、エンジンに読み込み、マテリアルを組み、フィルタモードを正しく設定し、そしてその周りに世界を手で組み上げます。その仕事は本物で、多くの場合仕事の大半を占めますが、Piskelはそのどれにも立ち会いません。

そしてこのアプリは、事実上何年も静止したままです。ウェブエディタは今も動き、書き出したものは現在のエンジンでも開け、.piskel形式は動いていません。それは安定であって、破綻ではありません。ただし新機能もまた、やって来ません。Piskelが今日やらないことが必要なら、更新を待つのは計画にはなりません。

この区別は、二年がかりのプロジェクトのために道具を選ぶときに効いてきます。ファイル形式が固まった完成済みのツールは、予測可能です。同じく完成済みのツールは、要件がまだ動いているなら間違った選択でもあります。ゲームの始まりでは、たいていそうなっています。

代替案の比較

表は機能の数ではなく、ボトルネックで読んでください。絵がうまく、必要なのがフレーム、GIF、スプライトシートだけなら、PiskelかLibreSpriteで足り、どちらもお金を求めません。描くより速くフレームを生み出す必要があるなら、生成の列が必要ですが、Piskelにはそれがありません。シートがカメラ付きの場面に行き着かねばならないなら、3Dの列が必要で、PiskelにもLibreSpriteにもそれがありません。

LibreSpriteはここに挙げたインストール型の選択肢です。本物のタイムライン、オニオンスキン、レイヤー、スプライトシート書き出しを備えたデスクトップアプリケーションです。デスクトップにはブラウザのタブにない利点があります。ネイティブのファイルダイアログ、大きなキャンバスでも見通しのよいメモリの余裕、作業の途中でタブが回収される心配のなさなどです。欠けているのは同じ二点です。生成の工程がなく、3Dの出力もありません。

アニメーションの列について一つ注意があります。それはエディタを説明するもので、あなたのエンジンではありません。ここにあるどのツールもラスターのシートを書き出し、あなたのエンジンがそれを正しい速度で再生するかどうかは、フレームの大きさ、余白、そして書き出し時に設定したFPS次第です。

いちばん多くの時間を食っている一つの工程を書き出してください。それが描くことなら、描画ツールにとどまりましょう。良い一つを見つけるのに十分な数のバリエーションを作ることがそれなら、生成の工程を取ります。ピクセルを場面に配線することがそれなら、ビルダーを選び、エンジンへの読み込みは丸ごと省きます。

私たちがどう違うか：ピクセル、そして歩いて入れる世界

二つの半分は一つのパイプラインで、その理由は地味です。あなたが書き出すシートは、ビルダーが受け取るシートそのものです。32x32で選んだフレームの大きさは、マテリアルが期待するフレームの大きさです。再サンプリングもなく、グリッドを推測することもなく、真夜中にエンジンのインポーターでシートを切り直すこともありません。その連続性が主張のすべてです。

二つの設定を飛ばすと結果が台無しになります。ひとつめはテクスチャフィルタリングです。Three.jsでは、マテリアルのテクスチャは拡大と縮小の両方で最近傍サンプリングにし、ミップマップを切る必要があります。さもないと32x32のピクセルが遠くでどろりと滲み、カメラが動くとちらつきます。ふたつめは倍率です。スプライトは整数倍で拡大縮小してください。3.5倍に拡大したスプライトは、幅が3画面ピクセルと4画面ピクセルを交互に取るピクセルを持ち、どんなパレットの失敗よりも悪いノイズに見えます。

The Cyclops' IslandとMini Worldは、この道筋の参照作です。生成されたピクセルキャラクター、地面、カメラ、衝突、そのすべてがブラウザのタブで動きます。プロジェクトをそれに賭ける前に、書き出しが実際に何になるのかを、開いて確かめてください。

2Dの半分だけが必要なら、ここにあるものはあなたがすでに知っているツールに勝てません。乗り換える価値があるのは、時間が消えていくのが3Dの半分のほうである場合です。そのとき書き出しの経路は受け渡しではなくなり、同じ作業空間の一部になります。

無料ですか？

ピクセルエディタは無料です。Agent Sprite Forgeでスプライトのフレームを生成するのも無料です。書き出しも無料です。スプライトを描くことと、PNGスプライトシートやアニメーションGIFをダウンロードすることの間に何も挟まらず、透かしが現れたり解像度の上限が発動したりする課金の段階もありません。

エディタを開き、フレームを生成し、編集し、書き出すのにアカウントは要りません。ダウンロードのためにメールアドレスを渡す必要もありません。そもそもダウンロードするものがなく、すべてがブラウザのタブで動くからです。

出力は三つです。フレームのグリッドが設定したキャンバスの大きさに一致するPNGスプライトシート。プレビューやドキュメントに便利なアニメーションGIF。そして3Dの場面。これはブラウザで動き、もう開けなくなる一方通行の書き出しではなく、3Dゲームビルダーで編集可能なままです。三つめの出力の行き着く先を見たいなら、The Cyclops' IslandとMini Worldがその上に作られています。

それが属する世界へ歩き出す

スプライトは、立つ場所を持たないキャラクターです。最後の工程は、他のだれも提供しないものです。たった今作ったシートを取り、だれかが歩き回れる世界に置きます。小さな島、惑星、雨の通りの角。このサイトのすべての世界は、ひとつの書いた説明から作られ、遊べるページとして公開されています。

FAQ