モバイルコンテンツの自動テスト

このビデオでは、Photoshop、Illustrator、Flash Lite、After Effects、Premiere Proなどで作成されたモバイルコンテンツを複数のモバイルデバイス上でまとめてテストする方法について学びます。

このコンテンツを視聴するには Flash が必要です

今すぐ無償Flash Playerをダウンロード！

必要条件

このチュートリアルのデモンストレーションと同じ操作を行うには下記のソフトウェアが必要です。

Adobe Device Central CS4

サンプルファイル

lrvid4063_dc.zip (ZIP, 69MB)

前提として必要な知識

Adobe Device Centralのインターフェイスの基本知識

モバイルコンテンツの自動テスト

このチュートリアルでは、複数のデバイスによるコンテンツのチェックを個別に繰り返し行うことなく、一括して行うことができる、Adobe Device Centralの新機能の自動テストについて説明します。

Device Centralのナビゲート

Device Central CS4には、モバイル機器のコンテンツをチェックすることができるいくつかの新機能が用意されています。

画面では中央の「エミュレータ」パネルにコンテンツが表示されています。
Synopsisを開いてあらすじの画面を見てみます。テキスト情報であらすじが書かれています。次は、トレイラーを開いてみましょう。映画の予告編のムービーが始まります。
図 1: Device Centralの「エミュレータ」パネル

自動テスト

Device Centralの自動テストは使いやすく、いろいろなモバイル機器上での動作をチェックするのに大変便利です。

フォトギャラリーを開きます。このページはいくつかの画像で構成されています。これらフォトギャラリーが複数のデバイスで、どのように表示されるのかをテストしてみましょう。
コンテンツの再生を記録するには、「自動テスト」パネルの左下、「録画」ボタンをクリックします。
図 2: 自動テストの録画
テストしたいコンテンツにナビゲートします。
「エミュレータ」パネルの下部にある「スナップショットを作成する」ボタンをクリックして、それぞれの画像のスナップショットをとります。
図 3: スナップショットを作成する
「停止」ボタンをクリックして、テストをストップします。
PhotoGalleryと名前を変更します。
複数のデバイスでチェックします。デバイスセットパネルでテストしたいデバイスを選択するか、グループでまとめてデバイスを選択します。これでこのグループに含まれるすべてのデバイスで、まとめてテストすることができます。
図 4: テストしたいデバイスを選択
自動テストパネルの「再生」ボタンをクリックします。「自動テスト」ダイアログボックスが表示されて、テストの進行状況が表示されます。「エミュレータ」パネル内ではグループ内のデバイスが順番に再生されていきます。
テストが終了すると、全体のテスト結果のログ画面が開きます。テストを実行したデバイスとその結果のスナップショットが一覧表示されています。左側にはデバイスが、右側にはテストの結果のスナップショットが表示されています。
図 5: テスト結果のログ画面

HTML形式で書き出し

自動テストするだけではなく、テスト結果をWeb上で公開できるできるHTML形式で書き出すことができます。

スナップショットログから、「HTMLとして書き出し」をクリックします。

図 6: HTMLとして書き出し
「スナップショットログを書き出し」ダイアログボックスが表示されました。Photo Galleryという名前を入力します。
図 7: 「スナップショットログを書き出し」ダイアログボックス
デスクトップを保存先として、「保存」をクリックします。デスクトップに先ほど設定した名前でフォルダが出来上がっています。ダブルクリックして開くとindexのHTMLファイルと、CSS、あるいはimagesのフォルダによるパッケージで書き出しが実行されています。