livedoor Reader と GMail に見る、大量のチェックボックス処理 UI における革新的工夫について

HTML には、複数の項目を選択する UI として、たとえばチェックボックスがあります。こんなやつですね

好きなメンバを選択してください(複数可)

梅田えりか

矢島舞美

村上愛

中島早貴

鈴木愛理

岡井千聖

萩原舞

有原栞菜

これぐらいの量だったら、選択するにせよ解除するにせよ、まぁたいしたことはないかもしれませんが、もし、選択項目が数十あるいは数百あったらどうでしょうか。激しくめんどくさいですよね。 世界的に優れたフィードリーダである livedoor Reader は、フィードリーダとしての使い勝手は当然として、そんなところにも実は気を配っていたりします。 たとえば、LDR のおすすめフィード登録画面「アルファブロガーズ」を見てみると(livedoor ID でログインする必要があります)、アルファブロガーさんのブログが数十個表示されるのですが、これを選択または解除するに際して、チェックボックスを一個ずつぽちぽちクリックする必要はありません。ブログ名の右方向に広がる空白のあたりをマウスでさーっと撫でてみると、それだけでスムーズに選択・解除が反転していきます。 他方では、GMail の工夫も見逃すことができません。GMail において大量のチェックボックスを処理する場合には、一般的なファイラで採用されているのと同様の、Shift クリックによる範囲指定選択・解除ができます。これで、大量のメールを間単に、素早くさばくことができます。 このように、チェックボックスのような、古くからある UI ひとつひとつをないがしろにすることなく工夫をこらすことで、ユーザエクスペリエンスを激烈に高めることが可能です。みなさんも同様の UI を作成する場合には、是非参考にしてみてはいかがでしょうか。

ヤコブ・ニールセンのAlertbox -そのデザイン、間違ってます-

• Jakob Nielsen、 舩井 淳、 奥泉 直子、 川崎 幹人
• RBB PRESS
• 2006-07-12
• ￥ 2,730
• Book

Web情報アーキテクチャ―最適なサイト構築のための論理的アプローチ

• ルイス ローゼンフェルド、 ピーター モービル、 Louis Rosenfeld、 Peter Morville、 篠原 稔和、 ソシオメディア
• オライリージャパン
• 2003-08
• ￥ 4,620
• Book