AnyPortraitで写真に動きを付ける①

Unityアセットストアの2022 年の旧正月セール(メガバンドル)にAnyPortraitというツールが含まれていたので使ってみることにしました。

 

Unsplashから気球の写真をダウンロードして、気球に動きを付けます。

f:id:rarao89:20220306135023g:plain

 

AnyPortraitの習得のため、今後は画像内をクリックしたら写真が反応して動くようなものを作ろうと思います。

 

まずは上の状態を作るまでの手順を記事にしていきます。

 

【手順】

①画像を準備

②PSDファイルに変換(画像編集ソフト)

③AnyPortrait起動(Unityエディタ上)

④画像取り込み

⑤メッシュの作成

⑥メッシュグループの作成

⑦Morph(Controller)の追加

⑧アニメーションクリップの作成

⑨「ルートユニットの登録」

⑩ベイク

 

 

①画像を準備

・使用したい静止画を準備します。

 今回はUnsplashからフリー素材(.jpg)をダウンロードして使いました。

 私はPhotoImpactという昔買った画像編集ソフトを使っていますのでそちらで説明しますが、psd形式で出力できるソフトであれば何でも大丈夫だと思います。

 ※ .psd形式:Adobe社の画像編集ソフト「フォトショップPhotoshop)」で利用される標準の画像ファイル形式

 

 

②PSDファイルに変換(画像編集ソフト)

・使用したい画像(左)を読み込んだ後、同じサイズの新規画像(右)を作成します。

新規画像の色は何色でもいいと思います(私は黒にしました。)

f:id:rarao89:20220306163959p:plain

 

・左の画像を切り取り、右の画像の上に貼り付けます。この状態は2枚の画像が重なった状態で、2つの層を持った画像になります。

f:id:rarao89:20220306165045p:plain


・右側の画像を.psd形式で保存します。

f:id:rarao89:20220306165331p:plain

 

 

③AnyPortrait起動(Unityエディタ上)

・Unityエディタで2Dプロジェクトを新規作成します。(プロジェクト名:Hot air Balloon)

f:id:rarao89:20220306170435p:plain

 

・Window-Package Managerを表示し、My AssetsからAnyPortraitを選んでImportします。(AnyPortraitは購入済であること)

f:id:rarao89:20220306170901p:plain

 

・Window - AnyPortrait - 2D Editor でAnyPortraitの編集画面を開きます。

・Make New Portraitボタンをクリックし、新しいPortraitを作成します。

(今回は名前をHot air balloonにしました。)

f:id:rarao89:20220306171653p:plain

 

 

④画像取り込み

・PSDファイルの読み込み

・PSDを開く で先ほど保存した.psdファイルを選択する。

f:id:rarao89:20220306235431p:plain

 

・次へをクリック

f:id:rarao89:20220306235951p:plain

 

・警告が出たら保存フォルダを指定する。

f:id:rarao89:20220307000334p:plain

 

・焼く(Bake)をクリックするとファイルが2つできる。

f:id:rarao89:20220307000916p:plain

 

・完了をクリックすると画面左の階層に画像2つとそれに対応したメッシュが2つ追加される。

f:id:rarao89:20220309210556p:plain

 

~長くなったので記事を分けます。~