このガイドでは、Charades ゲームの形式で、単純な没入体験を構成するコンポーネントについて説明します。ほとんどのゲームはカスタム UI と入力コントロールを必要とするため、ゲームは没入体験に最適です。
また、独自の Glassware を構築するための重要な設計、開発、配布のヒントも学びます。
始める前に
Charades ゲームの完全なソースは GitHub で入手できます。このガイドは、Android Studio に大きく関わっているため、始める前に Android Studio にインポートしてください。
- クイック スタート画面で、[Check out from version Control] > [Git] をクリックします。
- Charades からクローン URL をコピーします。
- クローン URL を Vcs リポジトリの URL に貼り付け、[クローン] をクリックします。
- 次の画面で [Yes] をクリックします。
- 次の画面で [OK] をクリックします。
- [Play] ボタンをクリックしてプロジェクトをビルドし、接続された Glass で実行します。呼び出しの詳細について、サンプルの
READMEを確認してください。
ラボの内容
Android SDK のコンポーネントを使用して Charades の没入感を大量にビルドし、GDK で Glass を操作する方法について学習します。 以下のトピックについて学びます。
- 提供するデザイン リソースを使って UI のフローを設計する
- Glassware を起動するための音声トリガーの設計
- Android のアクティビティを使用してゲームの UI 構造を定義する
- ユーザーがゲーム オプションを選択できる Android メニュー項目を作成する
- メインメニューの音声操作で Glass 体験に統合する
- GDK ジェスチャー検出器を使用してユーザー入力を検出し、カスタム アクションを実行します。
- より洗練され、Glass スタイルに沿ったシンプルな Android UI 実装について学習します。
- Glassware を配布する際の配布プロセスと確認事項
デザイン
開発を開始する前に、時間をかけて Glassware を設計してください。これにより、Glass で最適な UI フロー、使用する音声コマンド、カードの外観がわかりやすくなります。
もちろん、Glassware の設計は反復的なプロセスであり、ここで設計する対象も変わります。しかし、最初からこの作業の大部分を行うことは、優れたエクスペリエンスを構築するうえで非常に重要です。
UI フロー
UI フローの設計は簡単な演習であり、コードを 1 行記述する前に Glassware を可視化できます。常に Glassware の開発作業を行っています。
Charades の没入感の主な UI 要素を確認して、独自の Glassware を作成する際に、UI の仕組みと、このプロセスがいかに便利であるかを理解しましょう。
スプラッシュ画面
この画面は、Charades の没入時に最初に表示される画面です。ユーザーは慣れ親しむ一般的なゲーム構造であり、ゲーム エクスペリエンスを使用する前に移動することもできます。
ユーザーがタッチパッドをタップすると、[New Game] と [Instructions] の 2 つのアイテムを含むメニュー システムが表示されます。
インストラクション モード
没入型の制作では、入力方法が新しいものであることから、特にゲームなどにおいて没入型の操作方法をユーザーが把握できるようにしておくと便利です。
このカードには、ゲームの手順や、UI の操作方法や操作のガイドが表示されます。スプラッシュ画面の [手順] メニュー項目をタップすると、この画面が表示されます。
ゲームプレイ モード
これらの画面は、メインのゲームプレイ フローで構成されています。ユーザーはスプラッシュ画面で [New game] メニュー項目をタップするとこのフローにアクセスできます。
このカードには、ランダムな単語（最大 10 個）が表示されます。前方にスワイプし、単語を正しく説明しているときにタッチパッドをタップすると、単語をスキップできます。
ゲームの結果画面
この画面にはゲームの結果が表示されます。最初は [ゲームオーバー] 画面が表示されます。ユーザーは前方にスワイプしてゲームの結果を表示できます。いずれかの結果カードをタップすると、[新しいゲーム] メニュー項目が表示され、別のゲームを開始できます。
音声コマンド
設計プロセスのかなり早い段階で、音声コマンドを特定する必要があります。音声コマンドにより、ユーザーは必要に応じて Glass Home で（時計の）音声メニューから Glassware を起動できます。これは、Glassware の設計方法の大部分を占めます。
たとえば、更新を投稿するコマンドがファイア アンド フォーゲット方式の場合は、ユーザーがコマンドとテキストを読み上げ、Glassware がユーザーの介入なしで処理を行います。これにより、ユーザーは現在の作業にすぐに戻ることができます。
一方、「ゲームで遊ぶ」などの場合、通常は最初にスプラッシュ画面を表示し、最初にユーザーが誘導されるようにします。多くの場合、この音声コマンドは没入型を起動するため、ユーザーはゲームを開始するために追加の画面やメニューを表示しても問題ありません。音声コマンドの直後にユーザーをゲーム体験にすぐ誘導するのは、通常はゲームにとって不適切なエクスペリエンスです。
Charades はゲームをプレイする音声コマンドを使用します。ユーザーが音声コマンドを起動すると、Charades スプラッシュ画面が表示されます。ユーザーはタップでその他のオプションにアクセスします（この場合は、[新しいゲーム] または [手順]）。
カード レイアウト
没入型カードとライブカードのどちらでも、可能であれば CardBuilder または XML レイアウトを使用してください。
多くの場合、いずれにしても独自のレイアウトの作成が必要になるため、最適な UI を得るには Glass の UI ガイドラインを遵守する必要があります。
ストップウォッチは一般的なレイアウト ガイドラインに従いますが、ビューやレイアウトなどの標準の Android コンポーネントを使用するカスタム UI レイアウトがあります。
開発
臨場感を高めるには、Android 開発で使用するツールと同じツールを使用して Glassware を一括ビルドし、GDK アドオンの API を使用してジェスチャー検出器や音声コマンドなどの Glass 固有の機能にアクセスします。
一般的な Android コンポーネントを使用して Glassware を作成することがよくありますが、概念によっては異なる場合もあります。たとえば、没入感を Android アクティビティと同等にしないでください。没入感とは、1 つ以上の Android アクティビティの他、GDK と Android SDK の多くのコンポーネントを使用して構築された Glass 向けのエクスペリエンスのことです。
残りの開発セクションでは、Charades ゲームの構造と、以前にインポートしたプロジェクトの主要なコンポーネントについて説明します。Android Studio を稼働させておくと便利です。ソースコード自体にコメントしているため、このセクションでは各ファイルの大まかな目的と、自分の Glassware に適用できる便利なヒントについて説明します。
Charade の主なコンポーネントの概要は次のとおりです。
- 音声トリガーの宣言で Glass のメイン音声メニューに接続します。
- スプラッシュ画面のアクティビティ: ユーザーがゲームを開始したり、手順を確認したりできるようにします。このアクティビティは、命令アクティビティまたはゲームプレイ アクティビティを起動します。
- チュートリアル アクティビティは、ゲームのメイン アクションを実際に実行してゲームをプレイする方法を示すものです
- ゲームプレイ アクティビティにより、ユーザーは実際のゲームをプレイできます
- 結果アクティビティには、ゲームのスコアと、推測された推測しない単語のリストが表示されます。また、メニュー項目から新しいゲームを開始することもできます。
音声コマンド
XML リソース ファイルを使用して音声コマンドを作成するには、使用するコマンドを指定し、AndroidManifest.xml ファイルで XML リソースを指定します。
次のファイルは、Charades 音声コマンドに関連付けられています。
res/xml/voice_trigger_play_a_game .xml- 使用する音声コマンドを宣言します。AndroidManifest.xml- 音声コマンドが発話されたときに開始するアクティビティを宣言します。
スプラッシュ画面のアクティビティ
スプラッシュ画面は、ユーザーが Charade を起動したときに最初に表示されるもので、ゲームを開始する前にそれに目を向けます。
このアクティビティには、次のファイルが関連付けられています。
res/layout/activity_start_game.xml- スプラッシュ画面のレイアウトを宣言します。res/menu/start_game.xml- スプラッシュ画面のメニュー システムを宣言します。これには、手順と新しいゲームのメニュー項目が含まれます。res/values/dimens.xml- Glass のスタイルに従うためにこのプロジェクトのアクティビティで使用する標準のカードのディメンションとパディングを宣言します。src/com/google/android/glass/sample/charades/StartGameActivity.java- スプラッシュ画面のメインクラス。res/drawable-hdpi/ic_game_50.png- 新しいゲームのメニュー アイコン。res/drawable-hdpi/ic_help_50.png- 手順のメニュー アイコン。
ゲームモデル
ゲームのモデル（ゲームの状態）を UI から分離することをおすすめします。CharadesModel クラスは、ゲームのスコアと、ゲームプレイ モードで推測されたフレーズの数、さまざまな命令、ユーザーが命令モードでそれらを実行したかどうかを追跡します。
次のファイルがゲームモデルに関連付けられています。
src/com/google/android/glass/sample/charades/CharadesModel.java
ベース ゲーム アクティビティ
ゲームのチュートリアル モードとゲームプレイ モードは、非常に類似した機能と UI を共有するため、この基本クラスは両方の共通機能を定義します。命令モードとゲームプレイ モードのアクティビティは、このクラスを拡張します。
このアクティビティには、次のファイルが関連付けられています。
res/layout/activity_game_play.xml- Charade のゲームプレイ モードと手順モードで共有されるレイアウトを定義します。src/com/google/android/glass/sample/charades/BaseGameActivity.java- 共有されるゲームプレイ モードとインストラクション モードの基本機能を定義します。
インストラクションのアクティビティ
インストラクション アクティビティでは、ゲームのプレイ方法を説明する 3 枚のカードが表示されます。カードを続行する前に、カードに表示された操作を行ったかどうかを検出します。
このアクティビティには、次のファイルが関連付けられています。
src/com/google/android/glass/sample/charades/TutorialActivity.java-BaseGameActivityを拡張し、ユーザーがゲームの手順を進めたときに表示する指示テキストと操作の処理方法を定義します。
ゲームプレイ アクティビティ
ゲームプレイ アクティビティはゲームのメインフローを定義します。表示する単語を特定し、スコアを保持する方法、ジェスチャーを処理するジェスチャー検出器を備え、ゲームが終了したときに結果アクティビティを起動します。
このアクティビティには、次のファイルが関連付けられています。
GamePlayActivity-BaseGameActivityを拡張したもので、メインのゲームフロー ロジックを含んでいます。
結果アクティビティ
結果アクティビティには、推測された単語、推測されていない単語、ゲームのスコアが表示されます。また、ユーザーが新しいゲームを開始できるメニュー項目も含まれています。
このアクティビティには、次のファイルが関連付けられています。
res/layout/game_results.xml- ゲームオーバー カードのレイアウトを定義します。res/layout/card_results_summary.xml- 推測された単語と推測されていない単語をリストに表示するレイアウトを定義します。res/layout/table_row_result.xml- 結果の概要の個々の行レイアウトを定義します。src/com/google/android/glass/sample/charades/GameResultsActivity.java- 前述の XML リソースで定義されたレイアウトとメニューを示す実際のアクティビティを定義します。res/raw/sad_trombone.ogg- ユーザーが単語を最後まで再生していないときに再生される音。res/raw/triumph.ogg- ユーザーが 10 ワードを最後まで再生したときに再生する音。res/drawable-hdpi/ic_done_50.png- 推測した単語によって表示されるチェックマーク アイコン。
アニメーション リソース
次のアニメーション リソースは、Charades をさらに改良します。
res/anim/slide_out_left.xml- 単語が渡されたときなどに、外部に移動するビューをアニメーション化して左にスライドアウトします。res/anim/slide_in_right.xml- 入口ビューをアニメーション化して、右からスライドインします（新しい単語が入ったときなど）。res/anim/tug_right.xml- スワイプを使用しないビューをスワイプしてスワイプする場合のアニメーションを定義します。これにより、スワイプが効果なかったことをユーザーに知らせることができます。
Android マニフェスト
AndroidManifest.xml ファイルは Glassware の主要なコンポーネントを記述しているので、その実行方法はシステムによって認識されます。Charades のマニフェストでは、次のものを宣言します。
- Glassware のアイコンと名前。複数の Glassware が同じ音声コマンドに応答すると、この情報がメインのタッチメニューに表示されます。
- Charades に関連するすべてのアクティビティ。これは、システムが Glassware のアクティビティを起動する方法を知るために必要です。
- 音声コマンドと、音声コマンドが発話されたときに特定のアクティビティを開始するインテント フィルタ。
- Glassware のバージョン コード。この APK の新しいバージョンが MyGlass にアップロードされるたびに、このコード（および通常はバージョン名）を更新する必要があります。