TextAlive: 音楽に同期した歌詞アニメーション制作支援サービス

加藤 淳, 中野 倫靖, 後藤 真孝

産業技術総合研究所

歌詞アニメーションとは

音楽と共に歌詞の内容を魅力的に伝える動画の演出手法

  • 音楽と同期して歌詞がアニメーションするKinetic Typographyの一種
  • 従来、タイミング調整と効果的な動きの設計を文字ごとにする必要があった
  • 歌詞カードや単なるカラオケ表示と比べて、制作に膨大な手間が必要だった

問題:
魅力的だが、制作が難しい & 手間が膨大

p15_kashianime

TextAlive(テキストアライブ)とは

みんなで創作を楽しめる、ウェブブラウザ上で動く歌詞アニメーション制作支援サービス

[ACM CHI2015] Best Paper Honorable Mention Award
[ICLC 2015], [LIVE 2016] 著者はすべてKato+

p15_textalivetoha

【1】音楽理解技術に基づく歌詞アニメーションの自動生成

p15_ongakurikai

  • 音楽理解エンジンで解析したサビやビートなどの情報と、歌詞同期エンジンで解析した歌詞の発声タイミングの情報を用い、歌詞アニメーションを自動生成
  • 歌詞発声タイミングの誤りは、ブラウザ上でインタラクティブに訂正できる
  • 曲調や歌詞などに合わせて歌詞アニメーションのスタイルを選択して楽しめる

【2】プログラミング環境技術に基づく動画のリアルタイム合成・編集

p15_programming

  • TextAlive上の歌詞アニメーション(動画)はプログラミング環境技術でブラウザ上のプログラムを動的に変更、実行してリアルタイムに描画される
  • 既存の動画共有サイトと異なり、見ている動画は全てブラウザ上で編集できる
  • 動画の演出に用いるアルゴリズムを動画を再生しながら編集できるライブプログラミング機能を搭載し、プログラマが機能を拡張できる統合開発環境を実現
  • プログラマが作ったテンプレートをユーザが調整できるライブチューニング機能により、プログラマとユーザが協力できるソーシャルな制作支援環境を実現

解決:
音楽理解技術プログラミング環境技術
手間いらずの、もっと自由な動画制作環境を実現

サービス連携

p15_renkei1
Songrium 3D で歌詞アニメーションを表示

p15_renkei2
piaproイラストをTextAliveの背景に設定

謝辞:
上記の図では、ピアプロ・キャラクター・ライセンスに基づいてクリプトン・フューチャー・メディア株式会社のキャラクター「初音ミク」を使用した。