atelier:mitsuba

i love UI/UX, Blend, XAML, Behavior, P5, oF, Web, Tangible Bits and Physical computing. なにかあればお気軽にご連絡ください。atelier@c-mitsuba.com

その6:Metro UIについて

だいたい、過去記事を発掘したので、ここからはじめます。
蜜葉が考えるMetro UIなのであしからず。。

Metro UI

まずは、Metro UIってなんだっけ?ですね。
Metroはそのまま地下鉄のことだそうです。
地下鉄の路線図は、路線によって色分けされていたり、駅に番号が振られていたり、アイコン化されていたりと、大体の国の地下鉄はどこにいっても、路線図さえみれば迷わない(はず!?)のようなデザインを目指しているそうです。

でもって、MSがMetroデザインのコンセプトPDFを公開しています。
http://go.microsoft.com/fwlink/?LinkID=189338
基本的にはシンプルなアイコンで抽象化されています。
特に簡単なアイコンはフレームだけの円でくくられていたりしますね。

もしくは、ベタ塗りの四角形に大きなテキストが特徴ですね。

こうして見ると大体のものは、白、黒、メインカラーの塗りつぶしでできてますね。
比較的大きく分かりやすくデザインされているので、オブジェクト間の余白も溝を作るぐらいに贅沢にとりましょう。


次はタイルについてかければいいなぁ