【個人開発】ランダムでカラオケで歌う曲を決めてくれるサービス「PICKUP TRACK」をリリースしました！

Posted at 2022-03-19

はじめに

皆さんはカラオケに行った時、歌う曲に困った経験はありませんか？

最近はこのご時世なのでなかなかカラオケにも行きづらい状況ですが、私自身そういったことがよくありました。
また、私は一緒に行った友人の歌を聴くのも好きなので少しでも歌う曲に悩む時間を減らしたいとも思っていました。

そんな経験から自分と同じような悩みを持つ人に、よりカラオケを楽しんでもらいたいと思い、「PICKUP TRACK」を作成いたしました。

※パソコン、スマホどちらからでも使用できますが、カラオケで使っていただくことを想定しているため、説明にはスマホ画面の画像を使用します。

1. ホーム画面

黒を基調としたデザインで統一しました。

2. 会員登録、ログイン

恐れ入りますが、会員登録とログインをお願いします。

3. 楽曲検索画面からマイライブラリに追加

自分の好きな曲を曲名やアーティスト名で検索して、プラスボタンをワンタッチでマイライブラリに追加することができます。同じようにゴミ箱ボタンを押せばマイライブラリから削除することもできます。

4. マイライブラリに追加された曲からおすすめ曲を表示

曲を検索して追加するという手間を少しでも省くため、また、あまり曲を知らずもっと他の曲を知りたい方に向けてのレコメンド機能として、マイライブラリに追加されている曲から「おすすめ曲」を表示していて、そこから追加も削除も出来るようになっています。

5. マイライブラリからランダムで1曲ピックアップ

「ピックアップ」ボタンを押すとマイライブラリの中からランダムで1曲選んでくれます。「もう一度！」を押せば何度でもピックアップでき、「この曲を歌う！」で決定できます。また、下にスクロールすると右下にボタンが表示され、それを押してもピックアップができます。

6. ユーザー情報画面に歌った曲の履歴を表示

ユーザー情報画面には歌った履歴が「新着順」と「回数が多い順」で表示されます。「新着順」では履歴の削除ができ、「回数が多い順」では歌った回数が表示されます。どの曲をよく歌っているかが分かるので「あれ、いつも何歌ってたっけ？」となるのを防ぐことができます。

主要Gem

主要JavaScriptパッケージ

テスト

インフラ

API

最後まで見ていただき、ありがとうございました！
まだまだ自分に足りない部分だらけで開発も苦労しましたが、だからこそ完成した達成感は大きく、愛着のあるものになりました。
見ていただいた皆さんもよければ使ってみていただけると嬉しいです。
改めましてありがとうございました。