UIパック
Charcoal ステージ選択
12個のステージ選択とマップの部品(手描き)。ダークUI用、スモークグレーに残り火オレンジのアクセント。SVG+透過PNG 1x/2x/4x。

このパックについて
Charcoal ステージ選択は手描きスタイルで描かれた12点のステージ選択とマップの部品のセットです。どの縁もサンプリングして少しずつずらしてあるので、本当にまっすぐな線は一本もありません。内容はステージノードの4状態、直線と曲線の道をそれぞれ未開放と開放で、地域プレート、戦場の霧の縁、ズーム操作、そして凡例ボックスです。
ステージ選択マップはノードとその間の線という二つのもので出来ています。そしてどの無料素材集も抜かしているのが、その線です。マップが崩れるのは線をエンジンで描いたときです。コードで引いた線は絵柄に合いませんし、あるスタイルでは直線、別のスタイルでは手描きの揺れになる道は、四角形では表せません。
揺らぎはランダムではなく決定的です。同じ箱はどのビルドでも同じ揺れ方をし、だからこそバージョン管理に置けます。陰影はクロスハッチです。描かれた線の下のグラデーションは、手ではなくフィルターとして読まれるからです。
そのスタイルの中でこれはCharcoalとしての読みです。スモークグレーのパレットに残り火オレンジのアクセントを載せたダークインターフェースで、縁が一本のフレーム、160x52のタブ形のボタン、7分割の中空コアのバー、24pxグリッドの二色のアイコンを軸に組まれています。二つのファミリーがアートスタイルを共有しながら入れ替え可能にならない理由は、この寸法にあります。スタイルは縁の描き方を決め、数値はそのインターフェースが何のためのものかを決めます。
道はノードと同じ描画言語で作られており、直線と曲線それぞれに未開放と開放の二通りがあります。未開放は細い破線、開放は太い実線です。おかげでマップ上の進み具合は、ノードだけでなく接続の変化としても見えます。ノードの四状態も構造で分かれます。未開放は全面に斜線、開放可能は中心に点が一つ、クリア済みは塗りつぶし、パーフェクトは塗りつぶしに四隅のかぎ括弧が加わります。霧の縁はやわらかいぼかしではなく段状の帯として描いてあります。ぼかしはエンジンごとにラスタライズが異なり、マップの縁こそその差が出る場所だからです。
どのスプライトも編集可能なSVGと、1x・2x・4xの透過PNGで届きます。PNGをそのままエンジンに置いても、ベクターを開いて色を変えても構いません。Charcoalファミリーの他と同じ寸法で描かれているので、このキットとCharcoalのパネルキットはどちらもサイズを変えずに揃います。ノートや絵本の風合いのゲームによく合います。
使い方
- ノードは自分のグリッドに置き、その間に道の部品を並べてください。道は仕様欄のノード間隔に合わせて描かれており、重ならずにノードの縁で接します。
- ステージが開放されたら、道は色を変えるのではなく開放版に差し替えてください。信号は破線の並びです。
- 霧の縁は探索済み領域の境界に合わせ、未探索側へ少しかぶせてください。段状の帯は横方向に並べて使えるよう描かれています。
- 地域プレートと凡例ボックスはこのファミリーのパネルキットと角の処理を共有しています。マップ画面とメニュー画面が別のゲームに見えないためです。
ライセンス
"Charcoal ステージ選択" by Oğuzhan Girgin, licensed under CC BY 4.0 — https://www.colorosse.com/assets/2d/ui/charcoal-level-select


