アプリケーションが複雑化する前に、明確で使いやすい UI の基盤を固める必要がありました。サイドバーとコンテンツエリアという伝統的な「ダッシュボード型レイアウト」を、最新のデザイントレンドで再解釈しました。
サイドバーとレスポンシブ対応
多機能化を前提とした階層型ナビゲーションを採用。アイコンとテキストの組み合わせにより、どのページに何があるかを瞬時に判断できる設計にしました。また、モバイル環境でも折りたたみ可能なサイドメニューを実装しています。
カード型コンポーネントによる情報の重要度管理
サーバーステータス、ウォレット残高、資産総額。それぞれの情報は「カード」としてカプセル化。グリッドレイアウトにより、画面サイズに応じて柔軟に配置が変化する、スケーラブルな構成にしました。
サイバーパンク・テーマの導入
深みのあるダークネイビーの背景に、鮮やかなシアンとゴールドのアクセント。EVE Online の宇宙空間を感じさせる配色を、CSS 変数(Variables)をフル活用して全ページに一貫して適用しました。