Windows8をインストールするとデフォルトでインストールされているファイナンスというアプリがあります。MicrosoftさんのWindows ストア アプリの開発セミナーでファイナンスアプリを例にWindowsストアアプリのデザインのポイントを聞きました。当たり前のこともありますが、デザインの素人からするとわかりやすかったので纏めます。
【Windows ストア アプリのデザイン原則】
・シンプルなデザインでコンテンツに集中させる
・統一された直感的なデザイン
【ライブタイル】
日経平均、ダウ、TOPIXと放っておくとタイルの内容が変わっていきます。アプリを開くことなく情報を見れるのが一つポイントです。
【画面端の見切れ】
画面端に故意に見切れを作ることで、「続きがある」ことをユーザに認識させる。
これとかも。
【統一的なUIデザイン】
プラスマーク・矢印マークなど標準コンテンツを利用する。
【タイルの配置】
タイルでデザインするときは整然と配置する。
【フォントの有効活用】
タイトルと内容のフォントを分けて、フォントに意味を持たせる。
推奨フォントはSegoe UIとMeiryo UIだが英語・日本語混在の場合はMeiryo UIを推奨。
Segoe UIに日本語が無いので、日本語部分だけ代替フォントのMeiryoになってしまう。
【色々なスクリーンの状態に対応】
スクリーンの状態は以下の4種類
- ・横置きフルスクリーン(FullScreenLandscape)
- ・スナップしている(Snapped)
- ・スナップされている(Filled)
- ・縦置き(FullScreenPortrait)
これはファイナンスのスナップしている(Snapped)の例です。
デザインって難しいですね。
