投稿日:2021年1月31日
2022年2月24日 追記
以下、2月21日にAWSより届いたメールを引用します。
“2022年2月21日より、Amazon Sumerianの既存のエクスペリエンスと機能を移行し、Babylon.jsを使用してシーンを作成し、AWS Amplifyで公開できるようにします。”
という記載通り、仕様が大きく変更され、本ブログで紹介しているような作成方法ではコンテンツが作れなくなったようです。
以降、詳細を調べお伝えできたらと思います。
本記事は参考程度にしてください。
久しぶりにAWSのことを書きます。
3D作成といえば、Cinema 4DやShade、Adobe Dimensionなどが有名ですが、今回はAWSサービスの1つで、しかも、ブラウザベースで3Dコンテンツを作成できるAmazon Sumerian を紹介します。
▲Amazon Sumerianのトップ画面。
画面右上のコンソールにサインイン、もしくはAmazon Sumerianの使用を開始するをクリックします。
最初にお見せします。今回作るのは▼こちらです。
※ロードに時間がかかります。
▲ルートユーザーでログインします。
ユーザー登録がお済みで無い場合、こちらからAWSアカウントの作成 をしてください。
sumerianで作成する前に、キャラクターをしゃべらせるのに必要な設定を済ませておきましょう。
sumerianでしゃべらせるため、Amazon Pollyへのアクセスが必要になります。
AWSの別のサービスへのアクセス許可のため、Cognito IDプールの作成が必要になります。
さらに、作成したCognito IDプールをIAMロールと連携させ、IAMロールにsumerianのポリシー(機能)をアタッチ(適用)します。
文章だけでは分かりづらいですね。。。
以下、手順です。
▲AWSにサインインしたらCognitoをクリックします。
▲Amazon Cognitoの画面。
IDプールの管理をクリックします。
▲新しいIDプールの作成をクリックします。
既存のものがグラフで表示されています。
▲IDプール名に任意の名前を付けます。
認証されてないIDに対してアクセスを有効にするにチェックを入れ、プールの作成をクリックします。
▲注意書きの画面が表示されます。
DeepLで訳しました。
新しい ID プールで使用する IAM ロールを特定します。
新しいAmazon Cognitoのアイデンティティプールを使い始める前に、アプリケーションのエンドユーザーがAWSリソースにアクセスできるレベルを決定するために、1つまたは複数のIAMロールを割り当てる必要があります。アイデンティティプールでは、認証済みと未認証の2種類のアイデンティティを定義します。それぞれにIAMでの役割を割り当てることができます。認証済みアイデンティティは、パブリックログインプロバイダ(Amazon Cognitoのユーザープール、Facebook、Google、SAML、またはOpenID Connectプロバイダ)や開発者プロバイダ(独自のバックエンド認証プロセス)によって認証されたユーザーに属しますが、未認証アイデンティティは通常ゲストユーザーに属します。
Amazon Cognitoがユーザーのリクエストを受信すると、サービスはリクエストが認証済みか未認証かを判断し、どのロールがその認証タイプに関連付けられているかを判断し、そのロールに関連付けられたポリシーを使用してリクエストに応答します。選択する詳細なIAMロールの例のポリシーのリストについては、『Amazon Cognito Developer Guide』のIAMロール を参照してください。
注意事項
ベストプラクティスとして、最小の権限を付与するという原則に従うポリシーを定義します。言い換えれば、ポリシーには、ユーザーがタスクを実行するために必要な権限のみが含まれている必要があります。詳細については、『IAM ユーザーガイド』の「最小特権の付与 」を参照してください。認証されていない ID は、アプリにログインしていないユーザーによって想定されることを覚えておいてください。一般的に、未認証の ID に割り当てる権限は、認証済みの ID に割り当てる権限よりも制限的なものにする必要があります。
▲詳細を表示をクリックすると展開します。
認証、未認証のIDがそれぞれCogniteへアクセスする旨が書いてあります。
ロール名は任意です。このまま許可をクリックしIAMロールを作成します。
▲これでCognite IDプールができました。
サンプルコード内の赤いぼかし箇所にIDプールが記載されています。
右上のIDプールの編集をクリックすると細かい編集や削除ができます。(今回は割愛)
▼プラットフォームをプルダウンすると、各OSが表示されます。
ここでは必要に応じて開発環境のツールがダウンロードできるようです。
▲是非チャレンジしてみたいですね。
次は作成したIAMロールにsumerianのポリシー(機能)をアタッチ(適用)します。
▲再びAWSマネジメントコンソールに戻り、IAMをクリックします。
▲ロールをクリックします。
▲作成されたロールが表示されます。
先ほど作った2つのうちからCognito_xxxxxxUnauth_Roleをクリックします。
※xxxxxxはCognite IDプール名。
▲ポリシーをアタッチします をクリックします。
▲フィルターに入力し表示されたAmazonPollyReadOnlyAccessにチェックを入れ右下のポリシーのアタッチをクリックします。
AmazonPollyReadOnlyAccessはAmazon Pollyへのアクセスを許可するためです。Sumerianのテキストを音声にレンダリングします。
▲AmazonPollyReadOnlyAccessがアタッチされました。
▲同様にAmazonS3ReadOnlyAccessをアタッチします。
AmazonS3ReadOnlyAccessはS3へのアクセスが可能になります。
▲これでポリシーのアタッチは完了です。
次はいよいよSumerianでコンテンツを作ります。
▲AWSマネジメントコンソールからAmazon Sumerianをクリックします。
▲Amazon Sumerianのトップ画面。
テンプレート、チュートリアルも充実しています。
▲今回はテンプレートからシーンを作成の中からSpeech & Gestures を選択します。
▲任意名前を付けます。
▲画面が開きます。
概要は下記。
❶ファイルに関する項目。
▲シーンに関する操作を行う。
▲speechやジェスチャースクリプトを記述するテキストエディタや、アニメーションを設定するタイムラインを表示します。
※アクションを追加するステートマシンは変化しませんでした。
▲エンティティ
上図のものが追加できます。
空のエンティティを追加すると親子関係を作れます。
HTML 3DにはYouTubeなども表示できます。
▲アセット
量が多いので動画にしました。
他にヘルプや公開があります。
❷エンティティパネル
▲実体という意味。カメラやライト、3Dオブジェクトなどを束ねておくもの。ディレクトリのようなもので空のエンティティ追加で親子関係を作ることもできる。
❸アセットパネル
▲マッピングデータ、スピーチ、ジェスチャー、Behavior(動きのシナリオ)など、エンティティを構成する素材を管理しています。
❹プレビューパネル
制作物や再生結果を確認します。
❺動作の流れを関連付けるステートマシンエディタとアニメーションを定義するタイムラインが表示されます。
▲ステートマシン
ロードしたら話し始める。クリックしたら話し始める。などのアクションの関連付けを行います。
▲タイムライン
可能なのは移動、回転、拡縮など簡単な動きだけのようです。
❻インスペクターパネル
エンティティで選択されたオブジェクトのプロパティを設定します。
選択されているものによって項目が変わります。
▲シーン全体を選択した場合。
前述したCognite IDプールもここで設定します。
これがないとキャラクターが話しません。
その他、必要に応じて設定します。
▲キャラクターを選択した場合。
音声(speech)や、ジェスチャー、ステートマシンの設定もここで行います。
これらはコンポーネントと呼ばれるもので、必要に応じて追加します。
その他、ここでは紹介仕切れないのでAmazon Sumerian ユーザーガイド をご覧ください。
では、制作手順です。
▲エンティティパネルからキャラクターのCristineを選択します。
▲プロパティパネルが切り替わるので音声をクリックし詳細を表示します。
デフォルトの音声はAmyになっていまが、日本語をしゃべらすならMizuki(女性)かTakumi(男性)を選択します。
音声ファイル(SSML付与)が既存でしたら、音声ファイルをドロップし、制作するなら+ボタンをクリックします。
既存のGestureSpeechとIntroSpeechはジェスチャや音声のサンプルを再生できますが、再生時にこちらが優先されてしまうので削除した方が良いでしょう。
※再生時、ビヘイビアを切り替えても不可避でした。
ジェスチャマップは英語の場合の単語に合わせて自動的にジェスチャを割り当てるものなので、日本語の場合は必要ありませんが、スピーチテキストにXMLタグを入力する必要があります。
▲テキストエディタが表示されました。
しゃべらせたい語句をSSMLタグ付きで記述します。
サポートされているSSMLタグはAmazon Pollyのものを参照してください。 。
ちなみに上述したGestureSpeechとIntroSpeechのテキストもここにあるので、どのような記述が、どのようなジェスチャをするのか検証することができます。
記述、変更が終わったら左下の保存ボタンをクリックするのを忘れないようにしてください。
▲次にステートマシンの操作をします。ステートマシンが表示されてなかったらコンポーネントの追加から表示させてください。
動作の削除の隣の+ボタンをクリックします。
▲Behaviorが追加されました。
今回は自己紹介という名前にしました。
state 1が表示されていることを確認し、アクションの追加をクリックします。
▲アクションの追加で表示されたステートマシンエディタ
▲アセットパネルにも追加されました。
▲アクションの追加画面。
検索窓にawsと入力し、表示されたAWS SDK Readyを選択し右下の追加をクリックします。
AWS SDK Readyは読み込みが終わり、次のアクションへの移行が可能になったことを意味します。
▲state 1にアクションが追加されました。
左上の+ボタンをクリックしstate 2を追加します。
同様にstate 2にもアクションを追加します。
▲state 2のアクションはクリック、スマホだったらタップすると次のアクションが動作する仕組みにします。
検索窓にclickと入力し、表示されたClick/Tap on entityを選択し、右下の追加をクリックします、
▲同様にstate 3を追加し、Start Speechのアクションを追加します。
▲state 3でspeechからしゃべらせたいテキストを選択します。
▲state 1よりドラッグして矢印を引っ張り出し、state 2へ、state 2からstate 3へ、state 3からstate 2へ矢印を結びつけます。
state 3でしゃべり終わっても、再度クリックするとしゃべり始める仕組みのためです。
ここまでが一通りの作業になります。
▼プレビューで再生して確認しましょう。
YouTubeにアップしました。
注意として、音声テキストのSSMLタグ、<break time="1500ms"/>
はスピーチとの間を開ける記述で、この記述では1.5秒の設定になっています。
ジェスチャのアクションには時間がかかるものもあり、breakタグの時間の設定と、下図の各数値を調整しないと再現できないものもあります。
調整しながら動作確認を行いましょう。
最後にメニューの公開ボタンをクリックし公開します。
▼再度公開したものを載せておきます。
▲マウススクロールで拡縮します。option(winだとalt)+ドラッグで画面をグリグリ動かせます。
視線はこちら(メインカメラ)を追従します。
Amazon Sumerianは上記のような3Dコンテンツだけではなく、AR、VRコンテンツ作成も可能です。
しかもAWSサービスの1つ、Amazon Lexと組み合わせるとオリジナルのチャットボットを作ることもできます。
※2021年1月31日現在、日本語には未対応のようです。
今回はキャラクターにしゃべらせるだけでしたが、カメラをタイムラインで動かし、視線を追従させるような効果を作ることもできます。
その他、HTML 3DというアセットにYouTubeを埋め込むことも可能です。
さらに出来ることを検証したいと思います。
最後まで読んでくださりありがとうございました。