東方Project原曲MV線上生成播放器

項目地址：github.com/Jasonnor/th…

連結：jasonnor.github.io/th-music-vi…

動機

最近想作個東方原曲我的向Top50，編排MV過程當中，以爲部分元素能夠自動化產生（例如進場配圖丶遊戲畫面皆能爬蟲取得），並且比較少有同時包含配圖和彈幕畫面的原曲MV（我的認爲彈幕也是欣賞東方原曲不可缺乏的要素之一），於是萌生了這個項目的概念。

實做

基本想法是曲子開始後，先顯示兩張隨機圖片，每張各6秒，之後無縫接上游戲對應的關卡影片，中間皆以淡入淡出來轉場。事前我先創建了簡單的資料庫，包含了曲名丶對應角色（標籤）和關卡等，根據標籤從pixiv爬好並篩選了近兩千張高收藏數的做品，使用Google Data API來爬Youtube上的遊戲影片ID，之後逐漸完善播放器和生成邏輯。目前成品Demo（加速版）如上圖。

標題下面會標明該曲所屬的系列以及當前顯示做品的Pixiv ID或Youtube ID，另外本項目支援行動裝置使用，下圖爲平板環境：

桌面環境：

移動環境爲了下降運算資源，會把音頻波型動畫改成靜態波型（將來會改成可設定）：

遊戲剪影的播放清單（將來會增長收藏功能，顯示已收藏曲在上方）：

MV中游戲彈幕展現：

結語

本項目開源於Github，將來也將繼續擴充更新，喜歡的話給個Star我會很開心 😄

使用中遇到問題也歡迎在Github提出issues或PR協助這個項目，已知Bug清單在這裏能夠查看：github.com/Jasonnor/th…

---

2018/09/10 更新

1. 加入了隨機播放的功能，點擊右下角齒輪便可設定
2. 如今能夠點擊曲名下面的pid/vid直接前往原圖/影片網址羅！