メールの受信箱を使ったちょっとした作品のご紹介。データのビジュアライゼーションに関する論文に使われたものらしいです。 コンセプトはシンプルで、受信箱にあるメールを種類ごとにバクテリアのような生物に置き換えて表現するというもんです。迷惑メールはゲジゲジ虫に、ショッピングサイトからのメールは赤い生物、学校からのメールは青い生物で、といった具合です。 ↑ 一つ一つのメールが生物になります。 かつ、新しいメールは大きく表示され、時間が経つと小さくなる、といったような工夫もされているようです。また未読メールにはとげが付いていますが、既読のメールや返信したメールはだんだんとげがなくなっていくようにも表現されます。 ↑ 扱ったことがあるメールはだんだんやさしく表現されていきます。 サイトにはそのシミュレーションの様子が映像になっていますのでご興味のある方はどうぞ。「今日も迷惑メールばかり・・・」とうんざ

昔からあったものですが、ひさしぶりに見てみたらすっかりバージョンアップしていたのでご紹介。 ワシントン大学が開発したDENIMは手書きのインターフェースでサイトマップを作成、HTMLまで生成してくれるというすぐれものです。 タブレットPCと相性が良いですが、マウスでもぐりぐり操作可能です。 簡単な使い方を以下にご紹介。 ↑ 起動直後の画面。 ↑ 文字を書いていくとそれが一つのページとして認識されます（画面はHomeと書こうとしていますｗ）。 ↑ 複数作ったページ。リンクもドラッグで簡単に貼れます。 ↑ ページの詳細へ。左側のメニューでサイトマップレベルか、詳細ページレベルかなどが選択できます。 ↑ 円形メニューでさまざまな操作が可能。HTMLでエクスポートなどもできますよ。 ちなみにこうして作られたサイトをHTMLにしたページのサンプルは以下からどうぞ。なかなか味がありますよね・・・。 »

広大なウェブを見ていくことは世界を旅することに似ている。 そこでそのようなメタファーそのままにウェブを探検できるWalk 2 Webはどうだろう。 このサイトでは指定したサイトからリンクを辿って次々にウェブを見ていくことができる。 気に入った箇所には旗を立てたり、コメントを残すこともできる。また気になるサイトはブックマークしておくことも可能だ。 誰しも旅には心惹かれるものである。そうした旅のメタファーをどう活かすことができるか、ちょっと考えてみてもいいですね。

なんかインターフェースが気持ちいい。 CrispyShopはいわゆるショッピングサイトであるが、検索結果画面がインタラクティブで心地いい。 値段はわかりやすくグラフで示され、商品画像もずらずらとグラフの下にならべてくれる。一画面ですべて俯瞰できる点がいい。 また値段だけでなく、重さや電池の持ち時間などもグラフ化してくれる。 下に並んでいる商品画像はマウスを持っていくことで拡大してくれるし、詳細な情報も教えてくれる。 さらに値段や機能で絞り込んでいくこともできるので比較検討しながらショッピングを進めていくことができる。 シンプルな画面ながら実にさまざまな機能が詰め込まれている。ショッピングサイトを運営している方は参考にされてみてはどうだろう。

オンラインでぱらぱらめくる雑誌やカタログなどのインターフェースはよく見る。 ページのはしにマウスを持っていくとペロリとめくれる例のやつだ。 そうしたインターフェースを使うには今まで専用のソフトなどが必要だったが、format pixelではウェブ上で簡単に作れるようだ。 ちょっと自分でも作ってみたが、直感的な操作でカタログっぽいものがすぐできた。 レイアウトも柔軟に行えるのでちょっと凝ったフォトアルバムや招待状などをつくるのにいいのかもしれない。 DTP（Desk Top Publishing）もWTP（Web Top Publishing）へと変化していく時代ですかね・・・。 管理人の独り言 『おとりよせ』 個人的におとりよせがブームだ（最近ひきこもりぎみ・・・）。先日は友人に紹介してもらったチーズケーキを食してみた。 冷凍して、解凍させながら食べる、というのがなかなか新感覚でよかった。

第1回 サイト訪問者の目線で考える 現実の店舗や窓口では、目の前にいるお客が困っていればすぐにわかるし、同じトラブルが重なれば問題が起きないように施策をとる。しかし、ウェブサイトを作っているときにはお客は目の前にいないし、公開後にお客の対応をするのはウェブサーバーやスクリプトという機械だ。そのため、現実の商売では当然のように行っている接客ができない、いや忘れてしまってはいないだろうか？ 今木 智隆（株式会社ビービット） ユーザーの目線を考えることの重要性ウェブサイトがビジネスとして成功するための要素は、コンセプト・デザインから細かな言葉遣いに至るまでさまざまであるが、その中でも「ユーザーにしっかりと（見てもらうべき）情報を見てもらう」ことは常に重要な要素の1つに挙げられるだろう。 いくらデザイン（見た目）がよく、コンテンツが充実しているサイトであっても、ユーザーは驚くほどすぐにサイトから離

一時期パソコン教室の講師をやっていたことによる経験と、昨今Webサービス運用にあたって中高年層からのクレームなどを自分なりにまとめた結果として、50代以上のユーザに対するWebサービス＆PCアプリケーションのUI設計における以下10のTIPSを公開してみたいと思う。...といってもたかだか10個で収まる簡単な話ではないので、思いついたら都度追加して行きたい。 ID，ニックネームを考えさせてはいけない。半角英字開始限定は論外 IDやニックネームが思いつかない方が多い。これはシニアに限らず、ITリテラシーがそれほど高くない若年層についても言えること。作る側の人間も「過去にWebで使ったID,Nicknameは全て使っちゃダメ。何か新しいのを考えて入れてみて。」と言われると結構悩んじゃうもの。それと同じ状態に陥ると思っていただけるとわかりやすい。「IDのかわりに電話番号でもいいですよ」というと結

Webアプリケーションを開発する際に，対象ユーザーを考慮することの大切さについて見てきました。今回は，ユーザー・インタフェース（UI）設計にも，マーケティング感覚が必要なことを考えてみましょう。 UIの問題点を改善していく手順 例によって航空券の予約をサンプルに使います。下記の画面をご覧ください。このWebアプリケーションには，様々なオプションを付け加えることができます。しかし，必要最小限の情報は，「搭乗日」と「出発地」と「到着地」の三項目だけです。このUIに，どこか問題はないでしょうか。 (1)　日付部分への改良 まず注目してほしいのは，搭乗日という日付情報をユーザーにすべて入力させている点です。日付情報をユーザーにまかせ切ってしまうと，表記が統一されず，結局のところシステムでそれを補う処理が発生してしまいます（たとえ「2006/08/02」などと「例」を明記しても，半角文字と倍角文字と

ヤコブ・ニールセンのAlertbox -そのデザイン、間違ってます- (RD Books)を読んで面白いな、と思ったのは以下の指摘でした。 デザイン標準に従うということは、単にユーザに伝えたいことをより確実に伝える上で役立つという意味しかない。ドキュメントを作成するときには、自分で編み出した言葉を使うのではなく、英語の単語を使うというのと同じだ。どのようなストーリーを語るのか、デザイン要素をどうやって組み合わせるかは自分が決めるのである。 前掲書　pp105-106 ここで言う標準化されたデザイン要素というのは、「ページ左上にロゴを配置する」「ホームページに検索ボックスを設ける」「ショッピングカートへのリンクを右上に配置する」などユーザが特定の動作を期待する要素のことです。 このユーザ・インターフェイスの標準化をニールセンが推奨しているのは、 ユーザがウェブ全体を大きなひとつの資源のかたま

クレイプは7月28日，Ajaxでデスクトップのようなユーザー・インタフェースを備えたSNS（ソーシャル・ネットワーキング・サービス)「Rinca.cc」のアルファ・テストを開始した。付箋や，時計などのウインドウを，Webブラウザの「仮想デスクトップ」上に自由に配置できる。 同社が「スティッキー」と呼ぶ付箋のようなウインドウは，文章や画像を自由に書き込み，仮想デスクトップに貼れるほか，登録した友人（フレンド）に送付したり，パブリックページで公開したりすることができる。 また「ウィジェット」と呼ぶミニアプリケーション・ウインドウは，インターネットから配信された情報などを仮想デスクトップ上に表示させることができる。現在，時計のウィジェットが利用できる。今後，ニュース，天気予報，スケジューラ，ミニゲームといったウィジェットの開発に取り組むという。 同社では，Rinca.ccは「メモ書きやToDo管