[Windows Phone 7 UIガイドを読み解く] 第1回 ～WP7のデザイン哲学～

  • Article

[Windows Phone 7 UIガイドを読み解く ]
第1回 ～WP7のデザイン哲学～

新しい連載として、Windows Phone 7のUIデザインについての連載を始めます。
UI Design and Interaction Guide for Windows Phone 7 というドキュメントが発表されています。
このドキュメントは英語で書かれているので、その中からいくつかのトピックを抜き出し、紹介していきます。
オリジナルのドキュメントは、下記Webサイトよりダウンロードできます。
https://msdn.microsoft.com/en-us/library/ff637515(VS.92).aspx
このページの最初のほうにある、「UI Design and Interaction.....」というリンクをクリックすると、ダウンロードが始まります。

[Windows Phone 7 design philosophy] (8ページ - 13ページ )
直訳するとWP7のデザイン哲学でしょうか。
この6ページに、Windows Phone 7のデザインの目指すところが書いてあります。

WP7のアプリケーションの指標として、以下の3つの柱があります。

• Personal (個人的な) – your day, your way
• Relevant (適切な) – your people, your location
• Connected (つながっている) – your stuff, your peace of mind

アプリケーションは、この3つの柱のどれかを意識して開発するのがよいでしょう。
UIガイドには、上記のようなシンプルな言葉でしか書かれていませんが、僕はこんな感じで勝手に解釈しています。
Personalとは、WP7を使っているユーザーの生活や生き方に関するようなアプリのこと。
Relevantとは人とのつながりや今いる場所のような、TPOに合わせた情報を扱ったり、TPOにあわせて振る舞いが変わるようなアプリのこと。
Connectedとは、そのユーザーの信念や信条とどうつながるアプリを提供できるかということ。
これを見ると、「人が使っている」ということをすごく重視している感じがします。
デザイン哲学のページの最初の一節は、
Windows Phone 7 is for Life Maximizers
です。
「人生を最大化させる人」のためのものと言っているように、人が中心なんですね。

WP7のUIは、メトロという名前がついています。
地下鉄のメトロです。
地下鉄や空港では、言葉がわからない人にも分かるように、視覚的にデザインされた案内が出ています。

(UIガイドより引用した図)

この図に東京の地下鉄の案内図も載っているように、案内図は日本語が分からない方が見ても、意味が分かるように設計されています。

メトロデザインは、以下の5つの主題で開発されています。

1) Clean, light, open, and fast: It is visually distinctive, contains ample white space, reduces clutter and elevates typography as a key design element.

2) Content, not chrome: It accentuates focus on the content that the user cares most about, making the product simple and approachable for everyone.

3) Integrated hardware and software: Hardware and software blend into each other and creates a seamless user experience from single-button access to Search, Start, Back and the camera to on-board sensor integration.

4) World-class motion: The Windows Phone 7 touch and gesture experiences on capacitive screens are consistent with Windows 7 on the desktop and include hardware-accelerated animations and transitions to enhance the user’s experience at every turn.

5) Soulful and alive: A personalized, automatically updated view into the information that matters most to the user is enabled and brings to life a cinematic photo and video experience by having a fully integrated Zune media player experience.

簡単にまとめますと、1は特徴的かつシンプルに、2は重要なのは中身、3はシームレスな操作のためのハードとソフトの融合、4はタッチやハードウェアアクセラレーションの使用などのWindows 7からの継承、5はいろいろな情報を自動的にアップデートしてくれるということですね。

Windows Phone 7の画面がどんな感じかを知りたい方は、米国のWindows Phoneのサイトで動きをみることができます。
https://www.microsoft.com/windowsphone/en-us/default.aspx

今回は概念的な話でした。
次回からは、スタートページやアプリケーションバーなどの個々の要素について説明していきます。

[注意事項]
この記事は、UI Design and Interaction Guide for Windows Phone 7 Version 2.0を元に書いています。個人的な意見や見解も含んでいます。
記事中のページは、印刷後のページ(左上または右上に表示されている数字)です。
画像は、断りのない限りオリジナルのドキュメントから引用しています。
英語の得意な方は、オリジナルのドキュメントもご参照ください。

マイクロソフト
田中達彦