アバター

定義

アバターは、あるユーザーや項目を表す小さな画像です。プロフィール写真がいちばん 身近な例で、一覧やコメント、チャット画面で「誰が書いたのか」を一目で伝える役割を 担います。写真がなかったり読み込めなかったりする場合は、名前の頭文字をとった イニシャルや、標準の人型アイコンで代わりに埋めることで、空っぽの枠がそのまま残って ぎこちなく見えるのを防ぎます。形は円形を使うことが多く、やわらかく顔をおさめるのに 自然なので、人を表すしるしとして広く定着しました。場面によっては角を丸めた四角形を 使うこともあり、組織やチームのような対象にはロゴやシンボルを入れて、人と区別します。

なぜ重要か

アバターが大切なのは、人を名前という文字よりもずっと速く見分けられるようにして くれるからです。わたしたちは顔や色のついた小さな絵を、テキストより先に認識します。 そのため、長い一覧のなかでもアバターがあれば、目当ての人をあっという間に見つけ られます。さらにアバターは、そっけない画面に人のぬくもりを添え、そのサービスが 実際の人たちが使う場所なのだという感覚を生み出します。とりわけ共同作業ツールや ソーシャルサービスでは、誰が参加しているか、いまオンラインかといった情報を、小さな 絵ひとつに凝縮して伝えます。つまりアバターは、ユーザーが関係や状況をすばやくつかむ のを助ける、小さくても密度の高い情報の単位なのです。だからアバターをうまく扱うだけで、 画面はぐっと親しみやすく、読み取りやすくなります。

よくある間違い

• 画像の読み込み失敗に備えていないケースです。写真のアドレスが切れると、壊れた 画像のアイコンや空の四角がそのまま表に出てしまい、丁寧に作った画面の完成度が 一気に下がって見え、信頼感も一緒にくずれてしまいます。
• アバターを小さくしすぎて、顔やイニシャルが見分けられなくなるケースです。代表と なる画像がつぶれて誰なのか判別できないと、アバターを入れた意味そのものが消え、 ただ場所をふさぐ飾りとして残り、一覧を追う速さまで落としてしまいます。
• 大きさがばらばらの画像をそのまま載せて、アバターがゆがむケースです。縦横の比率が 違う写真を無理に埋めると、顔が伸びたり押しつぶされたりして、かえって人をこっけいに 見せてしまい、せっかく載せた写真の印象をそこないます。

実務のヒント

• 画像がなかったり読み込みに失敗したりしたときに見せる代わりの表示を、いつも 用意しておきましょう。名前のイニシャルや標準アイコン、人ごとに違う背景色を あわせて使うと、空きを残さず自然に埋まり、見分けもつきやすくなります。
• 何人も並べるときは、アバターを少し重ねて積み、全員を収めきれなければ最後に プラスNの形で残りの人数をまとめましょう。狭い場所でも、参加している規模が 一目で伝わります。
• オンラインかどうかといった状態は、アバターの縁に小さなリングや点を添えて表しましょう。 本体をさえぎらずに状態を足せますし、色だけで意味を伝えないよう、必要なら短い説明を そえておくと安心です。

関連概念