ダークサイドにようこそ!

ブレイクダンス / プログラミング / 映像制作 / 旅行 / 散歩

【デザイニウム】PoseNetとDrumsRNNを使って「BodyDrum」というリズムアクションゲームを作りました【TensorFlow.js】

いきなりですが、まずはデモ動画をご覧ください。

www.youtube.com


ざっくり解説しますと、JavaScriptによるWebブラウザベースのリズムアクションゲームです。使用している技術としては主に以下のものとなります。

  • TensorFlow.jsを経由してPoseNetを使い単眼カメラのみでドラム操作を実現
  • こちらもTensorFlow.jsを経由してGoogleMagentaのDrumsRNNによりお手本となるドラム演奏を自動生成
  • ドラムシークエンスの制御にTone.jsを使用
  • 描画周りはp5.jsを使用

 

特にDrumRNNに関しては以下の記事を参考にさせていただきました。またPoseNetについてはGPU搭載マシンで動作させないとすごくカクカクします。

gogul.dev

 

ちなみにBodyDrumは伝説の音ゲーム「ウンジャマラミー」をリスペクトして制作されました。

ウンジャマ・ラミー

ウンジャマ・ラミー

 

 

より詳細な解説は以下の記事もぜひご覧ください。

note.com

 

f:id:hahaeatora:20200120210512p:plain

次はもっとダンスよりのコンテンツも制作してみたいです。あと独自の機械学習済みモデルをtensorflowjs_converter経由で動かしたい。

 

hahaeatora.hateblo.jp

hahaeatora.hateblo.jp