WISS2009

ソーシャル顔アイコン
Social Face Icon

神原 啓介

塚田 浩二∗

Summary.
ブログや SNS，ソーシャルブックマークなどのソーシャルウェブサイトの利用が進み，Web 上で人とつながりを持ちコミュニケーションをすることが増えた．Web 上での人とのつながりやコミュニケーションが増えると，優先的に見たい人の発言が埋もれてしまう問題や，複数の Web サイトを利用すると閲覧に時間と手間がかかるといった問題が起こる．そこで本研究では複数のソーシャルウェブサイトを横断しながら，重点的に見たい人の発言が埋もれず，より手軽にサイトにアクセスできるインタフェース「ソーシャル顔アイコン」を提案・試作した．ソーシャルウェブサイトの中にいる人をアイコンとしてデスクトップに置くことで人に対してより直接的にアクセスできる人間指向のインタフェースを備え，使い慣れたアイコンと同じように操作できる点が特徴である．

1

はじめに

近年の Web は人と人がつながりを持ちコミュニケーションをするソーシャルメディアとしての利用が進んでいる．Facebook1 や mixi2 などのソーシャ
ルネットワークシステム（SNS）の国内会員数は延べ 7134 万人3 となり，インターネット上の主要なメディアとして広く使われるようになった．またブ
ログや写真・動画共有サービス，ソーシャルブックマーク，マイクロブログといった個人が情報を発信・共有するサービスの普及によって，ユーザー同士がネット上でつながりを持ち，コミュニケーションする機会が増えている．これらの SNS やブログ，コミュニティサイトを利用しているユーザーは国内のインターネット利用者のうち 76.3%4 に上る．
ソーシャルウェブサイト上で人とのつながりやコミュニケーションが増えると，Web ブラウザだけで多くの人の発言や状態を見るのは難しくなる．サイト上で新しい発言などを一覧することはできるが，時間順で並べた場合，発言の多い人が目立ち，あまり発言をしない人が埋もれてしまうことが多い．
「親しい人や気に入っている人の発言を重点的に見たい」と思っても，人によって優先度を変えて見るといったことまでは通常できない．さらに，複数のソーシャ
Copyright is held by the author(s).
Keisuke Kambara, Koji Tsukada, お茶の水女子大学 お茶大アカデミックプロダクション
1
http://facebook.com/
2http://mixi.jp/3
総務省「ブログ・SNS の経済効果に関する調査研究」(2009 年 7 月 13 日公表)
http://www.soumu.go.jp/menu news/s-news/16209.html
4
インプレス R&D「インターネット白書 2009」

図 1. ソーシャル顔アイコンのコンセプトイメージ

ルウェブサイトに発言が分散すると，それを見る側は複数の Web サイトを何度も訪れる必要があり閲覧に時間と手間がかかるといった問題がある．
そこで本研究では複数のソーシャルウェブサイトを横断しながら，重点的に見たい人の発言が埋もれることなく，より手軽にソーシャルウェブサイトにアクセスできるインタフェース「ソーシャル顔アイコン」を提案・試作した．

∗2

ソーシャル顔アイコン

ソーシャル顔アイコンとは SNS やブログなどのソーシャルウェブサイト上にいる人を顔アイコンとしてデスクトップに置くというものである（図 1,2）．顔アイコンごとにその人の最新記事やステータ
ス，メッセージなどが表示され，アイコンをダブルクリックするとソーシャルウェブサイト内にあるそWISS 2009の人のページを開いて見ることができる．また，顔アイコンを動かしてくっつけることで手軽にアイコンを管理をできる．
以降ではソーシャル顔アイコンのコンセプトおよび機能について述べる．

2.1

コンセプト

ソーシャル顔アイコンのコンセプトは「ソーシャルウェブサイトのための人間指向アイコン」である．
ソーシャルウェブサイトの中の「人」に着目し，普段使い慣れたデスクトップアイコンを活用することでこれらのサイトや人に対して手軽にアクセスするインタフェースを考案した．

2.1.1

図 3. 置くだけアイコン作成

人間指向

ソーシャルウェブサイトではいずれも個人ごとのページが存在するように，「人」が主要な構成要素となっている．そこでソーシャル顔アイコンでは 1 人につき 1 アイコンとすることで，人に対してより直接的にアクセスできるようにした．さらに人を基準とすることで，複数のソーシャルウェブサイトを横断して同一人物や関連する人などをまとめることができる．このようにソーシャル顔アイコンは「人間指向」のインタフェースが特徴となっている．

2.1.2

アイコン型インタフェース

ソーシャル顔アイコンは「ドラッグ＆ドロップで配置」「ダブルクリックで開く」といった従来のファイルアイコンと同じような操作体系で使えるようにした．このようなアイコン型のインタフェースにすることで，多くの人が既に慣れた操作方法で使うことができ，既存のファイルアイコンなどに混じってデスクトップに置かれていても違和感が少ない．またアイコンはポップアップバルーンのように目立ちすぎないため他の作業を邪魔しないのも特徴である．
アイコンの画像にはソーシャルウェブサイトで使用されている顔写真や似顔絵，アバターを用いることで，デスクトップにアイコンがたくさん並んだ時

図 4. チラ見アイコンでも見分けやすくした．

2.2

機能

ソーシャル顔アイコンは「置くだけアイコン作成」「チラ見アイコン」「くっつきアイコン」「人間 Dock」という 4 つの特徴的な機能を持つ．

2.2.1

置くだけアイコン作成

新しくアイコンを作成するには，友達一覧ウィン
ドウを開き，追加したい人をデスクトップにドラッグ＆ドロップする（図 3）．友達一覧ウィンドウにはFacebook，Twitter5 ，Friendfeed6 ，Gmail7 などでつながりのある人が表示され，ブログなどの RSS を独自に追加することもできる．アイコンの画像や名前は上記のサイトのものを自動で取得するため，ドラッグ＆ドロップだけで簡単に人のアイコンを作ることができる．

2.2.2

チラ見アイコン

図 4 左のようにアイコン下部にはその人の最新の発言や状態などが表示される．通常，読めるのは一
5

http://twitter.com/
http://friendfeed.com/
7
http://mail.google.com/mail6

図 2. デスクトップに置かれたソーシャル顔アイコン

Social Face Icon

2.2.4

人間 Dock

Mac OS X の Dock のように画面の端にアイコンを並べられる領域「人間 Dock」を設けた（図 6）．
デスクトップにアイコンを置くとウィンドウの下に隠れてしまうが，アイコンを人間 Dock にドラッグ＆ドロップして置くことでウィンドウが開いた状態でも常時または素早く最前面にアイコンを表示することができる．頻繁に見たいアイコンは人間 Dockに置くと良い．
また，Dock 内の友達一覧ボタンから図 3 の友達一覧ウィンドウを開くことができる．

3

図 5. くっつきアイコン部だけ（20 文字程度）だが，アイコンをたくさん並べた状態でも更新状況や人の様子を一覧できる．ア
イコンを選択またはマウスホバーすると全文を読むことができ，コンテキストメニューから過去の発言を見ることもできる．さらに続きを読みたいときはダブルクリックして Web ページを開く．

チラ見アイコン機能やくっつきアイコン機能のよ
うに通常のアイコンではできない操作を実現するた
め，ソーシャル顔アイコンでは透過ウィンドウに仮想のアイコンを描画している．この透過ウィンドウを常時他のウィンドウの背面に置くことで，デスクトップ上に顔アイコンが置かれているように見える．
この実装上の制約によりフォルダに入れるといった通常のアイコンと完全に同じ操作はできないものの，実用上はファイルアイコンやフォルダと混ざった状態でも問題なく使うことができる．
顔アイコンに使用する画像や記事，ステータス，メッセージなどは Twitter や Facebook など各サービスで提供されている API を通じて取得している．
これらは Adobe AIR で実装しており，AdobeAIR ランタイムが動作する環境（Windows，MacOS X，Linux）で利用できる．

42.2.3

くっつきアイコン

アイコンをドラッグ＆ドロップして他のアイコンにくっつけることで，複数のアイコンをまとめることができる（図 5）．さらにまとめたアイコンは「重ねボタン」を押すことで，Mander ら [3] の提案する Pile Metaphor のようにアイコンを重ねて小さく表示できる．アイコンを重ねた状態では，それらのアイコンの中で最新の記事やメッセージが表示される．
くっつきアイコン機能は以下のような用途を想定している．

• 同一人物が複数のサービスを使っている場合，それらをまとめて 1 人 1 アイコンにする．

実装

議論

本研究は試作段階であり正式な評価実験は行っていないが，試作したソーシャル顔アイコンを我々の研究室で使用した．
まず，ソーシャル顔アイコンを置くことで，それまであまり見なかったサイトも見るようになった．自分自身が投稿しないサイトや，知人が少ないサイトは訪れて見る動機が薄かったが，顔アイコンであればサービスの利用頻度に関わらず人単位で見ることができるため，普段あまり利用しないサイトの情報も知ることができるようになった．ソーシャルウェブ
サイトを横断して，より手軽に見られるようになった効果と言える．

• 関連する人たちのアイコンをグループ化する．
• 優先度の低い人たちは重ねて小さく表示しておき，見たいときだけ展開する．
図 6. 人間 DockWISS 2009

利用者の一人から「Twitter で今日会う予定の知人の様子を調べようとしたが，発言数の多すぎる人がいてなかなか見つからなかった．顔アイコンだとすぐ分かった」というコメントがあった．これは「見たい人が埋もれて見えない」という問題を解決した例と言える．
くっつきアイコンを多用する傾向が見られた．用途としては，「同じ職場の人をグループ化してまとめる」「頻繁に見る人をまとめる」「発言数の多い Bot（プログラムによる自動投稿）をまとめる」といった分類用途が多かった．ソーシャルウェブサイト上にいる人の分類は一定の需要があると考えられる．また，くっつけたアイコンはまとめて移動できるためアイコンが増えたときに整理しやすいことも理由として考えられる．
利用者からあがった要望として「発言数に応じてアイコンが変化してほしい」というものがあった．
例えば最近更新があった人や，逆に更新がない人をアイコンで視覚化することで，見分けられるようになると考えられる．
また「発言に対して直接返信したい」という要望もあった．現在の実装ではアイコンをダブルクリッ
クして一度 Web サイトを開いてから，投稿または返信画面に行く必要がある．アイコンの右クリック
メニューなどから「投稿」または「返信」を選べるようにすることで，より直接的に相手にメッセージを送れると考えられる．

5

関連研究

顔アイコン [5] では，顔の形をしたアイコンにファイルをドラッグ＆ドロップすることで，メールにファイルを添付する操作に比べて手軽で分かりやすいファイル転送を実現した．ソーシャル顔アイコンでは，アイコン型インタフェースを用いる点や，人ごとにアイコンを用意する人間指向のインタフェースを参考にし，複数のソーシャルウェブサイトを横断して人単位で手軽にアクセスできるインタフェースを実現した．
Web ブラウザを起動せずデスクトップ上で Web
ページを見るソフトウェアとしては，Microsoft のActiveDesktop や Apple の Web Clip ウィジェット
[2] がある．また Windows Vista のサイドバーガ
ジェットや Mac OS X の Dashboard といったデスクトップウィジェットを用いて Web の情報をデスクトップに表示することができる．ソーシャル顔アイ
コンはこれらの技術に近いが，Web の中でもソーシャルウェブサイトを対象にすることで顔アイコン型インタフェースを実現し，利便性を高めた．
Web アプリケーションをデスクトップアプリケーションのように起動して使うソフトウェアとして
Mozilla Prism[1] があり，Web アプリケーションのアイコンをデスクトップに置くことができる．ソー

シャル顔アイコンでは Web アプリケーションではなくその中にいる人のアイコンをデスクトップに置くことで直接その人のページを開くことができるほか，人のアイコンに最新記事などの更新情報を表示できる点が異なる．
ブログやソーシャルブックマークなどの記事を自動的に収集・一覧することで，Web 閲覧の負担を減らすツールとして RSS リーダーがある．RSS リー
ダーは最新記事をいち早く逃さず見たいという積極的・能動的に Web を見るユーザーに向いているが，閲覧や管理に多くの操作が必要であり，できるだけ楽に使いたいユーザーには敷居が高い．
永田ら [4] は，SNS やグループウェア，メーリングリストなどを統合した Web サイト Enzin 内で，参加者のアバターアイコンをドラッグ＆ドロップして配置を変えることで情報の公開範囲を簡単に設定できるようにした．Enzin を利用しているユーザーに限られるものの，人のアイコンをドラッグ＆ドロップでまとめることにより情報を管理する人間指向のインタフェースという点でソーシャル顔アイコンと共通している．

6

まとめと今後の課題

本論文ではソーシャルウェブサイトのための人間指向アイコン「ソーシャル顔アイコン」を提案，試作した．ソーシャルウェブサイト上にいる人をアイコンとしてデスクトップに置くことで複数のソーシャ
ルウェブサイトを横断しながら，重点的に見たい人の発言が埋もれず，より手軽に人やサイトにアクセスできるインタフェースを開発した．
今後はまず利用できるソーシャルウェブサイトを増やすことを予定している．その後，ソフトウェアを一般に公開し，大勢のソーシャルウェブサイトユー
ザーにとって役に立つソフトウェアとして普及を目指す．

参考文献[1] Mozilla Prism. http://prism.mozilla.com/.
[2] Safari
WebClip.
http://www.apple.com/safari/features.html.
[3] R. Mander, G. Salomon, and Y. Y. Wong. A’Pile’ Metaphor for Supporting Casual Organization of Information. In Proceedings of theSIGCHI conference on Human factors in computing systems, pp. 627–634, 1992.
[4] 永田 周一, 安村 通晃. Enzin：情報の公開範囲を手軽に変更できるコミュニケーションツール. 情報処理学会論文誌, Vol.48, No.3, pp. 1134–1143. 情報処理学会, 2007.
[5] 高林 哲, 塚田 浩二, 増井 俊之. 顔アイコン: 手軽なファイル転送システム. インタラクション 2003
論文集, pp. 33–34. 情報処理学会, 2003.