じりじりと Metro Design について考えていこう

そろそろ Metro Design について考えてみよう | Moonmile Solutions Blog
http://www.moonmile.net/blog/archives/3660

の続きです。

Metro スタイル アプリの構築方法を学ぶ
http://msdn.microsoft.com/library/windows/apps/

なところで、日本語版は「Metro スタイル」になっていますが、まあ「Windows ストア」スタイルでも何でもよいのです。ここに書いている話は「話半分に」聞いておかないと、後でドハマりいたしまっせ、って具合なのです。「ユーザーの価値が～」というのはさておき（自己言及すれば、「Windows 8 のユーザーに対する価値は～」という縛りなんですから）、Metro Design について引き続き考えていきます。

■まずは、Metor スタイル ガイドラインの読み方を

これは、Microsoft社の悪いところですが、本来の目的を忘れて手段に興じてしまうところがあります。Oracle のドキュメント群は昔から非常に少なくて辟易するものですが、あれはあれで Oracle の戦略としては重要なのです。「ガイドライン」には、先の記事に書いた通り「先駆者」を模倣する側面があるので、そのあたりを殺ぎ落として読むのがベターです。

私の場合、「組織」から離れて長いので、このあたりが見えるのですが「組織」に入っている人は、意外と見えにくいものなので注意が必要ってことで。まぁ、「組織」に組み込まれている人はそれはそれでいいんですが、フリーな人が、これにハマるとちょっとアレかなと。

• ユーザーの価値、アプリの価値に言及したものは、読み飛ばし。
• これは、開発者/開発する経営者が決めるものですから。
• デザインの価値も読み飛ばし。
• タイポグラフィとか、色デザインの本に直接あたったほうが良いです。
• あと、iPad とかを使ってみるとか。
• 中世のイコンなんかを調べると良いです。
• コンテンツ操作のなんちゃらの話も読み飛ばし。
• コンテンツの質や量によって変わります。また、読者によっても。
• ターゲットの「引っ掛け」具合によっても変わります。
• Metro アプリの場合、全画面が普通（単一画面）になるので、独自操作を作ってもそれほど「違和感」はありません。
• 設計ガイダンス、UI の作り方
• これは、アラン・クーパーの本とか、D.A.ノーマンの本とか読んだほうがいいです。
• 読んだ上で、戻ってくるならば良いかと。
• デザインルールは「審査が通る」程度でOKです。そのうちぐだぐだになるのを期待してます。
• よく分からない場合は、先行する iPhone アプリの真似をするのが良いです。
• サスペンドからの復帰に関して
• これは「考慮不足」なので、読み飛ばして OK です。
• おそらく、きちんと実装できるアプリケーションは現れません。

ってな感じで「読み飛ばし」て良いところがたくさんあります。

開発者/経営者として重要なところは、

• Metro スタイル アプリの開発 これの UI の作成 (C#/C++/VB) 以降
• UI のアニメーション化 (JavaScript と HTML を使った Metro スタイル アプリ) あたりの、派手な演出ですね。クローム鍍金が重要です。
• タイル、バッジ、通知 (Metro スタイル アプリ) このあたりの仕掛け
• アプリの販売の 開始する前に のところですね。どうやって登録するのか、収益するのかが重要です。「手段」以外は読み飛ばしてOKです。

あとは、ざっと流し読みをしておけば OK です。某所の本は、この主旨で目次をまとめてあります。

■ Metro Design の原点に戻ると

実は、先に書いた通り「読みやすい」かどうかは、「読みやすくさせるかどうか」はコンテンツの種類に変わっていきます。D.A.ノーマンは、航空機についているTV操作について、「子供がゲームをしたいと覆ったら、どんな複雑な操作でもこなしてゲームに辿り着こうとする」訳で、多少の複雑さはものもしません。しかし大人が何かの商品を買おうと思ったら「ちょっと複雑な操作をするぐらいだったら諦める」のです。このあたり、ゲームと商品販売が大きく違うし、読書にしても実用書と小説の場合は違うし、漫画だって流し読みしたい場合と、じっくりと考えながら読みたい場合もあるので、色々あるのです。だから、商品ごと本ごとに「パッケージ/装丁」がある訳で、それに惹かれるなり、その品物のデザインなりを重視して「購入する」に至る、あるいは「利用する」に至るわけですよ。「利用する」と「購入する」をあえて分けているのは、「購入するけど利用しない」パターンもあるからですね。現在のような経済の場合は、このパターンが一番「販売効率がよい」ことになっています。

で、PC タブレットや、各種のスマートフォンの場合は、外側のパッケージ部分は一様になってしまいます。もちろん、機種自体はユーザーが選べるのですが、アプリは機種の外観を変えることを（いまのところは）できませんよね。同じアプリを作っても、iPhone で動かす場合と、Windows 8 タブレットで動かす場合では、違ったアプローチをしたほうが良かろう、ということが容易に想像できます。

なので、一概に Metro Design は？ってことになると幅広くなってしまうので、ひとまず、電子書籍について考えてみましょう。

■ Metro Design としての書籍はどうなるのか？

先に書いた通り、電子書籍にしても色々あります。実用書、漫画、ライトノベル、コンピュータ本、占い本、株式投資本、絵本などなど。実のところ、大江健三郎の本とか、カフカの本を iPhone で読む気にはりませんし、IT 業者としてそれらの本を「電子書籍化」したとしても儲かりません。ええ、青空文庫的に「なんとか読める」ようにはなるのですが、いまのところ若い人以外は真面目に読むことはしないでしょう。一部の本好きのマニアだけです。先行き、教科書の電子化などが進んで、画面自体に慣れていけば、もうちょっと違う感じになると思うのですが、そうなると「本」自体のスタイルが変わってしまうので、ここでは「今、電子書籍化できるもの」かつ「収益が見込めるもの」を対象としておきます。

そうなると、いわゆる「読み捨て」のビジネス書は、電子書籍の筆頭にあがってきます。１回読んでBOOK OFF に売り飛ばすか（あるいは、BOOK OFF から買ってくるか）という感じで、数年後に読み直すことはありません。ならば、本を家においておくよりも（最近は本棚のない家庭があるので）、通勤途中にさっくりとダウンロードして、さっくりと読み捨てるというスタイルで「読める」ほうがよいわけです。

なので、ビジネス書を読むときのスタイルとして、

• さっくりとダウンロードできる容量にする。
• 文章をぱらぱらと捲れるほうがよい。
• できれば、ページ数をなんとなく覚えておくほうがよい。
• ラインマーカーをつかいたい。
• 読み終わったら関連書籍を購入、という購入チェーンが望ましい

のパターンが良いのです。電車を待っているときにダウンロードが終わる容量と言えば、10M弱位でしょうか。このぐらいだと、図版を入れると重くなる（白黒ならば大丈夫か？）ので、できる限り文章だけで済ませます。大体の新書は、2週間ぐらいで書きあげてしまうので、図版は全くないか、チープなものしかないのが普通です。ページ数は、既存の新書よりも少なくて構いません。iPhone の画面は小さいので、文章が少なくてもページ数が増えたように見えます。ダウンロードさせる時には、躊躇する値段（1,000円とか）は避けたほうがよいです。500円ぐらいの漫画の単行本ぐらいの値段がいいですね。漫画雑誌の値段 300円位でもいいと思います。要は、「読み捨て」ができるスタイルにします。長い文章であれば、コストダウンを目的に分冊してしまいます。

文章の脇は、新書と同じように多めに空けておきます。文字を変更できると良い、と思われれかもしれませんが、変更できなくても構いません。その書籍にマッチしたフォントだけを指定すれば良いのです。ページ数は、読んでいるときに左下あたりにでかでかと表示して構いません。小説とは違って、読み飛ばし、斜め読みが普通なので「ああ、あれはたしかここに」というなんとなく覚えるマーカーがあれば十分です。

巷の電子書籍リーダーではマーカーの使い方が駄目です。まさしく蛍光ペンで、適当なところに○なり線なりを指で付けられるようにします。プログラムとしては、レイアウトは変わらないのですから、ページ数と位置情報だけつけておけばOＫです。

ツイッターなりフェイスブックなりに投稿する機能は必須です。連携するだけでOKです。「○○本の何ページ目」な形で投稿できるとなお良いでしょう。他の人に購入を諭すのではなくて「興味」を持たせるのが、広告業界の基本ですよね。

読み終わったら、関連書籍にジャンプさせましょう。続きものにして別ジャンルに飛んでもよいです。しかし、やり過ぎてはいけません、あくまで読者が「うーん、今度買うとしたらこれかな？」という感じで amazon のほしいもの、を集める機能があればベターです。これは他の機能と連携しても OK です。

…と、こんな風に「Metro Design」は考えるわけです。地下鉄のデザインは、地下鉄を利用する人の立場になって考える、というスタイルでもありますが、同時に、自然発生的にでてきたものを極力削り落として、裏の目的を果たさせる（道路標識は、事故を減らすという大きな理由がありますよね）のです。そのなかで出てきた、グリッドスタイルであったり、Metro 的なデザインであったりするので、進化論とか、自然淘汰とかの話になりますね。ええ、天地創造の方には理解されにくいかもしれませんが。

こういう風に考えていくとですね、グリッドの幅とか、フォントの大きさとかは「パターン」でしかないことが分かります。「某ガイドライン」では色々後付をしていますが、要は進化により帰着したデザインをシミュレートしたデザイン、ってことになるのです。それは、営業的には「先駆的なデザイン」を主張することになるのですが…まあ、そのあたりは Microsoft の戦略ということで、大目にみましょう。このあたりの話は、C.アレグザンダーの「パタン・ランゲージ」を読むと分かります。オブジェクト指向、GoF として有名になった「パターン」ですが、原本に立ち返ってみると、その後のパターンがポストでしかないことを分かります。

ちなみに言うと、この電子書籍のパターンは「ビジネス書」の場合にあてはまります。漫画や、子供をあやすための電子絵本の場合は別なアプローチになります。