こんにちは、さかたです。
最近、技術のインプットに飢えていて「何かおもろいものないかな~」とPCをカチカチしていたところ、Adobeのソフトで『Adobe Aero』というものを見つけました。
「Adobe Aero」とは?
AR(拡張現実)の世界を作り出せる機能です。カメラ越しに、現実の風景に3Dオブジェクトやアニメーションを重ねて表示できます。難しいプログラミングは不要で、誰でも直感的にAR体験を作れます。
|
ざっくり説明すると、↓こういうのが簡単に作れますよ~ってソフトです。
PCの上で高速回転アルマジロ
おもしろそうやないか~~~い!
話は変わりますが、弊社は今年7月で15周年を迎えます。
15周年祝いで何をやろうかなぁとデザイナーさん達が熟考中なので、彼女たちを応援するARを作りたいと思います。
今回はデスクトップのBeta版を使用します。
また、本当はもっとスマートなやり方があると思いますが、その辺りは今後このソフトを使う場面がきたら極めていこうと思います。
素材を準備
まずはARで表示したい素材を準備します。
立体素材を準備するのは時間がかかるので、今回は平面の素材にしました。
ARで動きは付けたいので、動きに合わせて素材を分解してPNG画像を保存します。

Adobe Aeroに素材を取り込む
作成したPNG画像を取り込みます。メニューから「ファイル」→「インポート」を選択し、画像を選んでインポートしてください。
この時、なぜかファイルパスに日本語が含まれているとエラーが発生し、正常にインポートできませんでした…。
これは、Aeroが特定の文字コードやファイルパスの構造に対応していないために起こる可能性が高いです。残念ながら、Aero側の設定で日本語や特殊文字を含むファイルパスを許可する方法を見つけられなかったので、同じ現象が起こる場合は、ファイルパスを英数字だけにすると解消されると思います。

配置を調整
画面右側にパーツ一覧があるので、動かしたいパーツを選択し、赤・青・緑の矢印で調整します。
サイズは画面右下に「Size」を見つけたので、ここで調整できます。

動きを付ける
画面左下に非常口マークのようなアイコンがあるので、クリックします。ビヘイビアービルダーってやつで、動作を付ける場所です。
「+トリガー」ボタンが表示されるので、クリックしてどのタイミングで動きを付けたいのか選択します。

「+アクション」ボタンで動きをどんどん付けます。どのパーツを、どのタイミングで、どのくらいの時間で、どのように動いてほしいのか。画像内の右の赤枠エリアでひたすら組み立てです。
横方向が時間軸なので、Adobe Premiereと感覚が似てるかも~と思いました。

書き出し
プレビューで動きを確認して問題なければ完成です!
画面右上の「share」をクリックして共有用のURLやQRコードを生成します。

完成~~~👏👏👏
今回作成したARはこちらのQRコードから確認できます!これが偉大なるAR制作の第一歩だーーーーっ!!!

私が作業データを整理して、いつか読み込めなくなる日が来るかも…
また何かおもしろそうなことがあれば、チャレンジしてみようと思います。
それでは~。
こんにちは、さかたです。
最近、技術のインプットに飢えていて「何かおもろいものないかな~」とPCをカチカチしていたところ、Adobeのソフトで『Adobe Aero』というものを見つけました。
ざっくり説明すると、↓こういうのが簡単に作れますよ~ってソフトです。
PCの上で高速回転アルマジロ
おもしろそうやないか~~~い!
話は変わりますが、弊社は今年7月で15周年を迎えます。
15周年祝いで何をやろうかなぁとデザイナーさん達が熟考中なので、彼女たちを応援するARを作りたいと思います。
今回はデスクトップのBeta版を使用します。
また、本当はもっとスマートなやり方があると思いますが、その辺りは今後このソフトを使う場面がきたら極めていこうと思います。
素材を準備
まずはARで表示したい素材を準備します。
立体素材を準備するのは時間がかかるので、今回は平面の素材にしました。
ARで動きは付けたいので、動きに合わせて素材を分解してPNG画像を保存します。
Adobe Aeroに素材を取り込む
作成したPNG画像を取り込みます。メニューから「ファイル」→「インポート」を選択し、画像を選んでインポートしてください。
この時、なぜかファイルパスに日本語が含まれているとエラーが発生し、正常にインポートできませんでした…。
これは、Aeroが特定の文字コードやファイルパスの構造に対応していないために起こる可能性が高いです。残念ながら、Aero側の設定で日本語や特殊文字を含むファイルパスを許可する方法を見つけられなかったので、同じ現象が起こる場合は、ファイルパスを英数字だけにすると解消されると思います。
配置を調整
画面右側にパーツ一覧があるので、動かしたいパーツを選択し、赤・青・緑の矢印で調整します。
サイズは画面右下に「Size」を見つけたので、ここで調整できます。
動きを付ける
画面左下に非常口マークのようなアイコンがあるので、クリックします。ビヘイビアービルダーってやつで、動作を付ける場所です。
「+トリガー」ボタンが表示されるので、クリックしてどのタイミングで動きを付けたいのか選択します。
「+アクション」ボタンで動きをどんどん付けます。どのパーツを、どのタイミングで、どのくらいの時間で、どのように動いてほしいのか。画像内の右の赤枠エリアでひたすら組み立てです。
横方向が時間軸なので、Adobe Premiereと感覚が似てるかも~と思いました。
書き出し
プレビューで動きを確認して問題なければ完成です!
画面右上の「share」をクリックして共有用のURLやQRコードを生成します。
完成~~~👏👏👏
今回作成したARはこちらのQRコードから確認できます!これが偉大なるAR制作の第一歩だーーーーっ!!!
私が作業データを整理して、いつか読み込めなくなる日が来るかも…
また何かおもしろそうなことがあれば、チャレンジしてみようと思います。
それでは~。