こんにちは！福岡でホームページ制作を行なうシンス株式会社の越水です。
海外のデザイナーの間でFacebookのビジュアル・アイデンティティに関する以下の記事が話題になっています。
Facebook Visual Identity | Office of Ben Barry
このブログはニューヨークのブルックリンに拠点を置くデザイン事務所のもので、上記の記事には2012年〜2013年にかけて行われたFacebookのビジュアル・アイデンティティ構築の概要がまとめられており、マーケティングやCIに関わるデザイナーであれば必読の内容になっています。
桁外れのスピードで成長を遂げたFacebook。混沌としたデザイン環境
今や私たちのコミュニケーションのインフラとなりつつあるFacebook。
その圧倒的な成長スピードの最中で次々と生み出されるサービスや社内ツール、それらと同時に作り出されるアイコンやロゴなどのデザインは統一的な管理を超えたまま次々に増えていました。
紹介した記事では筆者がそのなかで奮闘し、どのようにFacebookに使われるデザイン要素をまとめあげてビジュアル・アイデンティティを生み出していったかが描かれています。
シンプルさが生み出す力強さと柔軟性
例えばファビコンひとつを取ってもこの通りで、一応オフィシャルなファビコンはあったにもかかわらず各々がデザインに手を加えて使用するのでまさにカオス状態。
Via : by Office of Ben Barry
最も多く人目につくワードマークですらこの状況なので、当時のビジュアル・アイデンティティはかなり断片化してしまっていたことが伺えます。
これらの統一感を図ろうと試行錯誤されたのが現在目にすることができるいわゆる「f」マークです。「f」の形を整え、ボトムのハイライトを排除してシンプルなワンカラーのものが考案されました。
新たなワードマークはよりシンプルで力強いうえに、様々なコンテクストでも柔軟に使用できることが出来るようになりました。ビジュアル・アイデンティティ構築への第一歩です。
Via : by Office of Ben Barry
角の丸み具合にもこだわった様子です。
極力、デフォルトの角丸を使っていたが、iOSなど特定のインターフェースやコンテクストにおいては専用に丸みをもたせたりアイコンのスタイル調整したものをデザインしたと述べられています。
デザインを整理し洗練したシンプルなものへ再構築することで、どこでFacebookのアイコンを目にしても統一したイメージを抱かせるパワフルなデザインシステムが生まれたことがわかります。
ビジュアル要素をモジュール化
Facebookのサービス充実化に伴い、次々に利用できるようになったサブブランドもカオス化しており、それぞれのサービスや機能のデザインが統一感を持つことなく、以下の様な状況に陥っていました。
Via : by Office of Ben Barry
まず設定されたルールは「ファビコンをサブブランドのアイコンの中に使用しない」ということです。このひとつの簡単なルールは何百の細かなルールを設定するよりわかりやすく、適用しやすいものでした。
これ以降、「f」のワードマークとタイプフェイス、そしてサブブランドアイコンはそれぞれ分離した要素として並べてデザインされるようになり、より汎用的に使用できるようになりました。
サブブランドのアイコンはワンカラーのものからフルカラーのイラスト風バージョンまで、水平的にデザインレベルの統一が容易になり、管理もしやすくなりました。
まとめ
記事の中ではここで紹介した内容よりも細かな資料が見ることができますのでデザイナーの方にはとても参考になると思います。
英語で書かれた記事ですが、あのFacebookのビジュアル・アイデンティティが強固になっていく過程がケーススタディとして学べるとあれば時間をかけて読んでみる価値はあるはずです。
Appleの広告を手がけた方が書いた「Think Simple ―アップルを生みだす熱狂的哲学」でも述べられていた、「シンプルであること」が持つパワフルな影響力について考えさせられました。デザインには人々の意識を強く束ねるパワーがあるのですね。
参考URL
Facebook Visual Identity | Office of Ben Barry
SNSやブログを活用してお店や会社のファンを獲得するWebマーケティングのご要望にお応えします。
