太鼓じゃなく【カスタネットの達人】を自作した話
テスト時の動画は以下です
きっかけ
今年の4月から幼稚園に通い始めた3歳の息子と近くのショッピングセンターに行った際に「パパ、あれやりたい」と言われたのがゲームコーナーにあった「太鼓の達人」でした。
半年前ぐらいからそんな傾向があったものの『とうとう、来たか…』と思いモノは試しなので一応やらせてはみましたが…
知らない曲ばかり
バチを持てない
右と左を理解してないから太鼓のフチを叩けない
その前に「リズム」って何?
こんな状態なので、一瞬で終わってしまいました。
(さようなら私の100円)
「もうちょっと大きくなってからじゃないと難しいね」と話し残念な顔をした息子でしたが、後から来た小学生?の男の子たちを見て再度「太鼓やりたい」と声をあげたので「お兄ちゃん達も練習してるんだよ」って答えたところ「お家で練習しないとね!パパ太鼓作れるでしょ?」と返され絶望が…
ウチにはSwitchもPSもない
今の私の家にはモダンなゲーム機が一台もないのです。(正確に言うとNEOGEO miniはあるけど、流石に3歳児にアケコン使って格ゲーやらせようなんて思ってません。)
※アケコン(アーケードコントローラー)↑こんなのです。
あと前述したように息子が知ってる曲なんて皆無な状態で民生品を購入しても彼が満足するような結果になるとは思えませんでした。
はい、ということでいつもの流れです。
「なければ作ればいい」
構想としては以下となります。
USBの太鼓コントローラー(タタコン)のUSBをPCに差してゲームコントローラー化する(そのまま使えればラッキー)
譜面が作れるオープンソースのエミュレーターソフトを探す(なければ自分で作ればいい)
TVに接続しているWindows機で遊んでもらう
こんな感じで考えていました。
肝となる太鼓がカスタネットに変わった理由は後述となりますが、譜面作るのマジ面倒でした。
とりあえずタタコン(太鼓型USBコントローラ)を買う
ありがたいことに、PS3ぐらいからコントローラーのインターフェースがUSBになっているのは知っていたので、switch用のタタコンをポチっとしてみます。(タタコンって言葉もこの時点で知りました)
この時点で7000円弱の出費です。
棚ぼたですが、タタコンをTVに繋いでいるWindows機に差したところ普通にドライバなしで認識しました!
JoytoKeyなどのソフトでキーコンフィグしてあげればエミュレーターで認識するはずです。
参考となるソフトウェアを探す&作る
私は学生の頃、ゲームセンターでは格ゲーばかりをやっていてほぼ音ゲーの経験がないので20年くらい前で音ゲーのアンテナが死んでいます。(ギターフリークスが本物のギターと違いすぎて挫折したトラウマあり)
とりあえずエミュレーターでググってみましたが、ゲームのエミュレーターはライセンス的に色々問題のあるものが多々あり、「やっぱりこれは流石に…」みたいな結果になったので、だったら作っちゃえばいいだろう思い、ウチに転がっていたラズパイ上でサーバーを構築しjsで動くものを作りました。
この辺りは
phina.jsで音ゲーを作ってみる【前編】や
を参考にUIが横スクロールになるようにフロント部分を開発し、他にも楽曲をDBで管理できるTJAファイルという太鼓用譜面ファイルを読めるよう(UTF8でも可)に開発しなおしました。
UXを考えて楽曲ファイルを用意する
ソフトウェアができても音ゲーの核となるのはもちろん楽曲になるわけで、あとは息子の好きな楽曲(「どすこいすしずもう」とか「ヒガシマル醤油のうどんスープの曲のうどんかぞえうた」とかetc)は購入しまくります。
その上で譜面(tjaファイル)を作れば大方は済みます…
が…
譜面ファイル作るのスーパー面倒なんです。
単純にメロディやドラム部分をコピーすればいいというわけではなく、3歳児でも叩きやすいようにするとか考えてアレンジしてかなきゃいけなかったりラップがある曲はラップの文字数とかを意識して7連譜みたいなのがあったり、若い頃バンドスコアを作るバイトしてましたがその時を思い出すぐらい面倒でした。
途中で逃げ出したくなって、あまりにも面倒だったのでmusescoreで作った楽譜xml(musicxml)を太鼓の譜面にするコンバーターを作りました。
BPMの検出にはRubyを使いましたが、こちらのpythonのをほぼ移植しました。
よし、IT父ちゃん頑張ったぞ!ということで息子に公開します。
3歳児、太鼓をちゃんと叩けない&クオリティが低い問題
息子にやらせてみたところ、やっぱり側面を叩く「カッ」ができないんですね。
なので、全て「ドン」に譜面を作り直したり、4つ打ち以下の譜面にしたりしたんですが、そもそも両手で交互に叩くっていうのがまだ苦手らしく『ちゃんとUX考えてなかったなぁ』とIT父ちゃんとして反省しました。
それにプラスして画像とか効果音(SE)をほとんど入れていない状態だったので息子のテンションがイマイチだったのです。
まぁ、リズムってものがまだ分かってないので仕方ないですが『なんとかいい方法がないかなぁ?』と考えていたところある出来事を思い出しました。
思い出した3月末の出来事
幼稚園・保育園、小学校に進学する際、親の1つの試練として「あらゆるものに名前を書く」という修行があります。(ウチではレーザーカッターと3Dプリンタで「ひらがな」の印鑑作ったりしてある程度緩和はしましたが…)
その際「カスタネット」に名入れをした事を思い出し閃きました。
これだ!
カスタネットの達人を作ればいいじゃん!
あと画像とSEも用意しちゃおうと、同時にタタコン代ももったいないなぁとも思いました。
(どうでもいいけど、思いついたの夜中の2時ぐらいでこの日は脳汁出て寝れなかったです。)
一旦画像、効果音作りとクオリティアップ
もうやると決めたら頑張ります。
太鼓からカスタネットに変わったのもありますが、ロゴや画像(sprite含む)をカスタネット用のを用意したり(ヘッダー画像参照)、効果音やボイス(SE)もVOICEPEAKを使って専用に作ります。
VOICEPEAKはイントネーションが自由に変更できるので素晴らしく使いやすいです。
また、その間にも息子から色々なリクエストが来る(It's a small worldとか幼稚園で覚えてくる曲をどんどん追加)ので結果30曲以上を作らされたのですが、3歳児がどういうタイミングだとリズムをとりやすいか?などUXとして色々学ぶことが多く勉強になりました。
カスタネットデバイスにとりかかる
お待たせしました、やっとハードウェアの出番です。
ある程度ITに詳しい方は勘づいている思いますが、数年前に流行ったArduio pro microで自作USBキーボードの源流のやりかたですね。
スイッチのON/OFF部分がカスタネットの開閉になっただけで、迷ったところはActive highにするかどうか?でした。(電圧も5V以下なので安心です。)
結局Active lowで組みました。
フルキーボードのようにマトリックスで組む必要もなくシンプルな構造ですが、とはいえ思いついたハードウェア(?)が20行以下で実装できるの素晴らしいですね。
#include "Keyboard.h"
const int inputPin = 2;
bool currentState = LOW;
bool beforeState = LOW;
void setup() {
Keyboard.begin();
pinMode(inputPin, INPUT_PULLUP);
}
void loop() {
currentState = digitalRead(inputPin);
if ( currentState != beforeState && currentState == HIGH ){
Keyboard.print("j");
delay(120);//チャタリング対策、こども用なのでこのぐらいdelay入れても大丈夫
}
beforeState = currentState;
}
やらなかったこと
カスタネットデバイスをBLEなどでワイヤレス化
楽曲選択用ボタンの追加
Adrudino pro microを入れる箱を3Dプリンタで自作
1についてはボタン電池の誤飲やBLEでの遅延とか考えると、デバイスの堅牢性やdebugに時間がかかるので却下。
2についてはウチにある基盤がユニバーサル基盤しかなく、さすがに基盤を設計してオーダーするまでには至らなかったのでこちらも却下。
3についてはちょっと大きいですがMINTIAのケースがしっくり来たのでそちらを流用しました。
費用など
カスタネット 364円
Arduino pro micro(3年くらい前に買ったので忘れたけど 800円くらいだった気がしますATmega32U4搭載のものであればなんでも可)
Raspberry Pi 3 4000円くらい
TVに接続しているWindowsPC 30,000円くらい
SDカード16GB 1000円以内
3芯ケーブル 2m 600円くらい
はんだごて etc...
今は色々半導体の値段とか上がっているのでラズパイやArduinoの値段などが値上がりしてると思いますがwindows機を除けば1万円以下で作ることが可能です。(流石にFireTVのブラウザだと遅延が凄すぎてダメでした。)
まとめ
残念ながらタタコン代は無駄になってしまいましたが、普段からラズパイやArduinoがウチに転がっている環境だったのもあり「カスタネットの達人」システムだけにかかった費用はカスタネット代の728円(2個入っていたので実際は364円)だけなのと、今までやったことのある技術のみでやったので開発時間totalで24時間かかっていないと思います。
もちろん、VOICEPEAKを割引中に購入していたことなどもありましたが、今回は、クリエーターとしてハードウェア、ソフトウェア(webサーバー構築、譜面コンバーターなど)、画像、音楽など「っぽく」やるために色々やりましたが、まぁIT父ちゃんとしてある程度はできたかな?と思ってます。
たまに会社のメンバーには言っていますがITエンジニアというとPCやスマホの画面やIoTスマートデバイスに固執しがちです。
分社化する前に会社メンバーにESP32とiPhoneでプラレールを制御するものを教えながら作ってもらいましたが、今回はカスタネットというよりアナログなデバイスを使うこと、スピード優先で開発しました。
結果として3歳の息子が満足するものができたのでよかったです。
息子が実際にやっている動画を掲載したいのですが妻からNG(あと既存楽曲流れているのをUPするの微妙なので)出たのでご了承ください。
カスタネットデバイスの詳細については暇な時に別でqiitaにでも載せようと思います。