WEBアプリを個人開発してリリースしました。

 

2020年3月4日にWEBアプリを個人開発してリリースしました。

Synchro Song (https://synchrosong.com)　（現在は閉鎖済）

本記事では、開発した経緯やシステムの概要について記載します。

サービス概要

このサービスでは、アーティストを選択して言葉を入力することによって、入力した言葉とシンクロするアーティストの曲、ベスト１０を表示させます。

１. TOPページでアーティストを選ぶ。

2. シンクロさせたい言葉を送る。

３. シンクロ結果を表示する。

開発に至った経緯

Courseraのディープラーニング専門講座

Courseraの「ディープラーニング専門講座」を受講しました。

受講した感想についてはこちら。

Courseraのディープラーニング専門講座を受講しました。以前、Courseraの機械学習を受講しました。 https://dodotechno.com/coursera-ml-impre...

このディープラーニング専門講座の最後のコースがSequence Modelというものでした。

Saquence Modelでは、時系列のデータを予測するような分析について扱っており、文章の自動生成、翻訳処理、音声処理などに応用できる技術について述べられています。

word2vec

Sequence Modelの技術の一環として、word2vecというword embedding(単語埋め込み）と言われる技術があります。

word2vecでは文章中の単語の前後関係を学習して単語を「wordベクトル」に変換します。

wordベクトルに変換すると単語同士の類似性を求める事ができ、例えば「りんご」と「梨」は似ているけど「機械」と「果物」は似ていない等を算出する事ができます。

検索するとword2vecを利用して、歌詞を分析するような事をされてる方々が多くいらっしゃり、私も歌詞を分析して遊んだりしてました。

doc2vec

doc2vecはword2vecを発展させたもので、文章の類似性を算出する事ができます。

doc2vecを使用することによって、ニュースの記事の類似性などを算出する事ができます。

歌詞を分析して遊んでいたこともあり、doc2vecを使えば曲同士の類似性も算出する事ができ、そこから何か面白い事ができないか考えていました。

入力した文章と歌詞の類似性

doc2vecを利用する事によって、入力した文章と歌詞の類似性を算出して、入力した文書と近い歌詞をの曲の一覧を返す事ができると思いました。

その類似性を「ユーザーの言葉」と「歌」のシンクロ率と表現して、シンクロ率が高い歌のベスト10を出すと面白いのでは・・？と思って作成する事にしました。

環境

システム構成

SIerとして20年近く働いてましたが、インフラの技術については避けて通って来ました。

基本的にスケールアップとかスケールアウトとかロードバランスとか考えたくないです。

なのでクラウド+サーバーレスは必須条件でした。

ただ、クラウド環境も会社員時代は用意されたものを使っていただけなので、何が良いかなどさっぱりわからず、ググりながら、かなり紆余曲折した後、以下のようなシステム構成になりました。（経緯については、別の記事でまた書く予定です。）

クラウドのプラットフォームは、Google Cloud Platformを選びました。

1. オンライン処理

・Firebase Hosting + Cloud Run

フロントエンドはFirebase Hostingを使用して、サーバーサイド処理はCloud Runにしました。（Firebase Hostingは当初は色々、構想があったのですが、現状はCDNを簡単に使いたいためだけに使ってます・・）

2. 一時データ削除

・Cloud Scheduler + Cloud Pub/Sub + Cloud Functions

ユーザーが言葉を入力して送信した状態では一時データの扱いとするので（その後、明示的に保存しないと消える）、一時データの削除を上記構成で実行しています。

3. モデル作成

・ローカルPC

歌詞をスクレイピングしてモデル作成は、とりあえずローカルPCで動かしてます。
自動化して、知らぬ間にスクレイピング先に負荷とかかけていたら嫌なので、不定期に気が向いたときに、徐々にアーティスト（のdoc2vecモデル）を増やしていってます。

４. ソース管理、ビルド、デプロイ

・GitHub + Cloud Build

ソース管理は、GitHubを使用しており、pushすると自動的にコンテナをビルドして、Cloud Runにビルドするようにしています。

なお一時ファイル削除で使用するCloud Fuctionsとフロントエンドのfirabaseは手動でデプロイしています。

５. 問い合わせフォーム

・google form

問い合わせフォームは、時間をかけたくなかったので、google formを使いました。

 

全体のシステム構成図は以下のようになります。

使用技術

１. 言語、フレームワーク

・python + flask

ライブラリとの相性と自分のスキルから言語はpythonを使いました。
その流れで、webフレームワークは、flaskを使ってます。

2. ライブラリ

・mecab　+ mecab-ipadic-neologd

英語と違って日本語は単語ごとにスペースで別れていないので「形態素解析」によって単語を「分かち書き」する必要があります。
mecabはそのためのライブラリの一つで、mecab-ipadic-neologdはmecab用の拡張辞書です。

• 形態素解析エンジン(mecab)
• 形態素解析辞書(mecab-ipadic-neologd)

・word cloud

word cloudは、分かち書きした単語の文書中の頻出度をビジュアル化するもので、pythonのライブラリを使用しています。

・doc2vec

分かち書きした単語を分析するためには、前述の通りdoc2vecを使用しており、pythonのライブラリを使用しています。

・pillow

結果のランキング表を図として保存するための画像処理ライブラリとしてpillowを使用しています。（matplotlib使ったり、plotly使ったり紆余曲折した後、これに落ち着きました。）

・UIkit

社会人時代から画面デザインは、本当に苦手で「裏方の処理は全部書くからUIは、誰かお願いします」というスタンスだったので、出来るだけ簡単にできるものを見つけようとして結果、UIkitというcssフレームワークに行きつきました。

結局、一番苦労しましたが、それなりの画面にはなったと思います。

最後に

できればマネタイズしたいので、シンクロした曲に対してレコチョク、amazon、楽天のアフィリエイトを貼りました。

google adsenceは申請中です。

本当は、一週間ぐらいでチャチャっとリリースしたかったのですが、自分にとって初物が多くその結果、調査に時間がかかり試行錯誤が多かった事で、1ヶ月程度かかってしまいました・・・

週５で１日５時間程度なので、実質100hくらいだと思います。

他の方々が、数時間でリリースしたみたいな話を聞くと、この規模にしては、かかりすぎだろ・・と思います。

今後は、本サービスのリリースに関連して学んが知識について記事を書いて行きたいと思います。