プレイヤーが歌詞を変えていく “遊べるミュージックビデオ” CRI ADX LE ユーザーインタビュー Vol.10 『リリカルアナグラム』

遊べるミュージックビデオ『リリカルアナグラム』の作者「kuma」氏に制作背景を直接伺いました。
『リリカルアナグラム』のインタラクティブな音楽演出には CRI ADX LE が使用されており、
unityroom上でプレイ可能な「遊べるミュージックビデオ」として公開されています。
本稿を読み進める前に、ぜひ一度『リリカルアナグラム』をプレイしてみてください。
先日の『Q-SIDE』のインタビュー記事と繋がる部分も多いので、そちらもぜひご覧ください。

インタビュイー: kuma(@kuma0130msc)
インタビュアー: 株式会社ヘッドハイ 一條貴彰, ＣＲＩ・ミドルウェア
編集: ＣＲＩ・ミドルウェア

1. 『リリカルアナグラム』の制作にあたって

一條:
今日はよろしくお願いします。
まず、自己紹介と今作の紹介をお願いします。

kuma:
kuma(@kuma0130msc)といいます。主にボーカロイドの楽曲を趣味で制作・投稿しています。
先日のボカコレで、遊べるミュージックビデオ『リリカルアナグラム』を制作しました。
基本的には倉庫番ゲームのような操作方法になっていまして、ミュージックビデオがインタラクティブに変化する作品となっています。
歌詞の穴が空いた部分に文字をはめて文章を完成させるとリアルタイムに歌詞が変わる、プレイヤーが歌詞を変えていけるミュージックビデオです。

ＣＲＩ・ミドルウェア:
遊べるミュージックビデオの制作をはじめたきっかけなどはありますか？

kuma:
少し前に、「じーくどらむす」さんのインタラクティブミュージックの記事を読む機会がありまして、
そこからインタラクティブミュージックに興味を持ち、私も楽曲の表現としてゲーム方面でなにかできないかと思い、ゲーム制作を開始しました。

kuma:
実は、遊べるミュージックビデオとしては今作の『リリカルアナグラム』が二作目で、
一作目は去年に制作した『デイズインアメイズ』※で、こちらは見えない迷路を進む方向やゴールの近さによって音楽の曲調が変化するインタラクティブな迷路を制作していました。

※ 【遊べるMV】デイズインアメイズ / 初音ミク https://unityroom.com/games/daysinamaze

一條:
今作の仕組みはどのように思いついたのでしょうか？

kuma:
曲調を変化させる演出自体は以前の作品で既にやってみていました。
その時は、バックグラウンドミュージックとして流れている複数のトラックをクロスフェードで変化させるやり方でした。
その開発を通じてインタラクティブなやり方の雰囲気を掴めたので、
今度はバックグラウンドミュージックの変化じゃなくて、歌詞の変化をやっていこうと思いました。

2. CRI ADX LE 導入や利用した機能

一條:
次に、今作の開発について訊かせてください。
CRI ADX LEを導入したきっかけは何でしょうか？

kuma:
WebGLビルドがCRI ADX LEで使用できるようになったことです。
以前の作品では、じーくどらむすさんがgithubで公開している『MusicEngine』※を使って実装していました。

※ MusicEngine https://github.com/geekdrums/MusicEngine

kuma:
今作のタイミングで、ちょうどCRI ADX LEがWebGLビルドに対応したので、使ってみようと思いました。
元々、サウンドミドルウェアを調べたりしていたのですが、CRI ADXはネット上に知見が多く、日本語の資料も多いことがありがたかったです。
それと、CRI Atom Craftでの作業は、楽曲をシーケンスとして波形を見ながら編集できるのが嬉しいですね。

一條:
CRI ADXの機能をどのように活用していますか。

kuma:
曲の区切りやステージ切り替えのタイミング管理に、コールバックマーカーを使用しています。
画像のようにコールバックマーカーを曲のデータに埋め込んで、プログラム側でマーカーのIDやタグ（例: B1, B2）を受け取って処理しています。

実装としてはコールバックマーカーを読み取った後、プレイヤーの操作に応じて表示するテキストやトラックのフェード、ステージの切り替える処理を行っています。
具体的には、まず歌詞となる文字を表示して、期限の時間までにプレイヤーが操作して、コールバックマーカーの時点でプレイヤーの操作結果をフラグとして読み取る。
その後、読み取ったフラグによってトラックのフェードを切り替える、という処理の順序になっています。

ＣＲＩ・ミドルウェア:
CRI ADXは時刻の精度にこだわっているので、コールバックマーカーで制御する仕組みとなっているのは嬉しいです。
トラックの構成やフェードの切り替えなどはどのように実装されたのでしょうか。

kuma:
オーディオトラックの構成は、インストゥルメンタルトラックと3つのボーカルトラックを用意していて、これらをフェードで切り替えています。
トラックの切り替え時のフェード設定はAISAC機能で行っており、シンプルなカーブを使っています。

一條:
その他の機能はどうですか？

kuma:
基本的には話した機能だけで完結していますが、あとはマスターにリミッターをかけています。
−10dbに設定して、音割れしないようにしています。

3. 制作中に起きた問題や困ったこと

一條:
ゲーム内の背景は動画になっています。
この動画と音楽のズレなどはありましたか？

kuma:
Webブラウザ上の実行では、ゲーム内の背景動画と音声がズレていく問題が起こりました。
対処として、楽曲の再生時刻と動画の再生フレームを比較し、両者のずれが一定以上になったら動画をシークして同期させる処理を実装しました。
楽曲の再生時刻はGetTimeSyncedWithAudio関数を使って取得しています。

一條:
CRI ADX LEの導入時にわからなかったり、困った点はありましたか？

kuma:
ネット上の資料周りで、記載されている内容が最新バージョンと違っているときに困りました。
メジャーな解説記事などが古いバージョンで、現在とは仕様が異なっていたり、使いたい機能のドキュメントの例が少なかったりして。
特に、C#スクリプトでのコールバックの登録方法が以前のものと新しいもので異なっていたため「どうやって使うんだ？」と迷いました。

ＣＲＩ・ミドルウェア:
これまでの開発の経緯から、Unity向けのプラグインで方法が複数あることでかえって混乱させてしまったケースかと思います。
ストリーミングアセット対応時から追加された方法によって、コールバックの登録方法も2パターンとなったため少々わかりにくくなってしまっています。

一條:
もっとこういうことやりたかったなという演出や使ってみたかった機能などはありますか。

kuma:
ビートを検出してステージ上を賑やかにする…などのビートと関連する演出などはしたかったですね。
それと、CRI ADXの3Dポジショニングの機能を使ってみたいです。
例えば、オブジェクトに音を紐づけていろいろな方向から聞こえた音が音楽になるようにしてみたいなと考えています。

一條:
CRI ADX LEにこんな機能があったら良いなというのはありますか？

kuma:
無料で利用させてもらっている立場であると前置きしつつも、
例えば動画連携が強化されると、VOCALOIDクリエイターにとって動画制作と合わせて遊べるミュージックビデオのような良いことがあるかもしれないです。

ＣＲＩ・ミドルウェア:
確かにさらに活用いただけるケースが増えそうですね。
演出に合わせてミュージックビデオのポストエフェクトなどを変えたりなどが有効そうです。
CRI Sofdecという弊社製品ではCRI ADXと音声部分を連携できるので、動画と音声を組み合わせた演出なども色々できそうです。

4. 終わりに

一條:
何か告知はありますか？

kuma:
次の遊べるミュージックビデオは、来年のボカコレのタイミングで作ろうと考えています。
今後もインタラクティブミュージックの要素を取り入れ、音楽を聴く人が音楽をいじれる楽曲を作って、ゲーム的な要素を取りいれていきたいです。

ＣＲＩ・ミドルウェア:
引き続き応援しています。本日はありがとうございました。

一條:
ありがとうございました！

---

以上、『リリカルアナグラム』のインタビューでした。
kumaさんあらためてありがとうございました。

本記事内で使用した商標に関する権利表記
「VOCALOID（ボーカロイド）」および「ボカロ」はヤマハ株式会社の商標です。
「Unity」は、Unity Technologiesおよびその関係会社の商標です。