設定

インスペクターのすべての設定と、その働き。ルック(スタイル、色、マテリアル、線、シェーディング、クリーンアップ)はスタイルステップにあり、そのグラフはルックをノードにしたものです(スタイルグラフ)。カメラやライトの設定は、シーンステップでそのカメラやライトを選ぶと表示されます(シーンを参照)。画像はライブラリのゴブリンを64 pxで、cleanプリセットの設定を1つだけ変えたものです(scripts/docs_images.shで作成しているので、このバージョンと一致します)。設定の左端にアクセントバーがあれば、プリセットから変更したことを示します。右クリックでリセットできます。

スタイル

プリセットは出発点です。プロジェクトは変更した部分だけを保存するので、後のバージョンでプリセットが改良されると、プロジェクトも一緒に良くなります。

クリーン selout retro4 フラット ワイヤーフレーム
プリセット:clean プリセット:selout プリセット:retro4 プリセット:flat プリセット:wireframe

キットはさらに一歩進みます:キットを保存…(スタイルをキットとして保存)は、表示中のスタイル、つまりゲームのルック全体(プリセットとその変更、ライトリグ、カメラ、1メートルあたりのピクセル数、パレットそのもの)を、パイプラインのライブラリ内の小さなキットファイル(.pixorkit)1つに書き出します。ノードライブラリではマイパイプラインの下に表示されます。キットを使う…(スタイルのキットを使う)は、キットからこのプロジェクトのスタイルを作って表示します。プロジェクト自身のクリップ、マテリアル、書き出しは保たれるので、ゲーム内のすべてのアセットがそろいます。プロジェクトを開いた状態でスタイルのキットをダブルクリックするか、Pixorにドロップしても同じです。キットはパレットを内蔵しているので、どのマシンでも使え、共有もできます。コマンドラインではpxr style new game.pixorkit --from hero.pixor、続いてpxr render model.glb --style game.pixorkit。

スプライトに合わせる…は、手持ちのスプライト(自分のゲームのアートや、横に並べたいスプライト)からルックを読み取って設定します:パレット(その色そのもの)、サイズ(どれだけの高さか)、アウトライン(全周に1つの暗い色、各色の暗い階調、またはなし)、明暗の帯、ランプが暗から明へどれだけ色相を回すか、ディザを使うかどうか。ステータス行に何をどう読み取ったかが表示されます。どの設定も後から変更でき、元に戻す1回ですべて戻ります。コマンドラインでは、pxr reference sprite.pngで読み取る内容を表示し、pxr project set game.pixor --match-sprite sprite.pngで設定します。

コンソール(デフォルトはなし)は、ルックを昔のゲーム機のルールに合わせます:ゲームボーイ、NES、PICO-8、TIC-80、C64(その色、スプライトあたりの色数、C64の横長ピクセル)。その下に、スプライトが収まっているかどうかが表示されます。コマンドラインでは--console gameboy。

カメラ

アウトライナーでカメラを選ぶ(または3Dビューでクリックする)と表示されます。各カメラは独自のシートをレンダリングします(一緒にフレーミングされたカメラは1枚を共有し、それぞれ1行)。ゲームで、ゲームの種類に合わせてワンクリックで設定できます(シーンを参照)。

ビューでカメラの角度を決めます。カメラ1台がスプライトの1つの向きです。向きを増やすにはカメラを増やし、モデルの周りに回します。

向き 斜め45度 アイソメトリック 見下ろし型
ビュー:サイド ビュー:クォータービュー ビュー:アイソメトリック ビュー:トップダウン

ピッチは角度を微調整します(地平線から下への角度、-90°〜90°。負の値は下から見上げます)。回転(-180°〜180°)はカメラをモデルの周りで回し、どの向きを見るかを決めます。3Dビューでカメラをドラッグすると両方が設定されます。モデルの周りのリングは、これと同じカメラを4台、8台、16台、または32台、向きごとに1台ずつ追加します。

20° 45° 70°
ピッチ:20° ピッチ:45° ピッチ:70°

サイズは、カメラのピクセルがどう決まるかを示します:

  • モデルに合わせる:幅と高さは、モデル(すべての向きから見た、書き出すすべてのクリップのすべてのフレーム)を収めるキャンバスで、それぞれ4~2048 pxです:キャラクターなら64×64、タイトル画像なら960×540。
  • キャンバスとズーム:幅と高さはキャンバス、ズームは1メートルが何ピクセルになるかで、それぞれ個別に設定します:キャンバスを広げると、モデルが大きく描かれるのではなくシーンが広く見え、収まらない部分は切り取られます。
  • メートルあたりのピクセル数:全キャラクターで共有できる固定のスケール(ピクセル/m)。キャンバスは収まるように大きくなります。

3Dビューでは、カメラのフレームがアクセントカラーで描かれ、内側に幅と高さのピクセル数が、右上の角の横にズーム(1メートルあたりのピクセル数、18.3 px/m)が表示されます。辺のハンドルをドラッグするとキャンバスの幅や高さが変わり(縦横比もそれに合わせて変わります)、角をドラッグするとズームします。ズームアウトすると同じキャンバスにより多くが収まり、ズームインすると少なく大きく描かれます。どちらの操作でもカメラはキャンバスとズームになります。

投影は平行投影(ピクセルアートの多くと同じく、どこにあってもすべてのパーツが同じサイズ)か、透視投影(近いものほど大きい)で、透視投影には視野角(5°〜150°、切り替えたときは50°)があります。どちらでも、モデルの足元のメートルあたりのピクセル数は同じです。(pxr project set game.pixor --fov 50、平行投影は0。)

32px(2倍で表示) 64 px
サイズ:32 px(2倍で表示) サイズ:64 px

サンプル数(スタイルステップのクリーンアップの下)は軸ごとのスーパーサンプリングで、1〜8です。サンプル数が多いほど、各ピクセルをモデルのより多くの部分から決めます。形や細いパーツはきれいになり、レンダリングは遅くなります。コマンドラインでは--samples 2。

1 4(デフォルト)
サンプル数:1 サンプル数:4(デフォルト)

微調整Xと微調整Y(サンプル数の下)は、モデルをピクセルグリッドに沿って1ピクセル未満、-0.5から0.5まで動かします。スプライトのサイズとピボットは変わらず、モデルのどの点がピクセルになるかだけが変わります。目が2つのピクセルの間に落ちる、きれいなはずの輪郭に段差が出るなど、ある細部がうまく収まらないときは、4分の1ピクセルで足りることがよくあります。コマンドラインでは--nudge 0.25,0。

ライト

アウトライナーでキーライト、フィルライト、リムライトを選びます(または3Dビューでキーライトとフィルライトをドラッグします)。

方位角(-180°~180°)と仰角(-90°~90°)でキーライトを配置します。カメラに追従がオン(デフォルト)なら、カメラを基準に測るので、スプライトで通常望まれるように、ライトはどのカメラでも同じ側にあります。オフにするとライトはシーン内で固定され、ライトから遠ざかって歩くキャラクターは暗くなります(コマンドラインでは--light-space world)。

方位角-90° -45°(デフォルト) 45°
ライトの方位角:-90° ライトの方位角:-45°(デフォルト) ライトの方位角:45°
仰角15° 45°(デフォルト) 80°
ライトの仰角:15° ライトの仰角:45°(デフォルト) ライトの仰角:80°

ライトリグは、パレットのランプのまま、ライティング全体を一度に設定します:正午(高い太陽)、夕暮れ(低いオレンジの太陽、影側にすみれ色のフィル、リムハイライト)、たいまつ(手前の低い位置の暖かい炎)、月光(上からの冷たい光、かすかな青のフィル、リム)、スタジオ(キー、フィル、リム。アイコンやプレビュー向け)。リグは、キーライト、影側を1~2段持ち上げるフィルライト、リムハイライト、光と影が寄る色相を設定します。リグを選んだ後でも方位角と仰角は変更できます。

フィルライトの強さ(0~1、0でオフ)は影側を持ち上げます。独自の角度を使うと、キーライトの反対側ではなく独自の方位角と仰角を持たせられます(コマンドラインでは--fill 0.3)。リムライト(オン)は、明るい側で手前から外れていく輪郭にハイライトを加えます。幅(0.3~0.95)は、それがどこまで内側に届くかを決めます。

影を落とす(キーライトで)は、パーツ同士に影を落とさせます(体に盾の影、肩に兜の影)。コマンドラインでは--no-shadow。

オン オフ
影を落とす:オン 影を落とす:オフ

色

ベースカラー(1~32、自動パレットのみ)は、Pixorがモデルのテクスチャーから取る色の数です。それぞれに明るい階調と暗い階調の独自のランプが付きます。

3 10(デフォルト)
ベースカラー:3 ベースカラー:10(既定)

明暗の帯(1~4)は、色ごとの明るい階調の数です(--bands 2)。

1 2 3(デフォルト) 4
明暗の帯:1 明暗の帯:2 明暗の帯:3(デフォルト) 明暗の帯:4

色相シフト(0°~30°)は、単に暗くするのではなく、ピクセルアーティストがするように影を青寄りに、光を黄色寄りに回します。

0° 9°(デフォルト) 25°
色相シフト:0° 色相シフト:9°(デフォルト) 色相シフト:25°

ディザは、明暗の帯が次の帯と接する場所で、硬い段差の代わりに隣り合う階調を規則的な(Bayer)パターンで混ぜます。パターンはモデルの面に固定されます:モデルが止まっていればきれいなピクセルの格子で、アニメーションするときは各パーツとともに動き、表面を這うことはありません。混ざるのは同じ色の隣り合う2つの階調だけで、クリーンアップはディザのピクセルには手を付けません。範囲は0~1です(--dither 0.5)。96 pxでの表示:

0(デフォルト) 0.5 1
ディザ:0(デフォルト) ディザ:0.5 ディザ:1

ディザパターン:クロスハッチ(Bayer)は上の規則的な格子、散布(ブルーノイズ)は目に付く格子なしに均等に散らしたピクセルで、アーティストが手で置くディザです。どちらもモデルが動いても面に固定されたままなので、ちらつきません。コマンドラインでは--dither-pattern blue-noise。

パレットは自動(モデルから色を取る)、Pixor独自のパレットのいずれか、またはファイルです。内蔵のパレットは、暗から明へ並ぶランプのセットで、Pixorのために作られています:

pixor-16 pixor-8 dusk-12 forest-12
パレット:pixor-16 パレット:pixor-8 パレット:dusk-12 パレット:forest-12
desert-12 ice-10 mono-8
パレット:desert-12 パレット:ice-10 パレット:mono-8

パレットファイル…で独自のパレット(Lospecの.hex、GIMPの.gpl、または色がそのままパレットになる.png)を使います。ランプはその色に合わせられます。コマンドラインでは--palette my.hexまたは--palette dusk-12。これは8色のパレットの例です:

パレット:ファイルから読み込んだ8色のパレット

色合わせの方法(自分のパレットまたは内蔵パレット使用時)は、ランプをスナップするときに、どの色を最も近いとみなすかを決めます:OKLabは目の判断に近く、明暗を区別します(デフォルト)。sRGBは多くのツールが使う単純な距離で、それらのツールで作ったパレットはこちらを想定しているかもしれません。重み付きRGBはその中間です。その下に、現在のフレームを3つの方法それぞれで合わせた結果が並び、クリックすると選べます。コマンドラインでは--match-space srgb。

マテリアル

モデルのすべてのマテリアルが、ルックがそれに何をするかとともにここに並びます。設定は1つのパーツではなくマテリアルに属するので、そのマテリアルでできたすべてのパーツに適用されます。シーンステップでパーツを選ぶと、それがどのマテリアルかが分かります。

モデルファイルからは、glTFのマテリアルが色以外に面について指定していることを、ルックの出発点として取り込みます:

ファイルの内容 Pixorでの扱い
金属、および完全な粗さ未満の粗さ より硬く広いきらめき。金属は単独の明るいピクセルを残し、ノイズではなくきらめきに見えます
メタリック・ラフネスマップ 同じものをピクセルごとに:表面の一部だけを金属にできます
オクルージョンマップ くぼみはランプで1段暗くなります
エミッシブ(KHR_materials_emissive_strength付き) マテリアルが発光します:光に関係なく最も明るい階調。エミッシブマップがあれば、マップが照らすピクセルだけなので、ランプは光ってもその柱は光りません
KHR_materials_unlit フラットのルック:どこもベースの階調
アルファBLEND、KHR_materials_transmission 透過。柔らかいアルファではなく、表面に固定した組織的ディザとして描きます。透明なテクセルを持つBLENDテクスチャ(デカール、目など)は、透明な部分が切り抜かれます
KHR_texture_transform 反映:テクスチャーはファイルの指定どおりにずらし、回し、スケールします
クリアコート、シーン、イリデセンス、ボリューム 無視します。表面が黙って間違った見た目にならないよう、pxr inspectがそう報告します
ノーマルマップ 読み取って報告しますが、使いません:法線を曲げるには接線が必要で、接線を得る2つの方法は、どのモデルのどの頂点にも浮動小数点数を4つ追加するか、GPUによって結果が異なるかのどちらかだからです

完全に粗く金属でない状態がニュートラルです。それがglTF自体のデフォルトであり、誰も気にかけなかった面に対してどのエクスポーターも書き込む値だからです。明暗の帯の数はあなたが決めます。上の色設定がそれで、モデルが上書きすることはありません。

マップはジオメトリーに対する2つ目のパスでサンプリングされます。このパスはマテリアルにマップがあり、かつこの設定がオンのときだけ実行されるので、マップのないモデルではコストがかかりません。

オフにすると、マテリアルを色だけでシェーディングします。コマンドラインでは--no-material-channels。pxr inspect MODELで、各マテリアルが何を求めているかを一覧表示します。

  • 線:このマテリアルの周りの1ピクセルの線。発光、炎、水、ガラスなど、暗いアウトラインが不自然に見えるものではオフにします。
  • 階調サイクル:カラーサイクルアクションで、このマテリアルの階調が1フレームに1段ずつ回ります(水、溶岩、ルーン、画面)。実行時にサイクルするエンジン向けに、JSONの書き出しにはパレットインデックスも記載されます。
  • チームカラー:このマテリアルがチームカラーです。teamのパレットバリアント(アセットステップ、バリアントを追加:team red、team blue、…)はこれだけを塗り替え、各階調は明るさを保つので、1つのスプライトからすべてのチームができます(パレットのバリエーション)。
  • ワイヤーが発光:ワイヤーフレームのルックがオンのときだけ。このマテリアルのワイヤーは光に関係なく最も明るい階調になります。ホログラムやネオン向けです。ワイヤーはエミッションシート(--export emission)に入るので、エンジンでブルームをかけたり、黒の上にワイヤーだけを表示したりできます。

色によるチームカラーは、チームカラーを色で指定します。その色相のすべてのランプが、どのマテリアルで描かれていてもチームカラーになります。1枚のテクスチャアトラスで塗られ、1つのマテリアルでキャラクター全体を描くモデルでは、この方法を使います。一覧の下に、チームカラーの階調がいくつあるか、そしてスプライトのほかの色も使っているためにいくつをそのままにするかが表示されます。

モデルファイルは、マテリアルのoutlineとcycleのヒント(マテリアルのカスタムプロパティ)で、最初の2つを自分で設定できます。その場合、一覧には切り替えの代わりにそう表示されます。

線

線の種類はそれぞれ、なし、暗い(最も暗い階調)、Selout 1~Selout 3(その色自身のランプをその段数だけ下げた色。赤いマントには暗い赤の線)のいずれかです。コマンドラインとファイルでは、暗いはdark、Selout 2はselout2です。

シルエット:スプライト全体を囲むアウトライン:

なし dark(デフォルト) セルアウト3
シルエット:なし シルエット:暗い(デフォルト) シルエット:selout 3

内側(あるパーツが別のパーツに重なるところ):

なし ダーク selout 2(デフォルト)
内側:なし 内側:暗い 内側:selout 2(デフォルト)

折り目(1つのパーツ内の鋭い折れ):

none(デフォルト) セルアウト1
折り目:なし(デフォルト) 折り目:selout 1

凸の輪郭は、手前に盛り上がった折れ目に引く明るい線で、ランプを上がる唯一の線です:なし(デフォルト)、ハイライト1~ハイライト3、または暗い。下の折り目の角度を使います。コマンドラインでは--convex highlight1。

線は常に1 px幅で、L字の角を作らず、パーツをまたぐこともありません。

暗い線の色(自動パレットのみ)は、暗いに設定した線の色を指定します(--line-colour #3b2a8f)。クリックするとカラーピッカーが開き、スプライト自身の色も選べます。右クリックするとプリセットの色に戻ります。セルアウトの線はランプの色を保ち、固定パレットは常に最も暗い色を使います。

#14101c(デフォルト) #3b2a8f #7a2a1c
暗い線の色:#14101c(デフォルト) 暗い線の色:#3b2a8f 暗い線の色:#7a2a1c

ワイヤーフレーム

モデル自身のメッシュの辺を、パレット上のピクセルの線として描きます:レトロなベクター3D、ホログラムやスキャナーの効果、設計図やUI。パレット上にワイヤーフレームを描けるツールはほかにありません。オンにしない限りオフです。

  • メッシュの辺はワイヤーの色で、ルックをオンにします(デフォルトはなし):暗いは線の色を使い、Selout Nはワイヤーの下の色を自分のランプでN段下げた色を使うので、赤いパーツには暗い赤のワイヤーが付きます。
  • その下は塗りです。いつもどおりのシェーディング、シルエット全体を覆う単色(ベクターや設計図のような見た目。単色が暗い色なので、通常のワイヤーはそこでは最も明るい階調で描かれます)、またはワイヤーだけを透明の上に残すなし。下に何もなければ、シルエットと内側の線も消えます。もう描かれない表面に属するものだからです。
  • 面の後ろは、何かの後ろを通る辺の部分をどうするかを決めます:描画しない(デフォルト)、1段暗く、2段暗く、点線。
  • すべての辺はすべての辺を描きます。オフにすると、開いた辺と辺の角度(0°~180°、デフォルト20°)より鋭い辺だけを描くので、glTFファイルが平らな四角形に入れる対角線が隠れ、モデリングしたときの四角形どおりに見えます。角度を下げるとメッシュをより多く描き、上げると硬い角だけを描きます。

コマンドラインでは:--wire selout2 --wire-fill none --wire-hidden dotted --wire-angle 30 --wire-all-edges(暗いは--wire dark、1段暗くは--wire-hidden darker1)。pxr project setでも同じ名前を使います(オフにするには--no-wire)。マテリアルのワイヤーを光らせるには--wire-glow MATERIALです。

線の感度

線が始まる場所。これらをドラッグしている間、ビューポートにはedgesの段階が表示されます:オレンジのピクセルは深度のしきい値を超え、シアンは折り目の角度を超え、青はパーツ間です。薄いものはしきい値に近いものです。

  • 折り目の角度(1°~179°、デフォルト55°):折り目や凸の線が付くのに必要な折れ具合(小さいほど多く描かれます。折り目は「線」でオンにする必要があります)。--crease-angle。
  • 深度の段(0.1~40 px、デフォルト2.5):内側の線が付くのに、ある面が別の面よりどれだけ手前にある必要があるか(小さいほど多く描かれます)。--depth-step。
  • 最短の線(0〜16 px、既定は3):これより短い内側の線と折り目の線は捨てられます。ドラッグ中は線の段階が表示されます。--shortest-line。
  • パーツ間の線(デフォルトでオン):深度の段がなくても、2つのパーツが接する場所に線を引きます(オフ:深度の段と折り目だけ)。--no-part-lines。
  • 内側のシルエット(既定はオフ):シルエットをスプライトの外側ではなく、スプライト自身の縁のピクセルに描きます。--outline-inside。

シェーディング

帯の境界1、2…は、各明暗の帯が始まる位置をN.Lで指定します(-1は光と反対向き、1は光の方向)。ドラッグ中はbandsステージに結果が表示されます。最小のハイライト(1~16 px、デフォルト2)はそのピクセル数より小さいハイライトを取り除き、帯の保持(0~0.3、デフォルト0.05)は、ピクセルが境界にその距離まで近い間、フレームをまたいで帯を保つので、帯がちらつきません。

スペキュラーは、光が反射する所(金属、宝石)に明るい階調を加えます。サイズでハイライトの大きさを決めます。最小のハイライトより小さいハイライトは捨てられます。selout以外のすべてのプリセットでオフです。(seloutプリセットで表示。)

オフ オン
最小のハイライト:オフ 最小のハイライト:オン

クリーンアップ

カバー率は、描かれるためにモデルがピクセルをどれだけ覆う必要があるか、細いパーツは、細いパーツ(刃、杖)がピクセルを保つのにどれだけ必要かで、どちらもピクセルに対する割合です(デフォルト0.5と0.2)。coverageステージで両方を確認できます(取り除かれたピクセルは赤)。

孤立部分のサイズ(0〜4):その数までのピクセルからなる孤立した塊は、周囲の色になります。既定の1は単独のピクセルを、2は2つ組も片付けます。0でクリーンアップをオフにします。

アンチエイリアス:ピクセルアーティストと同じように、線の階段の各段の内角に暗いピクセルを1つ置いて和らげます。1はシルエットに、2はすべての線に適用します(--aa 1)。(selloutプリセットで表示。)

0(デフォルト) 1 2
アンチエイリアス:0(既定) アンチエイリアス:1 アンチエイリアス:2

均等な階段:シルエットのまっすぐな輪郭を、ピクセルアーティストが描くように均等な段にします。2、3、1、2ピクセルになったアイソメトリックの輪郭は2、2、2、2になります。平均が整数ピクセルになる段の連なりだけを対象にし、曲線はそのまま、どの輪郭も1ピクセルを超えて動きません。追加されるピクセルは、元になるピクセルの色です。デフォルトはオフ。コマンドラインでは--even-stairs。

スミアフレーム:クリップの中で、前のフレームからこのピクセル数以上動いたピクセルは、来た道を戻るように自身の色の軌跡を残します。アニメーターが描くような、素早い振りや突きのスミアです。動いたものの背後に描かれ、ほかの何かの上に描かれることはなく、遅いフレームにはありません。最大64 pxで、0(既定)でオフ、3のスプライトには4〜64ピクセルが合います。コマンドラインでは--smear 3。

書き出し

形式、レイアウト、パディング、押し出し:エンジンへの書き出しを参照してください。

ピクセルを評価する

スタイルステップの2Dビューは、ピクセルを実際に見極める場所です。そのバーには、Asepriteユーザーが手を伸ばすツールがそろっています:

ツール 用途
ピクセルグリッド(Shift+G) 4倍以上で、すべてのピクセルの周りの線
ズーム(+、-、ホイール、ピンチ) ポインターを中心に滑らかに。どのピクセルも画面の整数ピクセルのままです。中ボタンでスプライトを移動し、Homeで再びフィットさせます
読み取り表示(ピクセルにポインターを合わせる) パレットのインデックス、16進値、どのランプのどの位置にあるか、塗り、線、ディザ、柔らかい縁のどれか、そして元のパーツとマテリアル。重要なのはインデックスです:シェーディング以降はすべてパレットのインデックスで処理されます
色(C) パレットの各エントリーを、このフレームでの使用頻度を表すバーで表示します。使っていないものは灰色に、目で区別できない2色は枠で囲みます。リアルタイムなので、書き出し後のレポートではなく、ランプを選んでいる最中に色数を確認できます
オニオンスキン(O) 前のフレーム(暖色)と後のフレーム(寒色)。弧の判断に
変化(D) 前のフレームと異なるピクセル。クリップが静止画の列ではなく動きとして見えます。何も変わっていないフレームはそう表示されます
A/B (A) このレンダリングを保持し、ランプやライトを変えて、Aを押すとその場で2つを切り替えます。小さな変化は、記憶ではなく切り替えて判断します
背景 市松模様、単色、または自分のゲームのアート。スプライトが置かれる場所でコントラストを判断できます
一貫性ボード:すべての向きを一度に(B) このフレームのすべての向きを、幅と高さとともに一度に表示します。シルエットはそれぞれを形だけで描き、ピボットはそれぞれの立ち位置を示し、色数はそれぞれの色を数えます
チェック すべてのチェックで見つかったもの。該当するピクセルに印を付け、フレームの下に数を表示します(最初はオフ)

画面に見えるものがそのままファイルになります:Pixor自身のテストで、あらゆるズームでプレビューのピクセルと書き出したシートのピクセルを1バイトずつ比較しています。

シェイプ

アプリで作るシェイプのサイズ、セグメント、位置、色:シーンを参照してください。

このページで説明している内容は製品版の機能です。無料のブラウザーデモで使えるのは、デフォルトのルックとPNGシートだけです。

ブラウザーで試す Pixorを入手