ステップバイステップ:モバイルアプリエクスペリエンスの作成と公開
このトピックを完了すると、次のことが可能になります。
- Brightcove Engage を使用して新しいモバイルアプリエクスペリエンスを作成する
- エクスペリエンスに動画を追加する
- エクスペリエンスのカスタマイズ
- エクスペリエンスのプレビューと公開
- デバイスに Brightcove Engage アプリをインストールしてエクスペリエンスにアクセスする
オーディエンス
企業のビデオコンテンツを表示するためにネイティブモバイルアプリを作成する必要があるすべてのユーザー。
前提条件
- Brightcove Engage（トライアルにサインアップ）へのアクセス
始める前に
このステップバイステップガイドでは、Brightcove Engage トライアルアカウントに含まれている動画を使用します。自分の動画を自由にアップロードして使ってください。
Brightcove Engage App をインストールする
公開済みのモバイルアプリエクスペリエンスを表示するには、Brightcove Engage モバイルアプリが必要です。アプリをインストールするには、次の手順に従います。
- デバイスでアプリストア（iOS）または Google Play ストア（Android）を開きます。
- Brightcove Engageアプリを検索します。
- デバイスにアプリをダウンロードしてインストールします。
このアプリは、後で作成するエクスペリエンスの表示に使用されます。
モバイルアプリエクスペリエンスの作成
Brightcove Engage を使用してモバイルアプリエクスペリエンスを作成するには、以下のタスクを実行します。
プレイリストを使用した動画の整理
エクスペリエンスの作成を始める前に、動画の整理やグループ化について考えると便利です。通常、関連する動画をグループ化する必要があります。たとえば、最高経営責任者（CEO）の動画をグループ化し、人事ビデオをまとめ、マーケティングビデオなどをグループ化します。視聴者がモバイルアプリエクスペリエンスを使用すると、これらのグループのリストが表示され、視聴したい動画が選択されます。
また、モバイルアプリエクスペリエンスを作成するときは、1 つの動画を「注目のビデオ」として選択する必要があります。この動画は、アプリの上部に目立つように表示されます。ブライトコーブ Engage を使用する場合、関連動画はプレイリストを使用してグループ化されます。
サンプル動画を再生リストに整理するには、次の手順に従います。
- ブライトコーブ Engage にログインします。「プロジェクト」ページが表示されます。
- クリックビデオナビゲーションヘッダーのタブ。サンプル動画のリストが表示されます。
- 左側のナビゲーションで、[ + プレイリストを作成] をクリックします。
- プレイリストの種類を [ 手動] に設定します。
- プレイリスト名をに設定します
Featured Video。 - [ サイドバーにプレイリストを表示] をオンにします。
- [ 保存] をクリックします。
- 同じ設定を使用して、さらに2つのプレイリスト、
Sales Videosおよびを作成しますHR Videos。プレイリストを 3 つ作成する必要があります。
- 左側のナビゲーションで、[ すべてのビデオ] をクリックします。
- 2019オールハンズミーティング動画の横にあるチェックボックスをクリックし、[ その他] > [プレイリストに追加] の順にクリックします。
- [ 注目のビデオ]プレイリストを選択し、[ 追加] をクリックします。
- 次のビデオを選択し、販売ビデオプレイリストに追加します。
- 2018年販売戦略ミーティング
- セールスのハウツー-新しい市場でのパイプラインの開発-Ep 02
- セールスのハウツー-エクスカーションのアップセルのための新しいテクニック-Ep 01
- 次のビデオを選択し、 HR Videosプレイリストに追加します。
- HR-社内コミュニケーションプランの構築-E02
- HR-新入社員のオンボーディング-E01
これで、すべての動画がプレイリストに整理されます。左側のナビゲーションでプレイリスト名をクリックすると、そのプレイリストの動画が表示されます。
新しいエクスペリエンスの作成
新しいモバイルアプリエクスペリエンスを作成するには、次の手順に従います。
- ナビゲーションヘッダーで、[ プロジェクト]タブをクリックします。
- [ エクスペリエンスの作成]ページが表示されることを確認します。エクスペリエンスのリストが表示されたら、[ 新規エクスペリエンス] をクリックして [エクスペリエンスの作成]ページを表示します。
- モバイルアプリテンプレートを見つけて、[ 選択 ] をクリックします。
- エクスペリエンスのタイトルに「サンプルモバイルアプリ」と入力します。事前入力エクスペリエンスの場合？設定で、[ありがとう] を選択します。
- [ エクスペリエンスの作成] をクリックします。
エクスペリエンスエディターが開きます。エクスペリエンスエディターは、エクスペリエンスをカスタマイズするために使用され、ビデオの追加、スタイルの選択、その他の設定を行うことができます。すべてのカスタマイズ設定には、左側のナビゲーションメニューを使用してアクセスできます。
サイトの詳細を編集する
エクスペリエンスのタイトル、説明、言語設定は、エクスペリエンスエディターを使用して編集できます。
- クリック概要左側のナビゲーションで。
- エクスペリエンスの説明に、サンプルモバイルアプリエクスペリエンスを追加します。
- [ 保存] をクリックします。
メインページにロゴを追加する
各エクスペリエンスは、一連のページテンプレートで構成されています。提供されるページテンプレートは、エクスペリエンスの初回作成時に選択されたテンプレートによって異なります。モバイルアプリテンプレートは提供しますホームホーム、コレクション、ビデオの詳細、探すそしてプロフィールページテンプレート。これらのページは、の一部として左マージンに表示されます。ページメニュー。
モバイルアプリテンプレートでは、ホームページにロゴを追加できます。ロゴの追加の詳細については、「モバイルアプリエクスペリエンスへのロゴの追加」を参照してください。
ホームページにロゴを追加するには、次の手順に従います。
- クリックページ>家左側のナビゲーションで。
- エクスペリエンスのプレビューの [ ロゴの追加] リンクをクリックします。
- [ 参照 ] をクリックし、ヘッダーで使用する画像を参照して選択します。
- [ 保存] をクリックします。
- エクスペリエンスのプレビューに画像が表示されることを確認します。
コレクションの作成とコレクションへのビデオの追加
エクスペリエンスエディターを使用して、エクスペリエンスに表示する動画を選択できます。エクスペリエンスを作成するとき、ビデオはコレクションに整理されます。モバイルアプリエクスペリエンスを作成する場合、最初のコレクションの最初のビデオが注目のビデオとして使用されます。注目のビデオがアプリケーションの上部に表示されます。
モバイルアプリエクスペリエンスのコレクションを作成する場合、ブライトコーブでは、最初のコレクションとして注目のビデオコレクションを作成することをお勧めします。次に、先ほど作成した注目のビデオプレイリストをそのコレクションに割り当てます。
コレクションの作成およびエクスペリエンスへのビデオの追加の詳細については、「エクスペリエンスへのビデオの追加」を参照してください。
エクスペリエンスに動画を追加するには、次の手順に従います。
- クリックビデオ左側のナビゲーションで。
- 最初のコレクションに「注目のビデオ」という名前を付けて、 Enter キーを押します。
- コレクション名をクリックして、コレクションエディターを開きます。
- 条件に [ プレイリスト] を選択します。
- [ おすすめの動画] プレイリストをクリックします。そのプレイリストの動画が動画リストに表示されます。[ 保存] をクリックします。
- [ Sales Videos] プレイリストを条件として使用して、Sales という名前の別のコレクションを作成します。
- 名前の付いた別のコレクションを作成しますHRを使用してHRビデオ基準としてのプレイリスト。
- 3 つのコレクションが作成されていることを確認します。
エクスペリエンスのプレビュー
モバイルアプリエクスペリエンスをプレビューすると、モバイルデバイスでのエクスペリエンスの表示を確認できます。クイックプレビューは、PAGES ナビゲーション項目の下に表示されるページテンプレートをクリックすることで行うことができます。このプレビューオプションを使用すると、ビデオは再生されませんが、レイアウトのビューを取得できます。
エクスペリエンスは、新しいブラウザータブでプレビューしたり、共有可能なリンクを生成して他のユーザーがプレビューできるようにすることもできます。モバイルアプリエクスペリエンスのプレビューと公開の詳細については、「モバイルアプリエクスペリエンスのプレビューと公開」を参照してください。
エクスペリエンスをプレビューするには、次の手順に従います。
- エクスペリエンスエディターを使用してサイトを編集しているときに、[ プレビュー ] をクリックし、[ レスポンシブプレビュー ] をクリックします。
- プレビューが新しいブラウザータブで開きます。
- サイトプレビュータブを閉じます。
スタイルのカスタマイズ
[スタイル] 設定は、エクスペリエンスで使用される色をカスタマイズするために使用できます。モバイルアプリエクスペリエンスのスタイルの変更の詳細については、「モバイルアプリエクスペリエンスのスタイルを設定する」を参照してください。
スタイルを変更するには、次の手順に従います。
- クリックスタイル左側のナビゲーションで。
- テーマは、テンプレートに適用できる色のセットです。[ ライト] テーマを選択します。
- 色を変更するには、関連する色の円をクリックします。
- 色の範囲を選択するには、色の四角の下にあるスライダを使用します。
- 正方形をクリックして、目的の色の陰影を選択します。色は、適切な16進コード、RGB値、またはHSV（色相、彩度、明度）の値をテキストコントロールに入力することによって設定することもできます。
- スタイルメニューの上部にある [ < エクスペリエンスに戻る]リンクをクリックします。
色を元の値に戻すには、カラーサークルの横にある左矢印をクリックします。
エクスペリエンスの公開
モバイルアプリエクスペリエンスは、モバイルデバイスからアクセスする前に、公開する必要があります。モバイルアプリエクスペリエンスのプレビューと公開の詳細については、「モバイルアプリエクスペリエンスのプレビューと公開」を参照してください。
エクスペリエンスを公開するには、次の手順に従います。
- エクスペリエンスエディターで、[ 公開 ] をクリックします。
- [このモバイルアプリケーションを発行] ダイアログで、[ 今すぐ発行] をクリックして公開を確定します。
アクセスキーは、モバイルデバイス上のエクスペリエンスにアクセスするために必要です。
デバイスでのエクスペリエンスへのアクセス
モバイルアプリエクスペリエンスが公開されると、モバイルデバイス上のエクスペリエンスにアクセスするためにアクセスキーが必要になります。
モバイルデバイス上のエクスペリエンスにアクセスするには、次の手順に従います。
- アクセスキーがない場合は、プロジェクトホームページのエクスペリエンスプロパティの一部としてアクセスキーが表示されます。エクスペリエンスをクリックして選択します。アクセスキーは、プロパティセクションに表示されます。
- デバイスで Brightcove Engage アプリを開きます。アクセスキーを入力し、[ 次へ ] をクリックします。
