ウェブアプリ

「速度」がウェブやアプリ開発のキラー要素になる場面とその解決策とは?


ウェブサービスやアプリにおいて、ユーザーの目的を達成する機能の実装にばかり目が向きがちですが、実は「速度」こそがキラー要素になる場合があるとのこと。Facebookのプロダクトマネージャーとして働くブラッド・ディッカソン氏が、速度が特に重要になる場面と、速度を向上できない場合の解決策を解説しています。

Speed is the killer feature - bdickason.com
https://bdickason.com/posts/speed-is-the-killer-feature/

速度の重要性がよくわかる好例としてディッカソン氏が挙げているのがiPhoneです。携帯電話の歴史は2007年、iPhoneの登場で一転しました。iPhone登場以前もタッチスクリーン式の携帯電話は存在しましたが、iPhoneはそれらが抱える共通の問題を解決したという点で画期的でした。

アップル、ついにネット接続可能な携帯電話「iPhone」を発表 - GIGAZINE


iPhone以前のタッチスクリーン式携帯が抱えていた共通の問題が「速度」です。当時人気だったMotorolaやPalmの携帯電話は「操作」と「機能の実行」の間には遅延が発生していたとのこと。AppleはiPhoneでこのような遅延をなくし、ユーザーがスクリーンをタップした瞬間に機能が実行されるようにしました。iPhoneは「遅延の排除」によりリアルタイムの操作が可能になり、現実世界と同様の反応を携帯電話のインターフェースで実現し、1つの「体験」を作り出したわけです。

ハードウェアにせよソフトウェアにせよ、開発チームは「機能」に目がいきがちで、速度について見落とすことがよくあります。もちろん、機能はユーザーが製品を通じて目的を実現するための重要なものですが、その過程に遅延があると目的の実現が邪魔されます。遅延のあるUIは人をいら立たせ、欲求不満にし、流れを損なうとディッカソン氏は指摘しています。

ディッカソン氏が「特に速度が重要な場面」と述べているのは以下の通り。


1:オンラインショッピングサイトのチェックアウト画面
チェックアウト画面では、画面の表示が1秒遅延するごとにコンバージョン率がどんどん下がっています。1秒の表示遅延でコンバージョン率が7%下がるとするレポートもあるほど

2:仮想現実(VR)におけるフレームレート
VRのアプリやハードウェアが登場したばかりのとき、フレームレートが60fps以下になると乗り物酔いのような症状を起こすと報告されました

3:デザインツール
SketchFigmaといったデザイン系アプリの場合、ユーザーは遅延によって特に大きないらだちを感じます。こうしたデザイン系アプリでは1分あたりのアクション数が多く、わずかな速度低下が作業に大きな影響を与えます。

4:製品のコア機能
多くの製品はユーザーの問題を解決したり、時間を削減したりすることを目的としています。このため、製品の主要な機能で遅延が発生すると、人々が製品を使っている意味そのものが損なわれる可能性があります。

一方で、ATMのように物理的な制約があるときや、Gmailの「送信取り消し機能」のようなユーザーに修正の機会を提供するとき、あるいはビデオゲームのフレームレートのように人の認知に合わせる必要があるときは、「遅さ」があっても問題ないとのこと。

また、特定のアクションを速度アップできない場合は、「実際の速度」ではなく「知覚される速度」を変える必要があるとディッカソン氏は述べています。言い換えると、見せ方を変えることで「速いように見せる」ことが重要です。


ディッカソン氏は以下の4つのケースについて、処理速度を速く見せる方法を説明しています。

1:コンテンツのサイズが大きい場合
コンテンツのサイズが大きい場合、レンダリングの様子を見せることで「何が表示されようとしているか」をユーザーに示すことができます。

2:ロード時間が長い場合
ロードが完了していない時点でも画面をインタラクティブにすると、体感のロード時間が減少します。

3:アクションの待機時間
アクションに待機時間がある場合、バックグラウンドでアクションを実行しながらも、ユーザーがアクションを実行して自由に行動することを可能にすると、体感の待機時間は減少します。

4:さらにアクションの時間が長い場合
アクションの実行に30秒以上かかる場合はアクションが利用可能になったときにユーザーに通知を送る形式にすることがベター。

このような「速いように見せる」というUIのパイオニアがFacebookであり、コンテンツが読み込まれていない時点でもページの構造とUIは先に読み込まれるようにすることで、ユーザーはアクションの準備ができ、「体感速度の上昇」を実現しているとディッカソン氏は述べました。

この記事のタイトルとURLをコピーする

・関連記事
ユーザーインターフェースの質を高める手法「ユーザーはヨッパライ法」とは - GIGAZINE

目線トラッキングデータからみるEコマースサイトのデザインガイドライン - GIGAZINE

Appleとアイコンの未来を切り開いたグラフィックデザイナーとは? - GIGAZINE

325タイトル分のゲームUIをまとめたデータベース「Game UI Database」 - GIGAZINE

アプリやウェブサイトをデザインする上で最低限押さえるべき4つのポイント - GIGAZINE

in ソフトウェア,   ネットサービス,   ウェブアプリ,   ハードウェア, Posted by darkhorse_log

You can read the machine translated English article here.