TouchLyricWorld

初音ミク「マジカルミライ2021」プログラミング・コンテスト応募作品

歌詞に楽しく触れるをコンセプトにしたリズムゲームです.

P.S. 本コンテストで優秀賞を頂きました．ありがとうございます．

内容

歌詞が歌われるタイミングに合わせて歌詞をなぞっていくゲームです.
また，曲自体にも積極性を持たせるためにビートに合わせて操作し，リズムに乗って楽しむ要素もあります.

URLにクエリパラメータ ta_song_url={楽曲のURL} を追記することでsongle上にある曲なら全て遊べます.
↑仕様変更により遊べなくなりました

パソコンでもスマホでも同じ体験が得られるように，できるだけ幅広い機種でのレスポンシブ対応をしています.

開発

環境

• Node.js
  • v12.*
• npm
  • v7.*

ローカルで起動

git clone git@github.com:husky21st/TouchLyricWorld.git
cd TouchLyricWorld
touch .env
echo 'NEXT_PUBLIC_API_TOKEN = YourToken' >> .env
npm i .
npm run dev

* GitHub PagesではGitHub上でSecrets情報の登録を行なっています

ビルド

npm run build

主要ライブラリ

PixiJS
GSAP 3
TextAlive App API

TextAlive App API

TextAlive App API は、音楽に合わせてタイミングよく歌詞が動くWebアプリケーション（リリックアプリ）を開発できるJavaScript用のライブラリです。

TextAlive App API について詳しくはWebサイト TextAlive for Developers をご覧ください。

クレジット

• Cheering Miku Picture : ねこみん
• Menu&Result Graphic: つぼ
• Roses and Flower: AukAwIt

注意事項

画像素材の改変，二次配布は固く禁じます.