Mint パネルキット — タイトルバー付きパネルとボタン

角の丸みをほとんど引っ込めたフラットなデザインです。明るいフラットファミリーはカジュアル向けなので20pxの角とピル型ボタンを使いますが、こちらは8pxと正方形のボタンです。ストラテジーの画面はほとんどが行の集まりで、大きな丸みは数字の入る幅をちょうど食ってしまうからです。輪郭も陰影もどこにもなく、奥行きは重ねた三回の影だけです。

nine-sliceのパネル二枚 — 角8 pxのタイトルバー付きのウィンドウ枠と、角6 pxの沈んだ内枠 — で、メニューに必要なほぼすべての箱をまかなえます。ダイアログ、インベントリのグリッド、リストの下地、ツールチップ、ステータスパネル。タイトル帯がパネル上部に組み込まれているので、ダイアログの見出しに二枚目のスプライトも手作業の位置合わせも要りません。角は決して拡大されず中央はフラットな塗りなので、どちらもどんなサイズにもきれいに伸びます。

パネルの上には角の立ったボタンの4状態が載ります。通常、ホバー、押し込み、無効。いずれも同じ120×36の土台に角6 pxで描かれているので、ボタンのウィジェット一つでテクスチャを差し替えるだけで、矩形を動かさずに操作の一巡りがそろいます。押し込み状態は暗くするだけでなく面を2ピクセル下げて上のハイライトを外します。これが、ただ色が変わったのではなく押されたという手応えを作ります。

すべてが二通りで届きます。SVGソースはキットを実際に描いたファイルそのものです。開いて青灰の六色かミントグリーンのアクセント一色を変え、書き出し直してください。PNGの書き出しはフラットで透明、ビットマップを求めるエンジン向けに1x・2x・4xへあらかじめ拡大してあり、アルファの事前乗算もスプライト外にはみ出す焼き込みの影もありません。

クリエイティブ・コモンズ ゼロ 1.0 — パブリックドメイン。クレジット表記も不要です。 全文 · 実際どういう意味か