Facebookの友達アイコンに隠れたデザインルールとガイドライン変更までの舞台裏

この記事はFacebookのデザインマネージャーCaitlin Winner氏のブログ記事を公式に許可をいただき翻訳したものです。

Facebook本社はすばらしい所です。スナックは無料ですし、いつも太陽の光が降り注ぎ、誰もが善意にあふれています。入社して最初の1週間で、私は世界を本気でより良い場所にしようと頑張っている何百人もの人に出会いました。同時に、この新しい職場の常識に慣れて、幅広い視野を失ってしまうのもきっと容易なのだろうと思いました。私は一人でこっそりと、何に対しても不満を言わないこと、そしてその決意を忘れないことを誓いました。「常に謙虚であれ」と書かれたポスターを机の前に貼りました。

残念なことに、Facebookのデザイナーとして在籍し始めてからまもなく、会社のデザインキットに関して動揺する出来事が起こりました。そのPhotoshopファイルには、人を表す二つのベクターファイルが入っていました。男性のアイコンはツンツンした髪型の部分以外は左右対象だったのですが、女性には肩に小さな切れ込みがありました。ちょっと調べてみた結果、その切れ込みは、「友達」アイコンを作るときに男性のアイコンを女性の前に配置する場所とぴったり重なることが分かりました。悪気はないのだろうと思いました。ただ配慮に欠けていたのだろうと。ですが、がっしりとした両肩をもつ女性として、この切れ込みに傷つきました。

この不満をデザイナーの友人に話したところ、彼女は私の隣に貼られたポスターを指さしました。ポスターには「Facebookの問題は、すべての人に関わる問題だ」と書かれてあります。女性のアイコンには肩が必要でした。私は肩を書き足しました。こうして、何ヶ月にも及ぶ果てしないアイコンデザインへの取り組みが始まったのでした。

女性の肩を直したあとは、ダース・ベイダーのようなヘルメットを取って、意味のあるヘアスタイルを与えたくなりました。ポニーテールはちょっと若々しすぎるかもしれませんが、垢抜けた感じがでます。ですが、32ピクセルのファイルでは、ポニーテールをつけると髪型というよりも小動物のような感じになりました。ロングヘアーや豊かな髪の毛もまた、小さいサイズでは違いが分かりにくかったので、最終的にはより形がはっきりしたボブに落ち着きました。

新しくなった女性とは対象的に、これまでの男性のアイコンは真面目で時代遅れに見えました。なので、男性のヘアスタイルをもっとやわらかくして、肩につながる曲線を足しました。男性のデザインを修正している中で、Facbeookで一人の人間のアイコンが使われるケースの多くが「友達になる」のようなアクションを表すために使われていることが分かりました。友達申請のすべてを男性のアイコンで表すことは、フェアではないし、ましてや正確でもありません。なので、ジェンダーのアイコンが不適切なケースを想定して、こんなシルエットを描きました。

次に、サイズと「友達アイコン」における女性のシルエットの位置に関わることに取り掛かりました。女性として、女子大学で学んだ者として、現在のアイコンのシンボルの意味を読み取ろうとしないわけにはいきませんでした。女性は文字通り男性の陰に隠れていました。積極的に前に出るポジションには置かれていなかったのです。

当初の考えは、二つのシルエットを描くというものでした。同じサイズの二人の人間を描いて、誰が前なのかが分からないようにするというものです。何十回もイテレーションを繰り返しても、結局二つの頭を持つ神話上の動物のようなアイコンにしかならず、このアプローチを断念しました。私は、少しだけ男性よりも小さなサイズの女性を男性の前に配置しました。

以前の「グループ」アイコンは二人の男性と一人の女性で構成されていたのですが、女性は中央に置かれたより大きな男性の後ろに置かれていました。その代わりに、３つのそれぞれ異なるシルエットを使ったことは明らかに新鮮なことでした。そして、ここでもまた私は女性を最初に配置しました。

迅速に行動する – 友人の助けを借りながら

一抹の不安を抱えながら、私は新しいデザインファイルを保存しました。なにかの規則を破っているのではないかと心配でしたし、Facebookのデザインキットをなぜめちゃくちゃにしたんだと詰問するメッセージが、怒ったデザイナーたちから大量に寄せられるのではないかという不安が頭をよぎりました。結局そういったことは起きず、なんとも不思議なことに、新しいアイコンはFacebookと運営する多くのプラットフォーム上で使われ始めたのです。

フロントエンドエンジニアのマット・サインは、この新しい男女のシルエットをデスクトップ上の社員向けサイトに追加し、それから何気なく全世界に届けました。プロダクトマネージャーのレクシ・ロスは、プロファイル作成の際の男女のジェンダー選択に必要とされていた変更を加え、それぞれの選択にシルエットを追加しました。アイコンマスターとして知られるブライアン・フリックは約半年前にデザインキットを全体的に更新したのですが、その取り組みを再開して多くの新しいアイコンを追加しました。気軽にこの新しい男女のアイコンを取り入れてくれました。

ブライアン・フリックによる「友達」アイコン

結局のところ、こうした個人が立ち上げるプロジェクトというのはFacebookでは珍しいものではないことが分かりました。昨年、デザイナーのジュリアン・リャンはエンジニアのブライアン・ジューとともに、地球のもう片側にいるアメリカ人以外の人々に向けて、正確な世界の見え方を通知アイコンを通じて提供しました。それ以来、アジアが中心に置かれた地球アイコンも追加されました。

ブライアン・フリックによる「地球」アイコン

シンボルは重要

このプロジェクトに取り組んだ結果、私はシンボルに大きな注意を払うようになりました。全てのアイコンの是非を考えるようになりました。もっとも身近に感じられるアイコンは特にです。たとえば、ブリーフケースは「仕事」を表す上で最も良いシンボルでしょうか？　誰が、どの場所でブリーフケースを持ち歩いているでしょうか。「仕事」をシンボルにする別の方法はあるのか。あるとしたら、それらのアイコンは地球上の大多数の人にとってどのような感情を呼び起こすものなのか。

私がFacebookに勤務した初日に感じた善意は、すべて本物でした。私たちは皆、Facebookをできるだけ最高の場所にする、不満を述べるのではなく行動するカルチャーをもつ、アイデアがオーガニックに広がるような会社に育てる、そして主要な機能から小さなアイコンに至るまで、全ての人に密接したプラットフォームを築くことを願っています。

新しくするべきアイコンは他にもあると思いますか？ ぜひ知りたいので、お知らせください。

原文： How We Changed the Facebook Friends Icon
翻訳者： 佐藤ゆき