← 戻る

#876 開発工程日誌「#035 オーディオファイル機能についての話」

2022/12/06

こんにちは。影織です。

今回は、オーディオに関する機能を中心にお話しました。

オーディオファイル機能が追加されたよ!

音声ファイル対応が入り、 img-motionの上の方に音符マークが表示されるようになりました。 ここでアニメーションにつけるSE用音源の登録ができて、 一覧で確認することができます。 アニメーションの設定画面の方では、右下にsoundを設定できる箇所が増えました。 キーフレームに合わせて、このタイミングで音を鳴らしたい! というところに追加できるようになっています。 あとは音源を削除できるような実装と、 音の長さを確認できるような実装が追加で必要になります。 アニメーションに合わせて鳴らす時に、音がどれくらい長いかわかりやすければ、 実装を進めやすそうです。

その他のimg-motion追加項目

Aboutモーダル表示

gitのハッシュ値を取得して、現在のバージョンが表示されるようになりました。 ただ、netlifyではフォルダ構成が違って、この値がうまく取れないようです。 タイムスタンプをハッシュ化して出すのが良さそう、という話になりました。

アニメーションの名前変更、コピー機能追加

アイコンから、簡単に名前変更やコピーができるようになりました。

アニメーションのemptyの追加

画面遷移したタイミングなど、emptyのアニメーションが出るようになりました。 emptyの場合、ちゃんとデータを触れないようになっています。

アニメーション種別の限定

以前は、アニメーション再生時の挙動として、ease-inやease-outなどを選択できたのですが、 shapeのタイミングがおかしくなるので、linearのみ選択できるようになりました。

iframeの使用

ヘルプとトップ画面、音声追加部分はiframeで表示するようにしたそうです。 見た目に大きな変化はないのですが、これにより、 アニメーションをセットするところとメモリを分けているそうです。 なるほど、そんな裏技があったのか!と目から鱗でした。

ゲームエンジン側の追加項目について

アニメーション再生回数について

基本的に全て無限ループ再生にしておき、再生回数を指定したい場合、 開始と終了はイベントフラグで管理できるようになるようです。

データの置き場について

データを外出し化するかどうか、という話も出ました。 そうなるとURLの置き場所を作らないといけないので、 今回は一旦内部だけで読み込みを完結できるようにする方針になりました。 Google Driveに置くアイデアも出してみたのですが、 データの直リンクができないんですよね。 今後、データの容量が問題になってきたら、再考することにしましょう。

img-motionのオーディオ追加操作について

3Dアニメーションのキーフレーム操作をするときのように、 キャラクターの各パーツのアニメーションキーフレームを一覧で見ることができる機能があるといいよね、という話が出ました。 その中で、音声をアニメーションのタイムライン上にどのように出すか、という話になりました。 アニメーションとサウンドを分けようかというアイデアもあったようですが、 1アニメーション内で、複数のSEの鳴らしやすい構造にすることや、 微妙な再生タイミングを楽に操作できるようにしたい、という観点から、 キーフレームと一緒に触れるようになっていると良さそうです。 音がアニメーションとピッタリあっていると、臨場感が出ますが、 ズレていると違和感がすごく出てしまうものです。 この辺りは、ツールを駆使して細かく作り込んでいきたいですね。