Tweet

Share on Tumblr

先日、TSUTAYA onlineに会員登録をしました。

登録に必要な情報すべてを入力できたと思い、次ページへ進もうとすると入力ミスがあったようで、元のページに戻されてしまいました。戻されたページの上部に項目名を表示することで入力ミスを伝えていますが、ページが長かったこともあり、どこに入力すればよいのか分からなくなってしまいました。

写真1：ページ上部でエラー箇所を知らせる画面

一般的に入力ミスを伝える方法としては、アラートダイアログで入力ミスの項目名を知らせてくれるものや、入力すべき欄の近くに赤文字で知らせてくれるものなど、いろいろありますが、ちょっと見ただけでは該当箇所を見落としてしまうものが多く、不便だなぁと思っていたところ、Yahoo!JAPANの登録画面にはとても感心する工夫がありました。

それは、うっかり入力ミスしても、ページの上部に入力ミスがあることを知らせる表示があるだけではなく、入力すべき欄の上に文字でも知らせてくれるうえ、該当箇所の背景が黄色くハイライトしているのです。 

写真2：入力中とエラーを知らせる画面

元の入力画面はほとんどモノトーンで素っ気無いくらいだったので、入力ミスを知らせる黄色い背景と赤い文字が目立つようになっています。また、既に入力済みの項目は平文で表示し、該当箇所だけフォームを残すことで、入力すべき箇所としなくても良い箇所を分かりやすくするなど、この入力画面には、ユーザの入力を補助するための工夫が随所に見られ、非常に気が利いているデザインだと思いました。

普段、面倒に感じることが多いユーザ登録作業を気持ちよく完了させる。これも、よいユーザ体験のひとつかもしれませんね。 

Tweet

Share on Tumblr

RPGをしていて、戦闘時の表示スピードが遅いと感じたので、設定画面をのぞいた時の話です。

せってい画面

「せってい」画面の「せんとう速度」は『3』になっていました。そこで、特になにも悩むことなく『5』を選択して設定を終えました。

そして、ゲームを再開すると・・・
・・・設定前より遅くなりました(T_T)
一番速い設定は『1』だったのです。

この「せってい」画面で調整できる3つの項目は音量と速度です。なので、数字の大小に何かしらの量的なイメージを抱かしやすいと思います。

直感的に考えると、数字が大きくなると、音量であれば音が大きく、速度であれば速くなるイメージだと思います。しかし、この「せんとう速度」はそのイメージと逆です。（ちなみに、上の2つは数字が大きくなるほど、音が大きくなるようになっていました。）

一度体験すれば、すぐに望んだ設定にし直すことは容易です。であるからこそ、この記憶は残りにくいものです。数ヶ月後、同シリーズの新作を購入したとき、設定画面が同じUIであったら、また直感的に判断し、同じ間違い起こすかもしれません。

調整する量を数字で示す場合は、その数字がユーザに与えるイメージを考慮し、機能を割り当てる配慮が必要ではないでしょうか。

＜おまけ：改善案1＞

数字にこだわらないなら、こういったUIはいかがでしょうか。

改善案１

Tweet

Share on Tumblr

仕事でExcelをよく使います。そんなあるとき、少しでも見やすい表を作るために、下のように黒色で塗りつぶしたセルの間に白い罫線を引こうと思ったのですが、線を引くのに困ってしまいました。

メニューの罫線ボタンからでは詳細な設定ができないので、書式設定の画面を開いて、線の色を「自動」から「白」にすると、線のスタイルの表示が白地に白線となり、スタイルがわからなくなってしまったのです。

（図）Microsoft Office2003 Excel「セルの書式設定」ダイアログ

これでは、スタイルは選べません･･････

結局、線の色を「白以外」にいったん戻して、スタイルの位置を確認してから、「白」に設定し直さなければなりませんでした。Excelと同じように私がよく使う、WordとPowerPointの同様の設定ができる画面を見てみると、下図のようになっていました。 

（図）Microsoft Office2003 WordとPowerPoint「セルの書式設定」ダイアログ

　Wordでは、色を変更すると、「種類」（a）と「線の太さ」（b）と「プレビュー」（c）内の線の色に変更が反映されますが、「スタイル」内のすべての線の色が変るのではなく、現在のスタイルにのみ反映されるので、すべてのスタイルがわからなくなり選べない、ということにはなりません。

　また、PowerPointでは、色を変更しても、「スタイル」（d）内の線やその他の箇所にも変更の反映はされず、設定結果をこのダイアログ内で確認することはできません。そのかわりに、PowerPointには、設定を決定する前に、実際のページ上で設定結果を確認できるプレビュー機能があり、文字や背景色などの罫線以外の内容とのバランスを確認することができます。

　これまでの3つのソフトについて、まとめてみます。

• Excel： 色を「白」に変更すると、全スタイルに「白」が反映され、スタイルを選べなくなります。
• Word： 色を「白」に変更すると、現在のスタイルにのみ「白」が反映されますが、他のスタイルは黒い線のままなので選ぶことができます。
• PowerPoint： 色を「白」に変更しても、スタイルは黒い線のままで、「白」は反映されません。

　今回の場合は、白い線を引こうとしたことにより起こったことですが、「白」以外では、色が反映されたスタイルを確認することができます。一方、PowerPointのように色が反映されなければ、スタイルがわからなくなることはありませんが、色が反映されたスタイルを確認することはできません。上記のことから、設定した「色」と「スタイル」を同時に確認することは、なかなか両立しにくいことなのだなと感じました。

　また、このように同様の罫線の設定画面として見てみると、同じシリーズ間で画面構成は似ていても、設定方法やユーザインタフェイスの仕様が微妙に異なっていることがわかります。合わせて使用することの多い、ソフトのセットなので、メニューやツールバーの見た目だけではなく、細かいところでも揃っていると、セットのサービスとして、より魅力的になると思います。

[補足]

Office 2007のPowerPointでは、このようなダイアログはなくなり、変更後のデザインイメージを表示してくれるライブプレビュー機能がつきました。 

Tweet

Share on Tumblr

「やや、もうこんな時間。そろそろ出かけるか。」

自宅を出る間際、携帯電話の乗換検索サイトを利用することがよくあります。

このとき知りたいのは、「今自宅をでて、駅に着いてから最初に発車する電車の発車時刻＆目的地への到着時刻」です。なので、自宅から駅まで歩いて15分かかる私は、出発時刻を現在時刻の15分後に設定してから検索します。その結果によって、コンビニに立寄る時間があるのか、ダッシュする必要があるのか確められるのです。

先日、いつも使っているものと違う乗換サイトを試したら、下図のようなボタンを見つけました。

出発時刻の設定ボタン

押すと、選択肢が表示される

このボタンを押すと、「5分後に」「10分後に」…というザックリとした選択肢が表示されます。この中からササッとちょうどよい候補を選べば、あっという間に出発時刻を設定することができます。

もちろんこのボタンがなくても、出発時刻欄の数値を設定しなおせば同様の検索は可能です。しかし、現在時刻に15分足した時刻を頭の中で計算しなければならないこの作業、おでかけ前のバタバタした時間に行うには、ちと煩わしいなあ、なんて感じていたところなのです。

乗換検索におけるユーザのひと手間を省いてくれる、気の利いた設定方法だな～と思いました。 

Tweet

Share on Tumblr

みんな大好き「Ctrl+Z」

いろいろなアプリケーションで「元に戻す」の操作に割り当てられているショートカットキーです。これは直前に行った操作を取り消して、１つ前の状態に戻してくれる機能なのですが、いったい何をもって「1つ前の状態」と区切ればいいのか？と考えさせられました。

ありがた迷惑、とはよく言ったもので、Excel2003はズーム（拡大縮小）の操作も「1つ前の状態」に戻してくれるのです。

最近は、マウスのスクロールホイールで簡単にズーム操作ができてしまうので、写真のように操作の履歴が全て「ズーム」で埋まってしまうこともあります。「やべ、間違えて消しちゃったよ」というときも、消した直後にズームズームしてたら1回の操作では元に戻せませんし、下手すれば戻したくても戻せなくなってしまいます。（Excel2003の場合、操作の履歴は16回までしか記憶されません…） 

Excel2003の「元に戻す」アイコンの▼を押してみると…

いろいろと調べてみたのですが、Excel2003がズームの操作まで「1つ前の状態」としてカウントしている理由はわかりませんでした。もちろん何か理由があるとは思うのですが、「元に戻す」→「入力や削除などの編集を戻す」と予想するのが人の常、と思うのは私だけでしょうか。

補足：Excel2007では、100回前までの操作を記憶してくれるようになったようです。