見出し画像

カラオケできるギフトを作ったよ!REALITY Advent Calendar 2023

こんにちは、Unityエンジニアかとうです。この記事は、REALITY Advent Calendar 2023 15日目の記事です。

はじめに

本記事はREALITYの開発合宿で僕が制作したカラオケができるギフトに関する記事です。特定の楽曲やその歌詞を具体的に取り上げることには著作権のリスクが伴います。そのため、この記事では意図的にコードスクショの一部を消すなどの処理が行われています。

ユーザがもっと手軽に歌配信ができるようにしたい!

今年の合宿で何を作るか考えていた時に、以前見かけた歌配信でユーザーさんがオーディオインターフェースの接続に苦労していたのを思い出しました。

現在、REALITYプラットフォームや他のバーチャルキャラクターの配信では、歌が重要なコンテンツとなっています。良質な配信を行うためにはいくつか機材が必要などハードルも少し高めです。

しかし、REALITYユーザーの中には、ちょっとハードルが高そうで敬遠しているけれども歌配信に興味がある人や、実は歌の才能があるにも関わらず、これまでの機会がなく気づけていない人も多いはずです。

そんなユーザーの方にもより手軽に歌配信を楽しめるようになってほしいとの思いから、今回の合宿ではカラオケできるギフトを作ることにしました。

Whisperを使って楽曲データから歌詞と、歌詞の再生タイミングを取得する

PytonからWhisperに音源ファイルの解析を依頼するコード

今回は前から使ってみたかった 音声認識AI Whisperを利用して、カラオケ化する楽曲データの解析を行い、歌詞とその歌詞が再生されるタイミングを取得しその情報を元にカラオケシステムを組んでいくことにしました。
画像に示されたようなコードを使って、PythonからWhisperにMP3ファイルの解析を依頼しました。この簡単なコマンドだけで、楽曲データから歌詞とそれらの再生タイミングを取得することができました。合宿前にはWhisperの存在をかろうじて知っている程度でしたが、思った以上に簡単に使えたことに驚きました。

精度の面では、非常に高いと感じました。歌詞に関しては完璧ではありませんでしたが、わずか5文字程度を手作業で修正するだけでよく、ほぼそのまま使用できるレベルのデータが出力されました。

演出プランを考える

演出プラン、歌詞部分は大人の事情により見えなくしてます

REALITYにカラオケをつけるなら、ただ曲と一緒に歌詞表示が流れるだけでなく、バーチャルライブ的な演出をしたいということで、Whisperを用いて出力したデータを元に演出プランを考えました。

画像素材の用意

左が自分で書いたテクスチャ、右がDALLE3くんにお願いして作ってもらったテクスチャ

演出プランが決定したら、次に必要な素材を準備します。開発合宿は実質的にハッカソンのような場で、専門外の作業も含めて積極的に挑戦する姿勢が重要です。今回、演出に使用するテクスチャはClipStudioで描きました。また、スカイボックス用のテクスチャはDALL·E3を使って生成しました。

歌詞表示システムを作る

歌詞表示制御部分のコード

当初は、多少のずれを前提としてWhisperで出力したデータをJSON形式で読み込んで表示する程度を考えていました。しかし、実際にこの方法で作成してみると、音と歌詞のタイミングが少しでもずれると非常に違和感があることに気づきました。そのため、多少手間がかかっても、歌詞表示のタイミングを適切に調整できるような開発を行うことにしました。歌詞フレーズの再生時間を大まかに設定し、フレーズの前半、中盤、後半ごとにweight値を乗算することで、歌詞表示の更新タイミングを制御しました。これにより、違和感なく適切なタイミングで歌詞を表示できるようになりました。

ステージを作る

ステージ

REALITYのギフトは「prefab」なので、カラオケ用のステージやUIを「prefab」として設定し、ギフトとして登場させることで、カラオケ用のステージを演出できます。スカイボックスに関しては、「prefab」にアタッチしたスクリプトを介して変更しています。

カメラワークをつける

Timeline

ステージの作成が完了したら、次にカメラワークを加えていきます。カメラワークの実装には「Cinemachine」と「Timeline」を使用しています。これにより、アバターを注視した状態で、指定された場所へ指定された時間内にカメラを移動させるようなカメラワークを手軽に実現できます。動的に制御する必要のないカメラワークには、「Cinemachine」と「Timeline」の組み合わせがおすすめです。

完成

エナドリの助けを得て合宿中に実機で動くまで持って行けた図

考えた演出を全て入れることはできませんでしたが、ギフトカラオケ機能を実装し実機で動かせるところまで行けました。
↓短いですがGifを載せましたのでご覧ください。

カラオケギフトGif

最後に

この機能はあくまでエンジニア個人のアイデアに基づいており、開発合宿中に作成されたものです。リリースの予定は現時点ではありませんが、REALITYアプリにおける可能性の一端をお見せできたと思います!
明日の担当は、サーバーエンジニアの「おちあい」さんですお楽しみに!!