UIパック
Hyperlane HUDフレームセット
12個のHUDフレーム(アーケード)。ダークUI用、深いバイオレットに夕暮れオレンジのアクセント。SVG+透過PNG 1x/2x/4x。

このパックについて
Hyperlane HUDフレームセットはアーケードスタイルで描かれた12点のHUDフレームのセットです。色は縁ではなく本体です。両端の尖った、飽和した板。中身は主パネルの枠、データ表示の枠、コンソールの枠、ターミナルの枠、警告バナー、幅広のステータス帯、縦長のサイドカラム、正方形の肖像枠、ラベルタグ、小さなバッジです。
無料のHUDセットの多くは、同じ長方形を十二サイズ並べただけのものです。そこが見分けどころで、本物のインターフェース素材はどのフレームにも固有の輪郭を与えます。データ表示と肖像と警告バナーは役割が違うのだから、同じ形であるはずがありません。違いが幅だけのセットは、二つ並べた瞬間に埋め草として読めてしまいます。
どの板も長辺方向に二段のグラデーションで塗られ、印は黒地に明るくではなく色の上に暗く描かれています。尖った両端はシルエットの一部なので、輪郭の効果ではなく拡大しても残ります。
そのスタイルの中でこれはHyperlaneとしての読みです。深いバイオレットのパレットに夕暮れオレンジのアクセントを載せたダークインターフェースで、二重の同心フレーム、192x48の完全に丸めたピル型ボタン、6分割の光沢のあるバー、32pxグリッドの二色のアイコンを軸に組まれています。二つのファミリーがアートスタイルを共有しながら入れ替え可能にならない理由は、この寸法にあります。スタイルは縁の描き方を決め、数値はそのインターフェースが何のためのものかを決めます。
ここにあるフレームはどれも固有のシルエットを持ちます。四つの角と四つの辺を独立に扱っているので、あるフレームは右上に切り欠きと片側にレールを持ち、次のフレームは折れた角と長辺両側のV字を持ちます。どれ一つとして別のフレームの拡大コピーではありません。施した印(ハッチのブロック、目盛りの列、バーコードの帯、山形)は辺の上だけに置かれます。中央が空いているのは、そこにあなたの地図や肖像や文章が入るからです。
どのスプライトも編集可能なSVGと、1x・2x・4xの透過PNGで届きます。PNGをそのままエンジンに置いても、ベクターを開いて色を変えても構いません。Hyperlaneファミリーの他と同じ寸法で描かれているので、このキットとHyperlaneのパネルキットはどちらもサイズを変えずに揃います。レースやアーケード、スコア重視のインターフェースによく合います。
使い方
- nine-sliceは直線部分だけにかけてください。各フレームは安全な余白を仕様欄に示しており、中央に切り欠きやV字を持つ辺は伸長不可と記されています。伸ばせば印もフレームと一緒に大きくなります。
- 自分のコンテンツは枠の上ではなく中に描いてください。どのシルエットも意図的に中央を空けており、施された印がそこへ入り込むこともありません。
- グローはぼかしフィルターではなく重ねた線で描かれているので、4xのPNGも鮮明なままです。ブルームを強めたいならスプライトを拡大せず、エンジン側で上から足してください。
ライセンス
"Hyperlane HUDフレームセット" by Oğuzhan Girgin, licensed under CC BY 4.0 — https://www.colorosse.com/assets/2d/ui/hyperlane-hud-frame-set


