モバイルインターフェイスでの相互作用の速度の心理的要素

モバイルインターフェイスの開発における最も重要なコンポーネントの1つは、ユーザーアクションに対するインターフェイスの応答です。 一般的に、モバイルインターフェースのユーザーは、アプリケーションを使用するとき、それほど辛抱強くありません。 また、コンテンツの読み込みに時間がかかりすぎる場合は、周りを見回し始め、アプリケーションでの作業を続ける可能性は低くなります。



では、アプリケーションを高速化する方法は? アプリケーションを高速化できることを理解した上で、興味深いテクニックをいくつか紹介します。



Instagramに写真を投稿すると、ユーザーが写真を選択するか、カメラをクリックしてすぐにアップロードするとすぐに、バックグラウンドでダウンロードが開始されます。 Instagramに写真を投稿するプロセスは、いくつかのステップ(スケーリングとトリミング、フィルターの適用、署名の追加など)で構成されているため、このアプリケーションには利点があります。



画像



Instagramには、写真の公開が完了するまでに「完了」というメッセージが表示されます。



ユーザーがこれらの手順を実行する間、写真は既にバックグラウンドでアップロードされます。 プログレスバーや読み込みメッセージはありません。



その時までに、ユーザーはすでに写真を投稿するプロセスを完了しており、友人のフィードの表示に戻ります。 おそらく彼はそこと彼が残した画像を見たいと思うでしょう。 この時点で、アプリケーションにステータス「完了」が表示され、写真のアップロードプロセスが終了し、すぐに友人の写真とともにリボンに表示されます。



そのため、ユーザーは常に一連の手順を実行し、同時に写真をアップロードする方法を実行する必要があります。 手順が完了すると、写真は既にアップロードされます。 これにより、ユーザーはスピードを感じることができますが、写真は通常よりも速く読み込まれません。



ユーザーエクスペリエンスを向上させるためのこのようなシンプルなソリューションが、製品全体の成功の推進力になるのは非常に興味深いことです。 Instagramの前には、写真を共有できる他のアプリケーションもありましたが、それらは非常に似ていましたが、原則として、ユーザーが必要な手順をすべて完了する前に写真をアップロードしませんでした。 これはInstagramが行った小さな変更であり、アプリケーションの速度の感覚を時々追加し、他のアプリケーションからユーザーを引き付けるためのまさにツールになりました。



メッセージングは​​、速度がアプリケーションの本質を決定する別のユーザーエクスペリエンスです。 WhatsappとiMessageのアプローチを比較して、メッセージの送信と配信についてユーザーに通知する方法を見てみましょう。



画像



メッセージの送信と配信を確認する2つのWhatsappチェックボックス。



Whatsappには、メッセージが送信されたことを示す緑色のチェックマークと、メッセージが既に配信されたことを示す別の緑色のチェックマークがあります。 Whatsappは見事な動きを見せ、アプリケーションは最初の目盛りをすぐに表示します。 メッセージはまだダウンロードされていない可能性がありますが、Wh​​atsappが責任を負い、すぐに送信のユーザー確認を表示します。 これにより、ユーザーはWhatsappがメッセージングで実際に高速であると感じます。



iMessageは完全に異なるアプローチを使用しますが、これは同じ肯定的なフィードバックを作成しません。



画像



IMessage進行状況バーにメッセージ送信プロセスが表示されます



ユーザーがiMessageにメッセージを送信すると、メッセージの読み込み中に青いプログレスバーが画面全体に移動します。 ネットワーク接続の速度によっては、時間がかかる場合があります。 また、画像を送信すると、進行状況バーはさらに遅くなります。



なぜこれはユーザーエクスペリエンスが悪いのですか? ユーザーは、画面上を移動するバーの進行状況を必然的に監視します。バーがゆっくり移動すると、スピード感がすぐに失われます。 長い目で見れば、これはユーザーがこのアプリケーションを快適に使用できるかどうかに影響する可能性があります。 しかし実際には、WhatsappとiMessageはおそらくそのテキストと写真を同時に送信します。



したがって、各アプリケーションがメッセージの状態をどのように表示するかは、アプリケーションの速度の認識に大きな影響を与える可能性があります。



デザイナーや開発者が表示するために使用する多くのオプションがあります-コンテンツがダウンロードされています。 原則として、何らかの回転が発生するか、進行状況バーを使用して何かが発生していることを示します。その間、ユーザーはダウンロードを待つ必要があります。 この場合、ユーザーはしばらく動けなくなり、これがユーザーを混乱させることがあります。 それは砂時計を見ているようなものです。



最近、一部のアプリケーションでは、コンテンツの読み込みが高速になり、ユーザーへの刺激が少ないというアプローチを既に使用し始めています。



画像



Facebook Paperアプリはブロック構造を示しています



このアプリケーション(FB Paperを参照)は、コンテンツの「構造」を表示し、「コンテンツが完全に読み込まれて画面に表示される前でも、ユーザーはコンテンツブロックの場所と形式を確認できます。計画またはプロトタイプのようなものを検討しています。コンテンツが表示されると、ユーザーは読み込みプロセス全体が滑らかで自然に感じられます。



画像



Pinterestカラーブロック構造



Pinterestは、アプリケーションとWebサイトで同様のアプローチを使用しています。 しかし、彼らはこれをさらに進めました。 Pinterestは、各投稿の画像を分析し、どの色が優勢であるかを理解します。 さらに、pinterestはこれらの値をサーバーに保存し、アプリケーションがコンテンツをロードすると、カラーブロックと画像自体の間の移行が非常にスムーズになります。 その結果、写真の読み込みがずっと速くなったように感じられます。



モバイルインターフェースの設計者および開発者として、作成したユーザーエクスペリエンスが高速な対話、スムーズさ、使いやすさを保証するために、武器庫全体を使用する必要があります。 これは、モバイルデバイスがウェアラブルデバイス、つまり、ユーザーの要件と期待がさらに厳しい衣服(Googleグラスなどのメガネ-翻訳者のマーク)に統合されるデバイスに変わるにつれて、ますます重要になっています。



@ozlublingのツイッターで、製品設計とユーザーエクスペリエンスに関するその他の考えをご覧ください






All Articles