本日はチャンネル9の良い投稿を紹介しながら、Windows Phone を通じて Metro を考えていきたいと思います。まずは、こちらの投稿を見ていきましょう。
http://channel9.msdn.com/Shows/Inside+Windows+Phone/Inside-Windows-Phone-24-User-Experience-for-Windows-Phone-Apps
かつて私が初めてWPFとXAMLに触れるきっかけとなり、現在はWindows Phone UX チームの一員として活躍 Arturo Toledo が Windows Phone の UX について語っています。すでにアメリカ市場ではMango以前の Windows Phone が販売されて久しく、すでに多くのアプリがAppHubへ送られています。しかし、提供されているテンプレートを超えるものが少なく、使い分け方も理解されていないことが多いということで、現在Windows Phone UX チームとしては様々な品質向上施策を行なっているらしいです。このビデオもその一つとなります。

上記 UI はWindows Mobile 7 へ続くはずだったデザインです。Metro が採用される前の icon graphics でデザインされていますが、最終的には全体が Metro で統一されることになりました。こうやって見るとずいぶん違いがあることがわかります。可能な限り虚飾を廃して Metro デザインが成り立っていることがよくわかる例です。

「単に機能的なアプリケーションよりも、優れた UX を備えたアプリケーションがストアにおいて高いレートを付けられる傾向にある」と話していて、Pivot や Panorama テンプレートを包含したより大きな存在である Metro をしっかり理解することはその助けになると説明しています。虚飾を排するのはアイコンや UI のフレームだけではなく、フォントで構成するタイポグラフィもそうで、飾りである「セリフ」のないフォントを選んで使っています。

この他にも、スライダーやメールアイコンを例にとって、Metro におけるミニマムな(かつパフォーマンスに寄与する)表現を例にあげていました。その後このところよく見かける空港や地下鉄の写真を使った解説で、Metro のスイスデザインについて説明しています。(このあたりは以前のBLOGでお伝えしたところですね)
続いて、開発者はいきなりツールを使ってコーディングを始める傾向が強いが、UX 観点から言えばぜひ先に「計画」から始めて欲しい、としています。

あなたのアプリケーションは何をするものなのか?誰のためのものなのか?どのように状況に「ハマル」ものなのか?いつどこで使うものなのか?どのようなコンテンツを表示するものなのか?どのようにハードウェアを活用するものなのか?タッチをどのように使うのか?このような基本的な問題に対して、これから情熱を注ぐアプリケーションが創りだそうとするストーリーの「語り部」になったつもりで、まずは落ち着いて整理してみましょう。
そして、その後紡ぎ出したストーリーをプロトタイプに落とし込みます。ここでは自分にとって最も使いやすいツールを使って構いません。(個人的には正確性をあえて求めないように紙とペンを使うことをお勧めしたいです。)それぞれの画面を簡単に描き、画面同士がどのような関係にあるかをつないで示していきます。

このようなスケッチをする際にも、Metro の場合には画面上での配置や構成要素にルールがありますから、あくまでもなにをどのように見せたいかに終始して、後でルールを適用してきれいにするつもりでやると良い思います。
ビデオではこの後 Pivot と Panorama の使い分けや、画面構成上のタイトルの付け方などの Tips が続いて行きます。Windows Phone の開発そのものにご興味のある方は是非続けてみてください。Arturo の英語はとてもわかり易いですし、スライドもダウンロード可能なので非常に理解しやすいと思います。
これらの考えは Windows Phone で先行している故に Store での高いレート獲得のためにも、というような文脈で語られるわけですが、もちろんWindows 8 における Metro でも同じことが言えます。本当は Metro であろうとなかろうと適用できる考えもあるわけですが、Metro のミニマムデザインがある故に適用しやすくなることも多いはずです。
この際、使えるレイアウトはどのようなものであるか?配置できる UI コントロールはどのようなものか?Metro で標準的に使われているインタラクションにはどのようなものがあり、想定しているアプリケーション自体のインタラクションと相反しないか?UI の構成要素ごとに検討しておくべきポイントがありそうです。テクノロジーによる制約/利点を正しく捉えた上で、描いたストーリーをどんな舞台で動かすか想像することも、「計画」のうちであると考えています。今後 Visual Studio のテンプレートがメトロスタイルアプリ用に数種類用意されれば、WP7同様にどのようなケースで使い分けるのか、テンプレート活用の方向性についても疑問が起こるでしょう。その時にもメトロデザインの原則に戻って考えてみると、自ずとやるべきことが見えてくるのではないかと思います。
いかがでしたか?この他にもチャンネル9には様々な良質のコンテンツがありますので、是非参考にしてみてください。私も良い例を見つけたらご紹介できるようにしたいと思います。
以前から何度かお伝えしているインフラジスティックスが始める UX ワークショップ では、お客様からも Metro について掘り下げることについて多くのご要望を頂いております。プライベート/パブリックの種別にかかわらず、可能な限り Metro の適用に関してもカバーしていきたいと考えております。(逆に最初から現状を Metro 化することを前提に、という話でも構いません!)是非ご要望や悩みを聞かせて下さい。まだ始める所でもありますので、フィードバックを受け付けやすいタイミングです!どうぞご検討のほどよろしくお願い致します!
今回から数回、Windows Phone を題材にとって Metro について考えていきたいと思います。次回もお楽しみに!