UXを念頭に置いてビデオプレーヤーを設計する方法

ビデオプレーヤーのユーザーエクスペリエンスを向上させるための重要な要素

ボリュームの調整、次のビデオへのジャンプ、字幕の切り替え、ビデオ品質の変化など、複数のコントロールを提供することでより多くの視聴者を引き付けることができる適切に設計されたビデオプレーヤー。さまざまな種類のビデオでは、さまざまなコントロールが必要です。教育ビデオは、速度制御とブックマーク機能の恩恵を受ける場合があります。

キーボードショートカットは、特に上級ユーザーにとって、ユーザーエクスペリエンスを大幅に改善できます。基本的なショートカットには、開始/一時停止のスペースバー、早送り用の矢印キー、ミュート用の矢印キー、フルスクリーンモードの場合はfを含める必要があります。ビデオプレーヤーを設計する前に、ターゲットオーディエンスを特定することが重要です。ユーザーがプラットフォームやビデオプレーヤーとどのように対話するかを理解することで、コントロールと機能をニーズに合わせてカスタマイズし、ユーザーエクスペリエンス全体を改善できます。

この記事では、学習プラットフォーム、ソーシャルメディアプラットフォーム、上級ユーザー、モバイルユーザーなどの特定のユースケースに選択する必要があるさまざまなビデオプレーヤーのコントロール、その目的、およびコントロールを調査します。 YouTubeがあるCool Advancedユーザーコントロールの数を知っていますか？読み続ける！

魅力的なビデオプレーヤーは、より多くの視聴者を引き付けることができます。

最新のビデオプレーヤーは、以前のプレイポーズボタンよりもはるかに多くのコントロールを提供できます。

今すぐYouTubeを見てください。ユーザーはYouTubeの章関数を使用してビデオクリップを閲覧できます。この機能は、ユーザーに関連するビデオクリップをすばやく検索するのに役立ちます。

特定の情報を見つけたいと思っているが、特定の質問に答えないビデオをどのくらいの頻度で視聴しますか？これはイライラします！

精通したYoutuberは、このための一時的な解決策を見つけました。彼らは、ビデオの説明にタイムスタンプを使用したさまざまなクリップをリストするのが便利だと感じました。このソリューションは、特定の問題をスキャンするために説明を開く必要があることを意味します。最も重要なことは、Googleが特定のトピックに関するさまざまな問題を扱うビデオのインデックスを作成することは困難です。

ビデオプレーヤーのユーザーエクスペリエンスは、章を追加する以上のものです。オンライン学習プラットフォームのビデオプレーヤーは、YouTubeビデオまたは製品Webサイトのシンプルな予告編ビデオに必要なコントロールとは異なります。

なぜビデオプレーヤーのユーザーエクスペリエンスが重要なのですか？

YouTubeのようなビデオプラットフォームを例に取ります。ユーザーはさまざまな方法でコンテンツを消費します。 YouTubeで3つの異なるユーザーロールをどのように使用できるかを調べてみましょう：

1. アリスはYouTubeを使用して、教育情報をすばやく見つけます。彼女は章関数を使用して関連部品をスキャンします。彼女はまた、矢印キーを使用して、より小さな増分ステップでフラグメントをすばやくスキップして、必要な情報を見つけます。
2. ベンはゲームビデオを見るのが好きです。彼は従来の上級ユーザーであり、fを使用してフルスクリーンを入力します。 アレックスはバックグラウンドミュージックの下で学ぶのが好きです。彼はYouTubeのAutoplay機能を使用しているため、適切な学習音楽を選択することを心配する必要はありません。彼はしばしばいくつかのバックグラウンドミュージックを選択し、YouTubeアルゴリズムがビデオの最後に同様の音楽を選択すると考えています。
上記のシナリオは、ビデオプラットフォームにはさまざまな方法で使用する多くの異なるユーザーがいることを示しています。したがって、最高のユーザーエクスペリエンスを提供するために、適切なコントロールとショートカットを選択することは困難です。

では、どのビデオプレーヤーをコントロールできますか？

どのビデオプレーヤーがコントロールしていますか？

多くの異なるビデオプレーヤーコントロールが存在します。このリストは、最も頻繁に見つけられるコントロールを要約しています：

再生/一時停止ボタン。

• 次のビデオにスキップします。
• ボリュームを調整します。
• 字幕を切り替えます。
• 画面サイズ（ミニプレーヤー、シアターモード、またはフルスクリーンモード）のサイズを変更します。ほとんどの場合、フルスクリーンモードを入力するボタンがあります。ただし、YouTubeを使用すると、ビデオを画面サイズにサイズ化する劇場モードに入ることができます。また、ミニプレーヤーを提供しているため、小さなビデオプレーヤーを使用してビデオを見ながらYouTubeを閲覧できます。
• ビデオ品質を変更します。誰もが良いインターネット接続を持っているわけではありません。したがって、ユーザーは品質を調整できます。ビデオ品質が自動的に調整されるオプションが提供されていることを確認してください。不安定なインターネット接続を持つユーザーの場合、ビデオプレーヤーは、接続速度に応じてビデオ品質を自動的に調整できます。ほとんどのユーザーは、中断することなくビデオを視聴し続けるために品質を減らすことを好みます。

それほど一般的ではないコントロールには、以下が含まれます

ビデオプレーヤーの速度を調整します。このコントロールを使用すると、ビデオを遅くしたりスピードアップしたりできます。通常、ビデオプレーヤーの速度を0.25から2の間の25％のステップで調整できます。

スイッチを切り替えて、自動再生機能を有効にします。音楽を聴くことや、次に見るものを決定するためにコンテンツアルゴリズムを好むのに役立ちます。
回帰と早送り。便利ですが、このコントロールはほとんど隠されています。たとえば、YouTubeでは、キーボードショートカットを使用してこのコントロールを使用できます。デフォルトのビデオコントロールの一部としてこの機能を実装するビデオプレーヤーはほとんどいません。
設定。 YouTubeは、デフォルトのコントロールセットにギアアイコンを実装します。ただし、YouTubeのビデオプレーヤーは複雑です。設定コントロールを使用して、めったに使用されない他のビデオコントロールを非表示にします。

最後に、現在のタイムスタンプとビデオの長さをどのように表示するかを忘れてはなりません。最も簡単な解決策は、最初に現在のビデオタイムスタンプを表示し、次に合計ビデオの長さを表示することです。この例では、ビデオを40秒間一時停止しました。合計ビデオ長は2分13秒で、「0:40 / 2:13」です。一方、一部のビデオプレーヤーは、ビデオの残りの長さを示しています。 ユーザーを混乱させるため、これを行わないでください。

次のセクションでは、ビデオプレーヤーを閲覧するために、一般的に使用されるより実験的なキーボードショートカットを紹介します。

上級ユーザー向けのビデオプレーヤーを設計する方法は？

キーボードのショートカットに精通するユーザーが増えるにつれて、彼らの欠如はしばしばイライラするビデオプレーヤーエクスペリエンスにつながります。

キーボードショートカットは、高度なユーザーのユーザーエクスペリエンスを向上させることができます。

たとえば、

ビデオプラットフォームを使用してベルギーのテレビをオンラインで視聴するのが好きです。プラットフォームはカスタムビデオプレーヤーを実装します。残念ながら、矢印キーを使用して戻ったり、ビデオを早送りしたりすることはできません。最も重要なことは、スペースバーを押してビデオを一時停止したり、停止したりすることはできません。ビデオプレーヤーは、タッチパッドを使用し、マウスを小さな一時停止アイコンに移動することを強制します。イライラしますよね？

現在のビデオプレーヤーは、少なくとも一連の基本的なキーボードショートカットを実装して、

プライマリユーザーを満たす必要があります。

スペースバー：ビデオを開始/一時停止
右矢印キー：5秒または10秒早送りビデオ
左矢印キー：5秒または10秒間ビデオを巻き戻す
• m：ビデオサウンドをミュートまたはミュートしてください
• f：フルスクリーンモードを入力または終了します

しかし、なぜこれらのキーボードショートカットのオプションを制限するのですか？ YouTubeは、キーボードショートカットの実装のリーダーです。高度なYouTubeユーザーから学ぶことができることは次のとおりです。

j
• を押すと、ビデオが10秒間巻き戻されますが、左矢印キーはビデオを5秒間巻き戻します。 を押す
l
• はビデオを10秒間早送りしますが、右矢印キーはビデオを5秒間早送りします。 番号キーは、あまり知られていないキーボードショートカットです。
0
• を押すと、ビデオの先頭になります。 YouTubeは、各ビデオを9つの等しい長さに分割します。長さに関係なく、任意の数字キー（ゼロを除く）を押すと、ビデオのその位置に移動します。これは、最後までジャンプしたり、始まりに戻ったり、中央のどこかに戻るのに最適な方法です。
YouTubeは、5秒または10秒間、機能性を早送り/巻き戻します。ビデオの詳細を見逃した場合は、左矢印キーを使用してすぐに巻き戻すことができます。ビデオをスキャンしたい場合は、

l

キーを押して、10秒間隔でビデオをスキャンできます。 さまざまな目的のためのさまざまな種類のビデオコントロール

教育ビデオ、ソーシャルビデオ、モバイルビデオなど、さまざまな目的で実装されたさまざまなコントロールについて説明しましょう。 教育ビデオ

UdemyやCourseraなどのプラットフォームに関する教育ビデオによって実装されたコントロールは、通常のビデオプレーヤーのコントロールとは異なります。たとえば、ユーザーは多くの場合、チュートリアルビデオをスピードアップすることを好みます。したがって、これはこれらのプラットフォームで見られる一般的なコントロールです。

さらに、教育ビデオはブックマーク機能に密接に関連しています。ユーザーは、ビデオの特定の瞬間についてブックマークしてコメントできます。この機能により、ユーザーは参照のためにビデオの重要な瞬間をマークすることができます。

ソーシャルビデオ

ソーシャルビデオは、迅速な共有オプションから最も恩恵を受けます。 YouTubeを使用すると、ビデオを共有できますが、標準制御セットの一部ではありません。彼らはその機能をビデオプレーヤーの下部に追加しました。

それにもかかわらず、ビデオプレーヤーコントロールの一部としてクイック共有オプションを実装する価値があります。特定のタイムスタンプから共有する機能を追加することを忘れないでください。ほとんどの場合、ユーザーはビデオで特定の瞬間を友人と共有したいと考えています。

一方、Twitchは、ユーザーがビデオプレーヤーからビデオを直接編集できるようにします。

クリップを使用すると、Twitchの視聴者は、放送で最もユニークなTwitchの瞬間をすばやく共有でき、放送局はソーシャル共有を通じてチャネルを開発できるようになります。

これは、楽しい瞬間、素晴らしいゲーム、または共有する価値のあるその他の瞬間をすばやく編集するための素晴らしい機能です。

https://www.php.cn/link/4f9ef38edcfc460a00cbb8ed5dee299c

}}

モバイルビデオプレーヤーは、よりシンプルなデザインが必要です。モバイルデバイスの画面に多数のコントロールを追加することは不可能です。

たとえば、

YouTubeのモバイルビデオプレーヤーは次のコントロールを提供します。

フルスクリーンモード

を入力します

次または以前のビデオに移動します

• ビデオ
を一時停止します
• 字幕を有効にします
• ビデオ設定を開く
• ただし、モバイルビデオの場合、ショートカットキーはユーザーエクスペリエンスを向上させることができます。たとえば、画面の右側をダブルクリックすると、ビデオを10秒間早送りすることができます。同じことが左の画面にも当てはまります。これは、ビデオを10秒に戻すことができます。さらに、上下にスワイプしてビデオをズームインしたり、検索結果を再度表示したりできます。ここでは、使用速度に焦点を当てており、ユーザーエクスペリエンスにプラスの影響を与えます。
• 結論：視聴者を定義します

適切なビデオプレーヤーを設計するには、必ず視聴者を定義してください。ユーザーに相談して、プラットフォームとビデオプレーヤーの使用方法を学びます。

たとえば、Twitchの編集機能は、他のビデオプレーヤーの中でユニークです。この機能は、ユーザーベースに最適です。ライブストリーミング中に素晴らしい瞬間をすばやく節約できます。

上級ユーザーを覚えておくことを忘れないでください。キーボードショートカットを使用して、ミュートビデオサウンド、早送りビデオ、フルスクリーンモードなどの基本的なビデオ操作を実行するのが好きです。

インスピレーションを得るために、利用可能なすべてのYouTubeキーボードショートカットをチェックしてください！

最後に、独自のビデオプレーヤーを構築する機能がある場合は、上記のヒントを覚えておいてください。ただし、既製のソリューションを探しているだけの場合、上記の説明では、利用可能なオプションを見るときに考える食品を提供する必要があります。

ユーザーエクスペリエンス（FAQ）のビデオプレーヤーのデザインを検討する

FAQ ビデオプレーヤーを設計する際のユーザーエクスペリエンスに関して、どのような重要な要素を考慮する必要がありますか？ ビデオプレーヤーを設計する際に考慮すべき重要な要素には、シンプルさ、直感性、応答性が含まれます。デザインは、ユーザーの気を散らさないように不必要な乱雑を避けるために簡潔で明確でなければなりません。初めてであっても、コントロールは直感的で理解しやすい必要があります。ビデオプレーヤーもレスポンシブである必要があります。つまり、さまざまなデバイスと画面サイズでシームレスに実行する必要があります。また、これらの機能はユーザーエクスペリエンスを大幅に向上させる可能性があるため、調整可能な再生速度、品質選択、字幕などの機能を含めることを検討してください。

ユーザーが使用できるようにする方法は？

ビデオプレーヤーを使いやすくするために、コントロールが簡単にアクセスし、直感的であることを確認してください。おなじみのアイコンを使用して、再生、一時停止、ボリューム、フルスクリーンボタンを使用します。また、キーボードショートカット（一般的なアクション用）などの機能、ユーザーがビデオのさまざまな部分の進行状況バーを簡単にスキップできるようにするオプション、ビデオの品質と再生速度を調整するオプションを含めることを検討してください。また、ビデオプレーヤーがレスポンシブであり、さまざまなデバイスや画面サイズでうまく機能していることを確認してください。

ビデオプレーヤーを設計する際には、どのような一般的な間違いを避けるべきですか？

ビデオプレーヤーを設計する際に避けるべき一般的な間違いは、乱雑なインターフェイス、コントロール用の混乱またはなじみのないアイコン、およびビデオプレーヤーの応答速度がないことを含みます。また、特にページに複数のビデオがある場合は、ユーザーが退屈する可能性があるため、自動的に動画を再生することを避けてください。代わりに、準備ができたら、ユーザーにビデオの再生を制御させます。

ビデオプレーヤーがすべてのユーザーがアクセスできるようにする方法は？

すべてのユーザーがビデオプレーヤーにアクセスできるようにするには、字幕や閉じた字幕（聴覚障害の場合）、オーディオの説明（視力障害の場合）などの機能を含めます。また、マウスを使用できない人を容易にするために、すべてのコントロールがキーボードを介して簡単に操作できることを確認してください。また、コントラストの高い色を使用してコントロールとテキストを表示し、すべてのユーザーが簡単に表示できるようにします。

ビデオプレーヤーの可用性をテストする方法は？

ユーザーテストを実行して、ビデオプレーヤーの使いやすさをテストできます。これには、ユーザーのビデオプレーヤーとのやり取りを観察し、遭遇する困難を記録することが含まれます。調査やインタビューを通じてユーザーのフィードバックを収集することもできます。また、分析ツールを使用して、ユーザーが最も頻繁に使用するコントロールやビデオを見る時間など、ユーザーがビデオプレーヤーと対話する方法を追跡します。

ビデオプレーヤーの読み込み速度はどれくらい重要ですか？

ビデオプレーヤーの読み込み速度は非常に重要です。ビデオの読み込みが長すぎると、ユーザーは視聴をあきらめることがあります。したがって、ビデオファイルサイズを最適化し、高速で信頼性の高いホスティングサービスを使用して、ビデオプレーヤーが迅速にロードされるようにします。また、ユーザーがビデオがロードされていることをユーザーが認識できるように、ロードインジケーターを含めることを検討してください。

ビデオプレーヤーにソーシャル共有オプションを含める必要がありますか？

ビデオプレーヤーにソーシャル共有オプションを含めることは、ユーザーがソーシャルメディアプラットフォームでビデオを簡単に共有できるため、コンテンツの範囲を拡大できる可能性があるため、有益です。ただし、これらのオプションが侵襲的ではなく、視聴体験を妨げないようにしてください。

ビデオプレーヤーを競争から際立たせる方法は？

ビデオプレーヤーを競争から際立たせるために、優れたユーザーエクスペリエンスを提供することに焦点を当てます。これは、ユニークな機能、シンプルで直感的なデザイン、高速負荷時間、または優れたビデオ品質を通じて実現できます。また、ユーザーのフィードバックに耳を傾け、ニーズや好みに応じてビデオプレーヤーを継続的に改善します。

ビデオプレーヤーのデザインで色はどのような役割を果たしますか？

カラーは、ビデオプレーヤーのデザインで重要な役割を果たします。重要なコントロールに注意を引き付け、ボタンのアクティビティを示し、プレーヤーの全体的な美しさを高めるために使用できます。ただし、選択した色があまり気を散らしていないことを確認し、カラービジョンの欠陥を含むすべてのユーザーがアクセスできることを確認してください。

モバイルデバイス用のビデオプレーヤーを設計する方法は？

モバイルデバイス用のビデオプレーヤーを設計するときは、画面サイズの小さなサイズとタッチベースのインタラクションを検討してください。コントロールがクリックしやすくするのに十分な大きさであり、偶然のクリックを避けるために近すぎないようにしてください。また、デバイスのオリエンテーションを検討し、ビデオプレーヤーがポートレートモードやランドスケープモードでうまく機能することを確認してください。

以上がUXを念頭に置いてビデオプレーヤーを設計する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。