アプリの設計でコミットされない12の悪いUX/UIの間違い

公開: 2017-10-25

テキストが小さすぎて読めません。

白い背景の上の小さな明るい色のフォントコンテンツ。

ユーザーは、ユーザーインターフェイスのどこかにぴったりと配置された重要な機能を見ることができません。

これらは、アプリのUX / UI設計に共通する問題の一部であり、このような多くの間違いを犯すと、多大なコストがかかります。 ソフトウェアプロジェクトを計画する際には、シームレスなユーザーエクスペリエンスを提供する直感的で高速なインターフェイスを作成することを目的としているため、設計段階のかなり早い段階でこのような間違いを特定することが不可欠です。

アプリの破滅を招く可能性のあるいくつかの致命的な間違いと、最終的にそれらを回避する方法を以下に示します。

1.ユーザーの期待から逸脱する

Deviating from User Expectations

興味深いことに、これらの基本的なGUIウィジェット(ラジオボタン、チェックボックス、スクロールバー、コマンドリンク/ボタンなど)の使用に関して、ユーザーはある程度の期待を抱いています。これらのボタンで革新的な変更を試みても、好評を得られない場合があります。

この簡単な例を考えてみましょう。あなたは生涯BBCニュースを聴いています。 突然、あなたの家族の誰かが代わりにCNNを聞くことに決め、あなたは「水から魚が出た」という感覚を覚えます。 これは、GUIウィジェットに大幅な変更を加えたときに、ユーザーが感じることとまったく同じです。

人気のあるGUIウィジェットのほとんどは、何年にもわたって完成され、実験されてきました。ユーザーがそれらを好むのには理由があります。 その安らぎと心地よさを一晩で変えるのは簡単ではありません。 これは、ユーザーが何か新しいことをするためにかなりのエネルギーと頭脳を発揮しなければならないためです。 そして彼らはそれを受け入れないかもしれません。

したがって、アプリのGUIウィジェットの外観を大幅に変更しないでください。 ユーザーはアプリ内を手間のかからないナビゲーションにすることを好むため、GUIの元のルックアンドフィールを維持することをお勧めします。

2.ユーザーが本当に必要としているものがわからない

企業がユーザーの実際のニーズを認識できず、ニーズに対応できないものを思いついた場合、それは大きな失敗につながります。 このような場合、売り上げを伸ばすことはできず、アプリは失敗します。

組み込む機能を決定する前に、ユーザーの関心を調査して深い洞察を得ることが重要です。 このために、徹底的なユーザーと市場調査を行います。

ターゲットユーザーがアプリのデザインに期待すること(即時の応答時間、コントロール間のスムーズなナビゲーション、読みやすさなど)を理解します。つまり、直感的なユーザーエクスペリエンスです。

また、競合他社の批判的分析を行います–彼らのアプリのユーザビリティ要因を知ってください。 アプリに含まれるすべての機能、ユーザーインターフェースのインタラクティブ性など。

また、初めての開発者は注意してください。アプリにあまりにも多くの機能をオーバーロードしないでください。 アプリの背後にある主な目的は、ユーザーのアクティビティを簡素化することです。

そのため、機能を使いすぎないことをお勧めします。これは、すぐに平凡なアプリに変換するアクティビティの急増につながるためです。 より少ない数の機能(もちろん、主要な機能)でうまくいくでしょう。

3.貧弱なタッチターゲット

Poor Touch Targets

ユーザーはさまざまなサイズの指を装備しています。 したがって、タッチは、ターゲットセグメント内のすべての人の指に対応するように構成する必要があります。 大人の人差し指の平均幅は1.6〜2cmです。 したがって、タッチベースのモバイルアプリケーションを設計するときは、このことを念頭に置いてください。

ユーザーがアプリの機能に触れてアクティブ化するのが難しいと感じた場合、ユーザーはアプリの使用を完全に放棄する可能性があり、それは本当に悲劇的です。 そして、これはあなたが持っている機能の数にも当てはまります。 機能が多いほど、アプリのタップ領域は小さくなります。 一方、いくつかの主要な機能を組み込むと、タップ領域が大きくなります。

4.スクロールホラー

雑誌や新聞の編集者や広告主は、かつて「折り目」の永続的な恐怖の中に住んでいました。 モバイルアプリケーションが普及すると、コンテンツが簡単にスクロールできる画面に表示されるため、「フォールドホラー」が少し緩和されました。

しかし、これは部分的にしか当てはまりませんでした。主なアクションが折り畳みの下に収まらない、つまり人々が簡単にスクロールして見つけられる場所を打ち負かす、レスポンシブで長いWebレイアウトを作成することがますます重要になったからです。

コンバージョンは、関連するボタンが「スクロールしなければ見えない位置」に配置されている場合、またはユーザーがスクロールする必要がない場合にのみ増加します。 明確な行動を促すフレーズを目立つ場所に配置すると、コンバージョン数が増加します。

5.GUIコントロールボタンの外観を模倣するボタン

Buttons that Mimic the Looks of GUI Control Buttons

GUIコントロールが多すぎるとひどい間違いになるのと同じように、これとは逆に致命的となることもあります。 下線が引かれたテキストと見出しは、ユーザーを新しいページに誘導するリンクであるという感覚を生み出します。

彼らはそれをクリックしますが、ページに到達しないとき、彼らはリンクが壊れていると思い込み、アプリを終了します。 ユーザーはしばしばこの茶番劇のために混乱し、時にはイライラし、二度と戻ってこないかもしれません。

どうしても必要な場合はラジオボタンを表示しますが、ラジオボタンがない場合は間違った印象を与えないでください。

6.一貫性のないGUIコントロール

GUIコントロールは一貫している必要があります。 召喚状や同様の行動に特定の単語を使用している場合は、アプリ全体で同じ単語を使用してください。 同じアクションに異なる単語を使用すると、混乱が生じる可能性があります。

開発者が想定するアクションは、ユーザーにとって単純な場合があり、正反対のことを行います。 アプリで特定のパターンに従う場合は、全体を通して一貫してそれに従ってください。 ボタンとページが、ユーザーが期待する場所に表示されることを確認してください。

7.フローチャートをスキップして設計に取り掛かる

Skipping the Flowcharts and Getting Down to the Designing

開発者は、フローチャートをスキップしてアプリの設計部分に飛び込むことで時間を節約することはできません。 ユーザーを念頭に置いてフローチャートを作成することは非常に重要です。多くの開発者は、エンドユーザーを常に念頭に置いて、ユーザーのペルソナを使用してこれらのグラフを作成します。

これは、ユーザーがどこから来ているのか、彼らの興味は何であるのか、そして彼らはどこにいるのかを判断するのにも役立ちます。 したがって、フローチャートを設計する際には、ユーザーとビジネスの目的、およびそれが最後に達成されるかどうかを決定することが不可欠です。 フローアウトラインを作成することにより、ページフローでさまざまなオプションを検討し、最適なものを決定することができます。

8.「知覚されたアフォーダンス」を考慮しない

素人の言葉で言えば、アフォーダンスとは、オブジェクト/環境のプロパティに応じて物理的に可能なすべてのアクションを意味します。 階段を上ったり下ったりしたり、ボトルキャップを使ってネジを締めたり外したりできます。

同様に、Webページでは、スライダーが上下に移動する機能を実行します。チェックボックスを使用すると、チェックボックスをオンまたはオフにでき、ハイパーリンクされたテキストで別のページに移動します。 アフォーダンスにより、ユーザーは簡単に理解できることを行うことができます。

これらのアフォーダンスの認識は、Webページ、経験、信念、および目標に関するユーザーの知識に基づいています。 ユーザーインターフェイスを設計する際、設計者が正しい手がかりを与えることが重要です。そうしないと、混乱を招き、ユーザーエクスペリエンスが低下する可能性があります。

設計者は、ユーザーがこれらのUI要素をどのように観察し、それらと対話するかを認識できる正しい視覚的記号を使用する必要があります。 すべてのユーザーが平等に作成されているわけではないことを覚えておくことも重要です。 したがって、すべてのアフォーダンスがすべての人に同じように認識または解釈されるとは限りません。 したがって、適切なラベルと指示を使用して、すべての視覚的な手がかりを元に戻します。

9.適切な種類のダイアログボックスがない

Absence of the Right Kind of Dialog Boxes

Webアプリのダイアログの使いやすさでは、システムの現在の状態とコマンドがどのように解釈されたかをユーザーに知らせることが必須です。 ダイアログは、現在の画面から離れることなく、ユーザーのアクションがどのようになっているのかをユーザーに通知することを目的としています。

沈黙はユーザーが推測し続けることができます。 したがって、Webアプリを作成するときは、ダイアログボックスがユーザーからの情報を覆い隠さないようにしてください。 ただし、継続的なメッセージは中断を招く可能性があるため、慎重に使用してください。

たとえば、ユーザーが情報を入力した後に特定のページを終了することを決定した場合、ダイアログボックスに「ドラフトを破棄しますか?」という確認ボックスが表示されます。 キャンセルまたは破棄」。

ただし、購読ダイアログボックス(たとえば、「メールアドレスを入力して毎日のニュースレターを購読してください」)を何度も押し付けると、非常にイライラする可能性があります。

10.エラーメッセージでよくある間違いを犯す

ユーザーは時間と労力を費やしてフォームに記入します。フォームにエラーが発生した場合は、何がどこで問題が発生したかをユーザーに通知する必要があります。 パスワードを作成するための特定のルールがある場合は、事前にユーザーに通知してください。そうすれば、ユーザーは同じことを2回行う必要がなくなります。

または、適用するプロモーションコードがある場合は、適用するプロモーションの種類とその理由を事前に通知してください。 時間通りに彼らに知らせないと、ユーザーに不安や欲求不満を生じさせる可能性があります。 エラーメッセージを作成するときは、次の間違いをしないように注意してください。

  1. あいまいさ-ユーザーが犯した間違いについて明確ではありません。
  2. ユーザーを非難する–ユーザーが間違いを犯した場合でも、謙虚であることをお勧めします。 間違いをそっと指摘してください。そうすれば、彼らは再試行するように促されます。
  3. エラーメッセージの不適切な配置–エラーを箇条書きに配置しないことをお勧めします。これにより、エラーが実際にオフになります。 エラーメッセージをエラーのすぐ上に配置して、ユーザーが何が問題なのかをすぐに確認できるようにします。
  4. エラーを防ぐためにマイクロコピーを使用しない–空白の近くにある小さな説明テキストは、実際に何を入力するかをユーザーに指示できるため、ユーザーは最初のラウンドでそれを取得できます。
11.スマートデフォルトの欠如

アプリのフォーム入力ページに追加のフィールドがあると、抑止力になる可能性があります。 したがって、その追加フィールドが絶対に必要な場合は、フォーム入力フィールドにデフォルト値を入力してください。 人々はフォームをすばやくスキャンして、フォームに入力するのにかかる時間を確認します。フォームにデフォルト値がすでに存在する場合は、先に進んで他の値に入力する可能性があります。

スマートなデフォルトがないと、時間がかかり、ユーザーを苛立たせる可能性があります。これは重大な間違いです。 また、ユーザーの注意が必要な入力フィールドにはデフォルトを設定しないことをお勧めします。 ユーザーが何をクリックしようとしているのかを想定しないでください。十分に調査されたデフォルトであったとしても、ユーザーは何か他のものを欲しがる可能性があります。

12.Call-to-Actionボタンのアクセントカラーを無視する

Ignoring Accent Colors for the Call-to-Action Buttons

「今すぐ購入」、「無料チュートリアルを開始」、「今すぐ登録」などのボタンに注意を引くには、適切なアクセントカラーを組み込むことが非常に重要です。ボタンに別の色を使用して、特に非常に目立つようにします。重要なCall-to-Actionボタン。

アクセントカラーは、注意を引くのに十分な明るさ​​である必要がありますが、刺激的で気を散らすものであってはなりません。 アクセントカラーがアプリの残りのカラーテーマと補完していることを確認してください。 また、行動を促すために特定の色を予約し、ページの他の場所では使用しないでください。

結論

これらは、UI/UXデザインで最もよく見られる間違いの一部です。 また、設計を変更するときは常に、それがどれほど効果的かを確認するために徹底的にテストするようにしてください。

アプリのデザインは成功の差別化要因であり、毎日リリースされる何千ものアプリで、承認を得るのはほんの一握りです。 不十分な慣行は、UX / UI設計に致命的なミスをもたらす可能性があり、非常に多くの人々のすべての努力が無駄になります。

最後のリマインダー:

アプリを設計するときは、特定のプラットフォームを対象としている場合を除き、複数のプラットフォーム用に設計することを忘れないでください。 これは、Minimum Viable Product(MVP)をストアに直接取り込む方法です。