導入

当方、Vtuberのコメント欄で大喜利をし、演者さん(以下.Vさん)に笑ってもらうことで生きがいを感じているものです。
私の推しが最近のゲーム配信でリスナーの規模が少しずつ大きくなってオタクとしてはうれしい反面、ボケのコメントがスルーされてしまうことも起こるようになっており、寂しいような...（小規模お気持ち）

前座はここまでにして、Vtuberの配信では「歌枠」¹という配信のジャンルが存在します。この時Vさんによってはリスナーからのリクエスト²を許可しているケースがあり、私の推しはリクエストできる曲の一覧を公表しそこからリクエストを募っている。
しかし、このリストの構造があまりきれいになっておらず、うずうずしたので作成を試みました。

課題意識

もともと使用していたシステム

もともと使用していたシステムは

曲名
アーティスト
音源URL
熟練度
歌唱回数

これらを入力し、登録する仕組みになっていました。
この構造では、「同じ曲を別で立項することができる」「アーティストを埋めるのがめんどくさくなり、nullで放置される。」「熟練度パラメーターの使い道が不明瞭になる」という状態が起きる（実際起きていた）。
そこでこのシステムの構想部分(リスナーに曲を共有できる)はそのままにし、DBの正規化を行い、上記の課題を解決することにした。

改良法

今回開発したシステムのER図は以下のような構造である。

従来は

曲名
アーティスト
歌唱回数
最終歌唱日

を1レコードで保持していた。
しかしこの構造では

同じ曲が重複登録される
歌唱履歴が失われる
「いつ歌ったか」を記録できない

という問題があった。
そこで今回のシステムでは曲と履歴を分離し、1曲に対して複数の歌唱履歴を紐づけられるようにした。
これにより

歌唱回数を自動集計できる
最終歌唱日を自動算出できる
過去の歌唱履歴を確認できる

また、ユーザー作成時にランダムなハッシュを発行し、ブラウザのLocalStorageへ保存する方式を採用した。次にこのサイトを訪れた際にそのハッシュをサーバーに送信し、ユーザー認証を行っている。これにより利用開始時の入力コストを極限まで下げることができた。

実際の画面

実際のデプロイした製品は以下のである。
https://daikou-diverse-api.com/songApp/

実際の製品は以下のようになっており、曲一覧画面から履歴の追加やセットリストへの追加ができる。
また詳細画面ではいつうたってどのようなメモを残したのかを一目で見ることができる。

セットリストでは共有するためのURLが書いており、URL共有によってセットリスト共有ができる。

今後の改善点

曲の重複判定

現在はタイトルの部分一致で曲を検索できる。
そのため

Lemon
れもん
レモン

のような表記揺れによる重複登録が発生する可能性がある。
将来的には曖昧検索を導入し、重複登録を防止したい。

セットリスト管理機能

現状はセットリストの作成のみ可能で、

名称変更
削除
並び替え

には未対応である。

共有機能

現在はURL共有のみであるため、

OGP対応
SNS共有
QRコード生成

などを追加したい。

おわりに

今回は2か月1プロダクト計画として、Vtuberの歌枠向けの楽曲管理システムを作成した。

今までの個人開発では3テーブルが最高だったので、今作は中間テーブル含め6テーブルを作成したので単純な作業量に押しつぶされていたが、完成までは持っていけてよかった。

今後は実際に使ってもらいながら、
重複登録対策や共有機能の強化を進めていきたい。
一月後くらいに実際のユーザーの反応を記事にしたいと思う。

Vさんの一人カラオケを眺める配信の事 ↩
リスナーが曲を指定し、その曲をVさんが歌う行為 ↩