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

• About
• Latest Posts

maskin

Editor In Chief at TechWave.jp

1990年代初頭から記者としてまた起業家としてITスタートアップ業界のハードウェアからソフトウェアの事業創出に関わる。シリコンバレーやEU等でのスタートアップを経験。日本ではネットエイジ等に所属、大手企業の新規事業創出に協力。ブログやSNS、LINEなどの誕生から普及成長までを最前線で見てきた生き字引として注目される。通信キャリアのニュースポータルの創業デスクとして数億PV事業に。世界最大IT系メディア（スペイン）の元日本編集長、World Innovation Lab(WiL)などを経て、現在、スタートアップ支援側の取り組みに注力中。

Latest posts by maskin (see all)

• 「ソラコム」がスイングバイIPOを実現、東証グロース市場上場承認 - 2024-02-22
• （更新）結果速報 LAUNCHPAD SEED#IVS2023 #IVS #IVS @IVS_Official - 2023-03-09
• 「始動 Next Innovator 2022」締め切りは9月5日（月）正午ー経産省・JETRO主催のイノベーター育成プログラム #始動2022 - 2022-09-01

[読了時間: 1分]

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

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

　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 にシフトすることのインパクトはすごいと思う。