デザイン理論: なぜ私たちは間違った場所を見ているのでしょうか?

デザイン理論: なぜ私たちは間違った場所を見ているのでしょうか?

数日前、バスで仕事に行きました。バスのカードリーダーの実際の使用シーンを実際に見て、カードリーダーの位置とスタイルに少し考えさせられました。私とバスカードリーダーに関するいくつかの話を見てみましょう。
シーン 1 – とても混乱します!これはカードマシンではないことが判明しました。
北京では、バスは通常、前のドアから乗り、後ろのドアから降ります。そうしないと、バスに乗る人が降りる人を圧迫し、降りにくくなります。ある日、仕事が終わってバスを待っていました。人だかりが押し寄せてくる中、私は前方のドアからバスに押し込まれました。私の最初の反応はカードをスワイプすることでした。見上げると、右側にボックスがありました。私は何も考えずにスワイプしました。なぜなら、カード リーダーに似たものしか見たことがなかったからです。初めてスワイプした後、私は疑問に思い始めました。「どうしたんだろう? 反応がない。」 習慣的に 2 回目にスワイプしましたが、やはり反応がありませんでした。私はスワイプをあきらめて、押し込まれ続けました。少し気を取られた後、カード リーダーが左側にあることに気付きました。その時の私の最初の反応は、「私はなんてバカなんだ!」でした。
人が多すぎたし、多くの人が押しつぶされて抵抗することしかできず、周りを見渡す暇もなかった。このシナリオでは、半数以上の人が間違いを犯しました。今回、私の間違いの原因となったのはカードリーダーではなく、カードリーダーと間違えられた箱でした。私はバスに乗るのが得意ですが、最初のときは騙されました。

私はドアからそう遠くないところに立っていました。バスが成福路南停留所に到着すると、ちょうどドアが開き、前に立っていた2人の外国人女性が後ろの乗客に押し込まれました。押し込まれた外国人女性たちに運転手が「乗り込んで、カードをスワイプして中に入ってください!」と促しました。もちろん命令口調でした。 2人の美しい外国人女性がカードを手に持ち、カード端末を探しているのが見えました。彼女たちの最初の反応はやはり右側のボックスだったので、何度も続けてスワイプし、それから身をかがめてカードリーダーを注意深く見つめ、ぎこちない中国語で「なぜスワイプできないの?なぜスワイプできないの?」とつぶやき、顔をしかめながらさらに数回スワイプしました。この時、運転手はすでに焦っていて、「右側、前に進んでください!」と叫んだ。2人の外国人美女は感激し、そのまままっすぐ歩いていった。彼らは実際のカードリーダーさえ見ていなかったので、おそらく出勤したと思ったのでしょうが、フィードバックがありませんでした。 (この二人の美しい外国人女性は初心者とみなすことができます)
次の数日間、多くの人がそのボックスをスワイプするのを見ました。その後、誰もそのボックスを使用しなくなりました。車内がどんなに混雑していても、どんなに騒がしくても、人々はカードをスワイプするために本物のカードリーダーを見つけなければなりませんでした。 (ここでは「見つける」という言葉が使われていることに注意してください)
シナリオ 2 – 左か右か?
バスのカード読み取り機は通常、右側にあります。最初はとても使いやすく、カードをスワイプするのに特別なことは何もないと感じました。しかし、ある時、混雑したバスに乗って、カードをスワイプするために持ち上げたところ、何も入っていないことに気づきました。慌てて見回すと、「ああ、左側だ」そこで私は右手で体を撫でました。もちろん、他の人を見ると、彼らも私と同じことをしていました。「なぜ車は左側にあるのですか?右側にあるべきではないですか?」と文句を言う人もいました。
その後の観察で、右側にカードリーダーがない場合、最初に右側を見てから左側を見る人が多かったことがわかりました。一部の人は単に首を振って左右を見てから、カードリーダーがある側を選びました。
しかし、カードリーダーが左側にあるという明らかな感覚があり、カードをスワイプするために右手を体の周りで動かさなければならず、少し不便です。カードリーダーが右側にあると、よりスムーズに感じます。
自分自身を観察してまとめると、右利きの行動により、右手でカードをスワイプする習慣が身につきやすくなります。そうでなければ、ほとんどの人にとって軽微な不便が生じることになります。もちろん、どうしても左に置きたいのであれば、私は反対しません。この習慣は、使用上それほど深刻なものではありません。重要なのは、バスに乗るときにカードをスワイプするときに、それらを脇に置いて、人々が反応能力を発揮できないようにすることが最善だということです。
シーン 3 – スワイプしただけなのに機能しませんでした。
071129_001.jpg
当初は、カードをスワイプできるカードリーダーの面積が全体の4分の1しかなく、バスカードをスワイプする前にカードリーダーに取り付ける必要がありました。そのため、カードをスワイプするときは、あまり考えずにスワイプしてしまい、おお!ブラシで塗ってないよ!もう一度観察し、下向きにブラシをかけます。あまり反応がないので、もう一度ブラシをかけます。その時、切符売りの人が私に注意しました。「チケットがスワイプされました。前に進んでください。」その後の観察では、何度もブラッシングをしている場面がよく見られました。当然ながら、フィードバック表示はまったくわかりにくく(黒い背景に赤い文字で、数字はわかりにくい)、特にラッシュアワー時の騒がしく混雑した交通状況ではフィードバック音がほとんど聞こえません。
その後、クラスメイトの一人がバスカードについて話してくれて、興奮気味にこう言いました。「少し離れていてもスワイプできるようになったんだ!本当に使いやすいよ!」私は笑ってこう聞き返しました。「なんでそんなに興奮しているの?」...
私はバスカードのレイアウトも個人的に以下のようにデザインしました
071129_002.gif
利点: 1. カードスワイプエリアにテーマがあり、カードリーダーは主にスワイプに使用されることを確認しました。 2. カードのスワイプのフィードバックが明確であることを確認します (たとえば、カードがスワイプされたことを示すためにカード スワイプ領域で大きな緑色のライトが使用され、失敗したことを示すために大きな赤色のライトが使用されます。応答がない場合はフィードバックがありません)。3. 差し引かれた金額と残高の補助表示。4. ユーザーに必須ではないその他の信号は、側面または背面に隠されています。
改善点:1. カードスワイプエリアの使いやすさ。 2. バス路線、単価、信号強度など、重要でない情報を削除または非表示にします。 3. カードスワイプフィードバックの重要性。
少なくとも私のレイアウトは使いやすいです。より良いデザイン方法については、これ以上説明する必要はないと思います。実際のユーザー、その習慣、環境に注意を払ってください。また、自分自身がユーザーになることもベストです。

<<:  HTML タイトルに二重引用符を追加する方法

>>:  MySQL ページングクエリ最適化テクニック

推薦する

PSを使用して2分でxhtml+cssウェブサイトのホームページを作成します

xhtml+css のウェブサイト再構築、ウェブ標準などについては、記事が多すぎるので繰り返しません...

JavaScript における URL オブジェクトの素晴らしい使い方

目次序文解析パラメータURLパラメータを変更する要約する序文URLオブジェクトはページ側ではあまり使...

外部ファイル(js/vbs/css)をインポートするときに文字化けを回避する方法

ページ内にはjs、cssなどの外部ファイルが導入されており、外部ファイルのエンコードが現在のページフ...

MySQLデータベーステーブルの容量を確認する方法の例

この記事では、MySQL のデータベース テーブルの容量を確認するためのコマンド ステートメントを紹...

Docker インストール tomcat dubbo-admin インスタンス スキル

1. tomcatイメージをダウンロードする docker pull tomcat:8.5.29 2...

小さな画面のモバイルデバイス向けにWebページを設計する際に注意すべきこと

その理由は、このタイプの Web ページが WAP と呼ばれるワイヤレス プロトコルから生成されたた...

CocosCreator Huarongdaoデジタルパズルの詳しい説明

目次序文文章1. パネル2. 華容島ソリューション3. コード4. 注記序文華容路とは何ですか? 誰...

スーパーバイザーウォッチドッグの使い方を3分で学ぶ

ソフトウェアとハ​​ードウェア環境centos7.6.1810 64ビット cat /etc/red...

Mybatis+mysqlはストアドプロシージャを使用してシリアル番号実装コードを生成します。

同時操作によるデータの重複を避けるために、データベースを操作するときにストアドプロシージャを使用して...

MySQLデータ内の多数の改行と復帰に対する解決策

目次問題を見つける1. 改行と復帰を削除する方法2. SELECTクエリで「改行と復帰」を無視する方...

Docker を使用してコンテナ内のルート パスワードを変更する方法

1. dockerfileを作成するときにsshパスワードを設定するには、次のコマンドを使用します。...

KVM ベースの SRIOV パススルー構成とパフォーマンス テストの詳細な説明

SRIOVの導入、VFパススルー構成、パケット転送速度性能テスト目次1. SRIOVの紹介2. 環境...

HTML タグ dl dt dd 使用方法

基本構造:コードをコピーコードは次のとおりです。 <ダウンロード> <dt>...

vue-element-admin グローバル読み込み待機中

最近の要件:グローバルロード、すべてのインターフェースはロード待機機能を表示するかどうかを手動で制御...

Web ページのエンコーディングで gbk や gb2312 ではなく utf-8 が使用されるのはなぜですか?

選択肢がある場合は、UTF-8を使用することをお勧めします。実際、Windows システム自体のプロ...