こんにちは。ゲームUIデザイナーのはなさくのです。

今回は、AfterEffectsで、レベルアップ演出を作る方法についてご紹介します！

01｜【AE】レベルアップ演出の作り方

ブルーアーカイブの演出を参考にサンプルアニメーションを作成してみました。便利機能に頼ることができず、ほぼ手作業で地道に作成していきました。

中央から三角形が外側に広がっていった後に、中央に少し戻り、軽く点滅してから消えるという演出になっています。

また中央から外側に広がっていくサークルがいくつも重ねられて、細かい動きをしています。

こういったゲームUI演出ですが、ぼんやり見ているだけでは気づかない部分が本当にたくさんあります。

小さな動きをたくさん組み合わせてリッチな表現になっている気がしますね。

また、今回、Photoshop等では素材を作らず、すべてAfterEffectsのシェイプで図形を作成しています。

AfterEffectsの機能でなんとか楽に作れないかと試行錯誤したのですが、不規則な動きが多く、一律で揃えることが難しかったため、結局は地道な作業になりましたが、良い勉強になりました。

実際に下記よりAEデータをダウンロードして、確認してみてくださいね！

02｜データダウンロード

02-01｜許諾事項

データは、AfterEffects 2022で作成したものになります。古いバージョンを使用している場合は、エラーが発生する場合がありますので、ご了承ください。

AfterEffectsについては、使用プラグインなしで、標準エフェクトのみで作成しています。

02-02｜禁止事項

• 二次配布、再配布、素材の販売、無断転載、シェア利用等は禁止します。

• 今回は既存ゲームを参考にサンプルを作成しているため、そのままの使用は禁止です。勉強のためにお使いください。

• 著作権は放棄しておりませんので、素材データの複製譲渡や再配布、販売等著作権を侵害する行為は禁止します。

• データ販売になりますので、返品返金はご遠慮ください。