Delisamokatのシングルではない：小さなユーザビリティエラーが実際の例で大きな問題を引き起こす方法

数週間前にサンフランシスコで、通りの真ん中に立っている電動スクーターを借りました。 アプリケーションのインストールから実際のレンタルまでの時間は2分以内で、そのうち半分はアプリケーション自体のダウンロードに費やされました。 私は、登録がどのように行われたかにも気付きませんでした。 すべてがネイティブであり、主な目標である移動を開始することにつながりました。

ユーザーの主な問題がアプリケーションへの登録と電動スクーターの使用に関連していたデリサモカットの打ち上げ失敗に関するVarlamovの壊滅的な記事は、2年前の話を曖昧な形で思い出させました。

さらに読む：幅広いユーザー向けのモバイルアプリケーションの例を使用して、ユーザビリティエラーの詳細な分析とそれらを排除するための推奨事項。

それから会議で、私はロイヤルティプログラムの適用の成功に関するガソリンスタンドの全国ネットワークの1つのマーケティングディレクターの報告に耳を傾けました。 インスタレーションの成長の印象的なダイナミクスの数字が引用されました。 レポートは成功しました。

後で感銘を受けて、私はアプリケーションをダウンロードすることにしました。 そして、穏やかに言えば、彼は驚きました。

アプリケーションは最初の対話から拒否されました。 各登録ステップは、自己習得に挑戦しました。 私が見たものとプレゼンテーションの印象との間には非常に大きな不協和があったため、数時間を費やして関与の形成における最も重要な部分のユーザビリティ監査を準備しました：最初の立ち上げと登録/承認のプロセス、そしてそれを会社の代表者に送りました。

彼らは私に答えて、示された弱点を知っているか推測していることが判明し、間違いなく修正するでしょう。

2年が経過しました

同社はマーケティングディレクターを変更し、いくつかの新しいサービスを開始してアプリケーションに統合しましたが、ユーザビリティ監査からの単一の問題を解決しませんでした。

それでは、ユーザビリティの基本原則を無視しながら、会社がどのようにお金とユーザーの信頼を失い続けるかを見てみましょう。 おそらく、この資料に触発された誰かが、製品を別の角度から見て、より使いやすくするでしょう。

倫理的な理由から、ユーザビリティ監査から会社への言及をすべて削除しました。

ロイヤリティプログラムのモバイルアプリケーションのユーザビリティ監査

監査は、重大な「技術的な」ユーザビリティエラーのみを反映します。 私はユーザーインタビューを実施せず、キャラクターを作成せず、ターゲットオーディエンスのニーズを書きませんでした。 一般的に、私は仕事のプロジェクトでは決してやらないようにしました。 ただし、以下で説明する問題の場合、これはアプリケーションの最初のオープンから登録への変換を大幅に増やすのに十分です。

監査は、原則に基づいています：問題の説明-解決策。 まず、変更が必要な理由を分析し、次に特定のアクションを分析します。

ケース1：アプリケーションの最初の起動

アプリケーションとの最初の連絡が最も重要です。 ユーザーにはまだ形成された値がなく、最初のコンタクトで値を失う可能性は非常に高くなります。

問題

典型的なアプリケーションのユースケースのプレゼンテーションはありません。 このようなプレゼンテーションは、App Storeのアプリケーションの説明にあります。アプリケーションの値の簡単な説明とスクリーンショットは、ユーザーがダウンロードについて決定するのに役立ちます。 インストール後のアプリケーションとの最初のコンタクトでも同じことが行われます。

「スマートフォンのロイヤルティプログラムのすべての利点」というバナーは、既存のプログラム参加者のみが理解できます。

一方、このアプリケーションを使用すると、現在のガソリンの価格を確認したり、最寄りのガソリンスタンドを見つけたり、ハンバーガーを購入できる場所を理解したり、車を離れることなくガソリン代を支払うことができます。 これが価値を生み出すものですが、それについての言葉ではありません。

提言

アプリケーションの最初の起動時に、一般的なアプリケーション使用シナリオのプレゼンテーションを表示します。 これにより価値が生まれ、アプリケーションがより理解しやすくなり、登録/承認を完了する動機が高まります。

これがどのように見えるかの例：

アプリケーションの最初の起動時に、ユーザーにはアプリケーションの主な機能のプレゼンテーションを含むスライドショーが表示されます。 最も明らかな値が例として取り上げられました。 作業バージョンで正確に表示するものは、ユーザビリティ調査の決定に役立ちます。

問題

iOSでは、ユーザーから通知を送信する許可を得る機会は1つだけです。 ユーザーが禁止しており、何らかの理由で後で決定を変更したい場合、この設定を変更するための難しい方法を実行する必要があります。 通知を送信することが重要な場合、二度目のチャンスを期待することは不可能です。 すぐにユーザーに正しい判断を下すように動機付ける必要があります。

これで、アプリケーションを最初に起動した直後に、通知を送信する許可を要求するための標準ウィンドウが表示され、ユーザーにこれが必要な理由を理解する機会が与えられなくなりました。 アプリケーションはまだ価値を生み出すことができていませんが、解決するためにすでに何かを必要としています。

通知は迷惑であり、平均的なユーザーの生活の中でその数を考えると、「許可しない」項目を選択する可能性は非常に高くなります。

提言

適切な時間と場所で通知を送信する許可をリクエストします。 リクエストの前に、ユーザーがこれから受けるメリットを説明してください。 通知がポイントカードに直接関連している場合は、アプリケーションでの承認後に許可をリクエストする必要があります。

これがどのように見えるかの例を以下に示します。

通知を送信するためのシステム要求が表示される前に、アプリケーションは、追加のアクションに関連付けられたコンテキストにユーザーの注意を集中させ、特定の値を提供します。

「後で確認」という代替アクションが存在すると、アプリケーションのウィンドウが閉じられますが、システムウィンドウは要求されません。 これは、おそらく特定のタスクを実行する過程で、後で許可を取得する機会がまだあることを意味します。 たとえば、不慣れな都市にいるユーザーがアプリケーションのマップを使用して最寄りのガソリンスタンドを探している場合、新しい場所の最寄りのガソリンスタンドを自動的に報告するための提案を含むウィンドウを表示するのが適切です。これには通知を有効にする必要があります。

状況依存の通信は特定の価値をもたらし、ユーザーが保存したいという欲求だけでなく、共有に関する情報を受信するために通知を有効にすることを強制するだけではありません。

ケース2：「地図を持っていない」シナリオ

カード登録画面では、ユーザーは一度に複数のアクションを実行する必要があります。 スクリーンショットでは、3つの同等のボタンが表示されます。 しかし、彼らは一貫して押されなければなりません。 これは特定の困難を生み出し、相互作用の否定的な経験を形成します。

ボタンは淡色表示され、非アクティブな感覚を生み出します。ボタンを押しても何も起こらないため、「何かが機能していない」という感覚を生み出します。

電話番号を入力するためとSMSからパスワードを入力するための2つのテキストフィールドが画面に配置されます。 どちらもアクティブですが、「SMSからのパスワード」フィールドにデータを入力してもアクションは発生しません。

電話番号を入力すると、すぐに2つのボタン「無料のSMSを送信」と「電話番号の確認」が緑色に変わります。 同時に、2番目のボタンを押すと、当然「コードが正しくありません」というエラーが発生します。

「無料のSMSを送信」ボタン（現在は「SMSを送信」に変更済み）のテキストは、何らかの理由でSMSが自分ではなく自分の番号から送信されることを想定しています。

SMSを受信して​​確認コードを入力すると、「ありがとう」ポップアップウィンドウが表示され、インターフェイスのボタンが再びグレー表示されます。 何かが再び機能しないのですか？

チェックボックスは、コンピューターや携帯電話の画面で作業するときに便利です。小さなボックスに指を入れるには、試してみる必要があります。 テキストをタップするという決定は状況を少し節約しますが、このコンテキストではネイティブではありません。 確かに、クリックマップを見ると、実際にテキストを「タップ」しているユーザーの割合が少ないこと、およびチェックボックスの周りのクリックマップがどれだけ汚れているかを確認できます。

次の画面でアプリケーションが生年月日を尋ねるので、「18歳になりました」という項目は冗長です。 ユーザーが18歳未満の場合、これについて通知できます。

「ユーザー契約の条項に同意します」という項目は冗長であり、間違った場所にあります（登録はまだ完了していません）。 最適な実装オプションは、「登録ボタンをクリックしてユーザー同意書に同意する」ボタンの下の署名です。 （おそらく、GDPRの開始に伴い、ユーザー同意書による決定を検討する必要があります。）

「情報を受け取ることに同意します...」という項目が間違った時間に間違った場所に配置されたため、サブスクリプションの数に影響を及ぼす可能性があります。 （2年後、「情報を受け取ることに同意します...」チェックボックスがこの画面から消えました。）

これまで、すべてのボタンは緑色でした。 黄色のボタンが表示されると、自動反応がトリガーされます。 多分私はどこかで間違いを犯したのでしょうか？」

提言

インターフェイスは、1画面-1タスクの原則に従って再設計する必要があります。 この方法は、画面の数が増えても、登録を高速化し、簡素化します。

これがどのように見えるかの例を以下に示します。

最初の画面には、3つのタスクのソリューションが含まれていました。電話番号を入力し、SMSからコードを入力し、フラグを設定してから、次の画面に進みます。 このシナリオからフラグ付きのアクションを意図的に除外し、残りのタスクを2つの画面にレイアウトします。

最初の画面では、ユーザーには選択肢がありません。電話番号のみを入力できます。 「次へ」ボタンは常にアクティブであり、押すことができます。 電話番号を入力せずに押すと、最初に電話番号を入力するように求めるエラーメッセージが表示されます。

電話番号を入力すると、次の画面が表示され、SMSからコードを入力するように求められます。 テキストフィールドへの署名は、SMSの送信先の番号を示します。 番号が誤って入力された場合、それを修正する方法は明確なままです。

問題

チェックボックスを使用してユーザーの性別を選択すると、両方のアイテムを一度に選択できることが示唆されます。

提言

ビューをより関連性の高いスイッチに変更します。

問題

電子メールを入力する要件は、クライアントの電子メールを取得したいという願望によってのみ正当化されます。

「確認には電子メールが必要」という理論的根拠は、コンピューターでやり取りするときに機能しますが、電話では悪い考えです。

第一に、「確認のために電子メールが必要」という動機は、論理的な疑問「なぜ？ 私はすでに自分の電話番号を確認しました ''、2番目に、ユーザーは単に電話を持っていないか、電話からのメールにアクセスできない可能性があります。 アプリケーションの使用状況（ガソリンスタンド、道路など）を考えると、このステップで登録が中断される可能性があります。

パスワードを入力するかどうかは明確ではありません。 パスワードを入力する理由 どのような目的で使用する必要がありますか？ いつ必要になりますか？

チェックボックスをスイッチとして誤って使用すると、両方の項目を一度に選択できるという感覚が生まれます。 さらに、一般に「カードの種類」が何を意味するのか、なぜ「追加」が必要なのかは完全に理解できません。

提言

可能であれば、この画面を完全に放棄するか、必要に応じて正直な議論で電子メールの入力フィールドを作成します。 パスワード入力フィールドは完全に削除されます。 会社には既にユーザーの電話番号があり、必要に応じてアクセスパスワードを送信できます。 この機会を利用する価値があります。

ケース3：「地図を持っている」シナリオ

顧客ロイヤルティカードの存在は、アプリケーションへの登録時の実際の存在を意味するものではありません。 ユーザーがロイヤルティプログラムの既存の顧客である場合、アプリケーションの唯一の承認オプションはカード番号によってのみ実現できるのはなぜですか？

提言

携帯電話番号を使用して、ロイヤルティプログラムの既存の顧客を承認する別の機会を実装します。

これがどのように見えるかの例を以下に示します。

したがって、手元にロイヤリティカードを持っているお客様は、カード番号を入力するか、電話番号を入力するという、自分にとって便利なオプションを選択できます。

問題

パスワードやコードワードを入力する必要があると、混乱に陥ります。正確に入力する必要があるものは明確ではありません。SMSからのコードまたは前のステップでユーザーが入力したものです。 さらに、登録中にパスワードがランダムに入力されることがよくあります。 この点で、「パスワードをお忘れですか？」ボタンを使用した統計を見るのは非常に興味深いです。 ほとんどの場合、人気があります。

UPD： 2年後、この画面にはまだ変更がありました。 [パスワード]テキストフィールドの右側にアイコンが表示され、これをクリックすると、承認に問題がある場合にホットライン番号を呼び出すための提案を含むポップアップが開きます。 その結果、単純なユーザビリティの問題を解決する代わりに、会社はコールセンターの負荷を増加させるため、一般的にコストがかかります。

提言

SMSを介した認証を使用するソリューション（上記を参照）は、冗長なパスワードを作成して記憶する必要があるという問題を完全に解決します。

問題

カードが既に存在し、まだアクティブ化されていない場合、エラーメッセージが表示され、「登録」ボタンが「カードがありません」スクリプトを起動しますが、入力されたカードの番号が表示された追加フィールドがあります。

この決定はユーザーにとって不愉快であり、不安感を生み出します。

提言

カードがまだアクティブになっていないことがチェックで示された場合は、ユーザーが[登録]ボタンをクリックする必要なく、すぐにカード登録画面を表示します。 このソリューションは、否定的な意味合いのない線形プロセスを作成します。 あるべきようにすべてが起こります。

これがどのように見えるかの例を以下に示します。

ユーザーは、まだアクティブ化されていないカードの番号を入力し、「次へ」をクリックします。 次の画面では、電話番号の入力を求められ、登録を完了するために必要な残りの画面が表示されます。

これらのささいなことはすべて注目に値しますか？

テクノロジーの私たちの生活への浸透がそれほど大きくなく、ユーザーエクスペリエンスが形成されなかった10年前でさえ、それはまれであり、愚かさを感じるほど長くはありませんでした。 今日、食料品店のレジ係は、時計の助けを借りて商品の代金を支払うことに驚かないようになり、自動操縦車は人々を倒し、私たちは毎日さまざまなインターフェースとやり取りしなければなりません。

そして、私がUX業界を発展させようとする気持ちの良い傾向にもかかわらず、ほとんどの請負業者は「美しく」または顧客が望むようにそれを続けています。 私たちはこれに苦しんでいます。もちろん、私たちは毎日それを操作せざるを得ないユーザーです。

上記のすべては、小さく、取るに足らない、一般的に明らかであると考えることができます。 ブランドがあれば、ブランドの強さで旅を続けることができます-多くの顧客はしばらくの間自分の愚かさを我慢し、アプリケーションが便利であることを確信しさえします：それは何とか機能しますが、それ以前は存在しませんでした しかし、世界は変化しており、より進歩的な競争相手は、昨日便利で、明日厄介で迷惑なように思われることをすぐに行うでしょう。

すべてのインターフェースに便利！