説得力のあるUXデザイン:誰がそれを正しく行っているか

公開: 2017-03-01
カテゴリ
ユーザー体験

すべてのWebサイトは、特定のユーザーにサービスを提供するために存在するという点で独特です。 慎重に作成された場合は、それらのユーザーのニーズを満たし、ユーザーがタスクや目標を簡単に達成できるように設計されます。 それでも、他社のUXイノベーションから学ぶべきことはたくさんあります。 他の誰かが自分のサイトで魅力的または非常に機能的なエクスペリエンスを作成するのを見ると、自分のサイトでのエクスペリエンスを改善する方法についてのアイデアを刺激することができます。 本当に印象的なUXを備えたサイトの例をいくつか示します。

1. Duo Lingo

Duolingoは絶対に使える喜びです。 プラットフォームが「学習を楽しくする」と主張できるとしたら、DuoLingoがそれです。 このサービスは、ユーザーが新しい言語を学ぶのに役立ち、インターフェースはシンプルでフレンドリー、そして親しみやすいものです。これは、新しい言語を学ぶという恐ろしいプロセスにアクセスしやすいように見せるためのまさに正しいアプローチのようです。 このサイトは、ユーザーにアカウントの作成を強制することなく、ほんの数秒でユーザーがサービスを使い始めることができるという素晴らしい仕事をしています。 これにより、ユーザーは、ログインとパスワードを作成する手順を実行する前に、自分でプラットフォームを体験できます。 プラットフォームの使いやすさと楽しさをユーザーが体験すると、アカウントを作成して専用ユーザーになる可能性が高くなることが想像できます。
デュオリンゴ
duo-lingo-2
Duo Lingoは、非常に理解しやすく、操作しやすい方法でユーザーに質問を提示します。 プログレスバーは、ユーザーがモジュール内でどれだけ進んでいるかを示します。 答え-正解または不正解-は色と音で補強されています。
duo-lingo-3

2.ヴァージンアメリカ

飛行機のチケットを予約することは、必ずしも最も楽しい経験ではありません。 多くの主要な航空会社は、フライトの検索と予約を完全に厳しいプロセスにする不格好なWebサイトを持っています。 おそらくそれが、VirginAmericaのWebサイトにアクセスすることが過激な体験のように感じられる理由です。 このサイトは清潔でモダンであり、ユーザーの主な目標であるフライトの予約を前面に出し、中心に据えています。 テキストは大きくて読みやすく、フライトの料金と時間は前もって表示されます。 Virgin Americaサイトの最も優れた機能の1つは、フライト費用に基づいて日付を選択できることです。これは、旅行の日付にある程度の柔軟性があり、最良の取引を探しているユーザーにとって大きなボーナスです。
ヴァージンアメリカ
ユーザーの旅行の詳細は、プロセス全体で保存および表示され、検索を最初からやり直すことなく、いつでも変更または更新できます。
ヴァージンアメリカ-2

3.ブルーエプロン

ブルーエプロンには、説得力のある方法で提示された有用なコンテンツが満載の素晴らしいホームページがあります。 長いスクロールページには、ユーザーの注意を引き付け、サイトコンテンツとの対話を促進する小さなアニメーションがあります。 ページの各セクションには、ユーザーがプロセスの次のステップに進むための手段を提供する強力な召喚状があります。
ブルーエプロン1
ブルーエプロンの登録プロセスも注目に値します。 これはシンプルな3ステップのプロセスであり、視覚的な強調と選択時の積極的な強化を通じて、ユーザーの好みの選択を楽しくします。
ブルー-apron2

4.アップル

Appleがこのリストを作成するのを見て驚くことはありません。 見事なビジュアル、明確なメッセージング、および消耗品の形式で提示される豊富な情報はすべて、楽しく機能的なユーザーエクスペリエンスを実現します。 Appleのサイトは、ユーザーが実際に製品に触れることができなくても、製品を有意義に探索して体験できるようにするという点で特に優れています。 AppleのWebサイトでは、複雑な製品に関するすべての詳細を静的なレイアウトに詰め込もうとするのではなく、さまざまな要素を展開および折りたたんでより多くの情報を探索することにより、ユーザーが製品ページを操作することを推奨しています。 これはスペースの効率的な使用であり、ユーザーはあまり興味のないことをスキップすることができます。
apple1
apple2

5.大西洋

深くスクロールするホームページは、サイトにアクセスできず、興味のあるものを見つけられないことをほぼ保証します。 コンテンツは幅広いカテゴリに基づいて整理されており、各カテゴリが明確に示されています。 記事の宣伝文句の設計方法には美しい階層があります。画像には、大きくて読みやすい記事のタイトル、小さい宣伝文のテキスト(ただし、まだ読みやすい!)、大西洋の赤いアクセントカラーの著者名が含まれています。 これらの小さなタッチにより、コンテンツに焦点を合わせて解釈することが容易になります。これは、率直に言って、ニュースサイトやコンテンツプロバイダーには必ずしも当てはまりません。
大西洋1
記事のページ自体も慎重に設計されています。 ユーザーがホームページに戻ったり、FacebookやTwitterで共有したり、現在読んでいるコンテンツカテゴリの次の記事に進んだりするための簡単な方法をユーザーに提供するスティッキーフッターがあります。 記事ページのテキストサイズの調整もいい感じです。

6. Warby Parker

Warby Parkerのサイトでは、オンラインで眼鏡を購入することは、これまでで最も簡単なことの1つであると感じさせます。 しかし、サイトの最良の部分(少なくともUXの観点から)はチェックアウトプロセスです。 Warby Parkerのチェックアウトプロセスは、完了までの障壁をできるだけ減らすように細心の注意を払って設計されています。 フォームは最小限で、ほんの一握りのフィールドしか含まれていません。 各カテゴリは、ユーザーが到達するにつれて拡大し、フォームが一見圧倒されるのを防ぎます。
warby-parker-1
warby-parker-2
モバイルデバイスを使用してオンラインで1つまたは複数の製品を購入する(つまり、製品の調査や閲覧だけでなく、チェックアウトプロセスを完了する)ことは、間違いなく私たちがますます快適になっているタスクですが、それでも非常にヒットまたはミスしています。 多くの場合、エクスペリエンスは煩わしい、または不必要に困難であり、後でデスクトップで購入を完了する方が簡単です。 しかし、WarbyParkerのモバイルチェックアウトプロセスはほとんど完璧です。 可能な限りフィールドを縮小し、入力時に住所を予測して自動入力します。フォームは垂直方向に積み重ねられ、モバイルでの最適な使用が可能になります。
warby-parker-3

7.アサナ

もう1つは、適切な対策です。Asanaをリストから除外することはできませんでした。 Asanaは、命を救うプロジェクト管理および生産性アプリであり、そのUXは私たちのお気に入りの1つです。 技術的にはチーム向けに設計されていますが、個人のタスク管理システムとしても機能します。 プラットフォームにはここでカバーするにはあまりにも多くの優れた機能がありますが、私たちが言えることは、それらがマイクロインタラクションの技術を習得したということです-プラットフォームとユーザーの間のコミュニケーションの小さな瞬間は、アクションを強化または促すのに役立ちます。 マイクロインタラクションは、ユーザーを励まし、認めるのに役立ちます。これにより、プラットフォームでの全体的なエクスペリエンスが向上します。 自分で見て:
私たちは、お気に入りの企業の革新的な仕事からインスピレーションを得ることを愛しています。 これらのWebサイトとプラットフォームはすべて、ユーザーのニーズを最優先し、それらのニーズを満たす方法を考え出すと同時に、エクスペリエンスに興奮と少しの喜びをもたらします。 それが私たちがUXを正しく行うことと呼んでいるものです。
このブロックは壊れているか、欠落しています。 コンテンツが不足しているか、元のモジュールを有効にする必要がある可能性があります。