スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

フラットデザインとは何か

フラットデザインとは何か

iOS7のUIには俗にいう「フラットデザイン」が採用された。Win8しかりAndroidしかり、いま流行のやつ。
では、フラットデザインとはいったい何だろうか。


ネットを巡ってフラットデザインについて述べられた記事を読むと、

立体感が無くフラットで
アイコンは抽象的で
モダンなもの

というがフラットデザインの条件らしい。

この前Appleをクビになったスコットさんは、スキュアモーフィズムという概念を押し進めていた。写実性を追求したデザインということらしく、フラットデザインとは逆の発想である。
この二つの概念の争いは、モダンデザインvs写実デザインの争いにも見立てられることもある。
「デザインとは機能である」という真理に従えば、デザインの芸術的側面はここでは捨てておいたほうがいい。
だから、もう少し具体的な話をする。

AppleのUIはMacから始まった。少し前にこのブログで ヒューマンインターフェイスデザインの原則(1987) - Macintosh Human Interface Guidelines を載せたけど、その冒頭にくるのは「実世界のメタファー(見立て)」であり、インターフェイスの諸機能を実世界に存在するもので説明するやり方だ。つまり

書類を入れるものはフォルダの形をしている
押せる箇所はボタンの形をしている
画面は"机の上"であり、書類やフォルダを置ける

という、現在のGUIの基本ともいえるアプローチである。

対して、フラットデザインとはどういうアプローチなのか。それは「印刷物のデザイン」である。
例えば、本や雑誌を手に取ってみて見てみればいい。種類は例えば情報誌や図鑑のようなものが分かりやすくて良いだろう。
その誌面にスキュアモーフィズムはあるだろうか。目次や引用などのナビゲーションは機械的なボタンやスイッチなどの形をしているだろうか。
恐らくそうはなっていない。もっと抽象的で、カラフルで、立体感の無い、"フラットデザイン" で構成されているはずだ。

フラットデザインへの移行というのは、デザイン言語の根幹が「実世界のメタファー(見立て)」から「印刷デザイン」に変わるということ。見た目だけではなく、パラダイムが変わるのだ。
「印刷デザイン」が軸になるということは、組版やタイポグラフィの技法 -- 余白の大きさ、空間配置、文字のサイズやスタイル、抽象的且つ平面的なスタイル -- などが、デザインノウハウにおいて大きな役割を占めることを意味する。

フラットデザインがGUIとして振る舞えるようになった理由には、Webの存在がある。
Webは始まった当初から印刷デザインを模倣していた。というより、見出しがあり、本文があり、図や写真がある「様々な要素の複合物」としてWebを定義した場合、その方面で遥かに歴史のある印刷物を模倣する形になるのは当然だろう。
そもそも、Webを記述するhtmlは「 "文書" の機能を拡張する」という目的で生まれてきた。ページをめくるだけでなく、特定の語句を"ポイント"することでジャンプするような "操作インターフェイス" を持った誌面を実現するものとして。
誌面がインターフェイスを持てるのなら、印刷デザインをそのままコンピュータのインターフェイスデザインに用いるという発想があってもいい。Webブラウザで多くの時間を費やすのが当たり前になった現在なら特にそうだろう。


フラットデザインを推し進めることによる不安はある。
まず、機能のカバー範囲でいえば「実世界のメタファー」>「印刷デザイン」なので、フラットデザインでカバーしきれない分野の扱いが難しくなる。従来の方式に留まる選択も時には必要になる。
次に、最初はユーザーがついてこれない。これまでずっとGUIは「実世界のメタファー」を軸としていて、その軸が変わってしまうのだから確実に混乱が起きる。
そして、フラットデザイン = 印刷デザインとするならば、開発者は印刷デザインの理解が必要になる。iOS7のHuman Interface Guidelines でもデザイン原則についてひどく抽象的な説明しかされておらず、印刷デザインのノウハウを取り込みきれない質の低いフラットデザインが横行するだろう。

comment

管理者にだけメッセージを送る

プロフィール

waverider

Author:waverider

ああ、沖縄に行きたい…

最近の記事
カテゴリー
最近のトラックバック
ブログ内検索
RSSフィード
リンク
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。