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

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

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

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

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

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

推薦する

Viteの新しい体験の詳細な説明

Vite とは何ですか? (フロントエンドの新しいおもちゃです) Vite は、ネイティブ ES モ...

Vue 開発者向けの VSCode 拡張機能ベスト 7

適切な VS Code 拡張機能を Visual Studio に追加すると、開発者としての作業がは...

Windows での MySQL 8.0.16 のインストールと設定方法のグラフィック チュートリアル

この記事は、参考のためにMySQL 8.0.16のインストールグラフィックチュートリアルを記録してい...

Vueプロジェクトがグラフィック検証コードを実装

この記事の例では、グラフィック検証コードを実装するためのVueプロジェクトの具体的なコードを参考まで...

Centos 7 mysql-8.0.19-1.el7.x86_64.rpm-bundle.tar の簡単な分析

Baiduクラウドディスク:リンク: https://pan.baidu.com/s/1hv5rUW...

MySql バージョンの問題に対する完璧なソリューション sql_mode=only_full_group_by

1. sql_modeを確認する @@sql_mode を選択照会された値は次のとおりです。 ON...

SQL グループ化により重複を削除し、他のフィールドで並べ替える

必要:あるフィールドの同一項目を結合し、別の時間フィールドで並べ替えます。例:初めに テーブルから都...

MySQLとRedisでセカンダリキャッシュを実装する方法の詳細な説明

Redis の紹介Redis は完全にオープンソースで無料であり、BSD プロトコルに準拠しており、...

Vue の親子コンポーネントの値転送と一方向データフローの問題の詳細な説明

目次序文1. 親コンポーネントが子コンポーネントに値を渡す2. サブコンポーネントのprops型制約...

MySql インデックスを表示および最適化する方法

MySQL はハッシュ インデックスと Btree インデックスをサポートしています。 InnoDB...

シーケンス関数を実装する MySQL コード

MySQLはシーケンス関数を実装する1. シーケンスレコードテーブルを作成する テーブル `sys_...

Vueは、商品の数を制御するためのコンポーネントのパッケージ化と使用を実装します。

Vueのコントロール商品数量コンポーネントのカプセル化と使用は参考までに。具体的な内容は以下のとお...

MySQL の sql_mode モード例の詳細な説明

この記事では、MySQL の sql_mode モードについて例を挙げて説明します。ご参考までに、詳...

Vue プロジェクトの最初の画面のパフォーマンス最適化コンポーネントの実践ガイド

目次Vue ファースト スクリーン パフォーマンス最適化コンポーネント説明するインターセクションオブ...

MySQL でよく使用されるデータベースとテーブル シャーディング ソリューションの概要

目次1. データベースのボトルネック2. サブライブラリとサブテーブル2. 横長テーブル3. 垂直サ...