明らかになる「Metro スタイル アプリ」開発 ーデザイン編 #wddjp @maskin

NewsApp, HTML5, Metroスタイル, microsoft, Windows, windows8, マイクロソフト


[読了時間: 1分]

Windows 8 Metro スタイル アプリ 開発週間 powered by MSP

screenshot_109

次期バージョンのオペレーティング システムとなる Windows 8 の可能性と技術情報を提供する「Windows Developer Days」。TechWaveでは、アプリ開発を通じてグローバルに活躍したい学生を支援する「Microsoft Student Partners (MSP)」と共にその模様をお伝えしていきます! →[まとめページ]

metro_design_principal

 Windows 8 の Metro UI における最大の特徴は、余計な情報が排除されている点。ウィンドウ型UIにありがちな線やボックス、多数の小さなボタンは存在せず、必要な時に必要なレイアウトや機能が登場する仕組みだ。

 これは目的の「Metro スタイル アプリ」に素速く直感的に行き来できるようにするための配慮で、全体的に余白を多く取ることや、左側の余白を60ピクセルとするなど、ピクセル単位でデザイン設計の原則がある。

 この画像は、5ピクセル単位で、情報配置の原則を示す図。見出し(タイトル)や本文の配置、ボタン等の配置についてもこの5ピクセルのグリッドに沿う指針が提示されている。

「Metro スタイル アプリ」デザインの設計原則

 これらは全てMetro スタイル アプリの設計原則に基づくもので、Windows Metro UIのコンセプトにある「地下鉄など交通標識のような、必要な情報に迷わず速やかにリーチできる」ような洗練されたシンボリックなデザインを誰もが構築できるようにするための指針のようなものだ。

 内容としては「コンテンツにフォーカスさせる」「ルールに従い文字やグリッドを使う」「基本的に水平方向へ伸長」「デジタルということを活用する」「ルールに従いコンパクトにする」といったもの。画面を分割する「スナップ機能」は左右320ピクセル、「チャーム」と呼ばれる設定ツールバーは常に右に表示され、アプリにあわせて機能を切り替えるなど、全体に共通するルールの遵守については強く呼び掛けている。

 実際に、既存のスマートフォンアプリやPC用アプリケーションと同じ感覚で開発をしようとすると、デザインルールが制限のように感じられてしまうかもしれないが、逆にアプリを開発する際に、ゼロからUIを創造するような手間が無くなるというメリットが大きいと言えるだろう。そもそも「Metro スタイル アプリ」開発用各種テンプレートが用意されており、それを利用すれば半自動でルールに従うことができてしまうため手間がかからないのだ。

 むしろ「Metro スタイル アプリ」開発で重要なのは、すばやくON/OFFしたり、情報を効率よく入手できること、タブレットを両手で持った時を想定し、左右下弦に重要な情報を配置しないようにするなど「情報中心」のコンピューティングに沿った機能をどうイメージするかということに尽きる。特に、デスクトップで表示される「1:1」もしくは「1:2」の比率のタイルが拡大縮小された際にどうデザインするか、複数のページをまとめる階層型ページをどうデザインするか? スナップ時(320px)のデザインは? 縦横切り替えといった情報提供の柔軟さをイメージすることが肝になってくると言えそうだ。

【関連URL】
●Windows 8 Consumer Preview
http://windows.microsoft.com/ja-JP/windows-8/download
●デベロッパーセンター ~ Metro スタイル アプリ
http://msdn.microsoft.com/ja-jp/windows/apps/
●MSP フェローシップ募集ページ
http://msdn.microsoft.com/ja-jp/academic/hh455211
●イマジンカップ世界大会 学生レポーター募集!
http://blogs.msdn.com/b/microsoft_japan_academic/archive/2012/04/24/msp-japan-social-media-member.aspx

蛇足:僕はこう思ったッス
Windows 8 はタブレット端末を想定した機能が多数用意されているが、既存のWindows アプリはもちろん、Classicとして旧デザインのデスクトップを(かなり快適に)使用することもできる。昨日の記事で、「Windows 8が最大のアプリマーケットになる」ということに「えっ!」と思った人もいるようだが、いわずもがなWindowsがインストールされた端末の規模は大きい。それと、Metro スタイル アプリは、シンプルさを追求する指針が明示されており、特に業務等における一般利用者にとってのメリットは大きいわけで、そう考えると、既存のWindowsユーザーが、Windows 8 にシフトすることのインパクトはすごいと思う。

著者プロフィール:TechWave副編集長・イマジニア 増田(maskin)真樹
 8才でプログラマ、12才で起業。18才でライター。日米のIT/ネットをあれこれ見つつ、生み伝えることを生業として今ここに。1990年代はソフト/ハード開発&マーケティング→週刊アスキーなど多数のIT関連媒体で雑誌ライターとして疾走後、シリコンバレーでベンチャー起業に参画。帰国後、ネットエイジ等で複数のスタートアップに関与。関心空間、@cosme、ニフティやソニーなどのブログ&SNS国内展開に広く関与。坂本龍一氏などが参加するプロジェクトのブログ立ち上げなどを主導。 Rick Smolanの24hours in CyberSpaceの数少ない日本人被写体として現MITメディアラボ所長 伊藤穣一氏らと出演。大手携帯キャリア公式ニュースサイト編集デスク。TechWaveでは創出支援に注力。

メール maskin(at)metamix.com | 書籍情報・Twitter @maskinChatWorkcoffee-meeting 詳しいプロフィールはこちら



PAGE TOP
More in News
Google Driveスタート 類似サービスいろいろあるし、どこを利用しようかなあ【湯川】

価値観の変化を受けた企業のあり方、個人の生き方とは TechWave塾10期生募集【湯川】
アプリとアプリの連携がWindows 8 の力 #wddjp @maskin

Close