見出し画像

\画像を文字起こしするLINE botを作りました/

emonoといいます。都内でエンジニアしてます。
先週末の土日に絶望するくらいやることがなかったので、
モジネコ」という画像をAIで文字起こしするLINEのbotを作りました。
(↓の動画のやつはお腹の調子を整えるために飲んでます。めっちゃいいです。出ます。)

なんで作ったのか

友達とzoomもくもく会とやっている時に思いつきで作りました。
なんとな〜〜〜く機械学習を用いた何かを使ってアウトプットしたかったので作りました。
特に熱い思いがあったわけではないです。

あと年末年始に↓を作って以来ちゃんとアウトプットをしていなかったのでなんか作りたい欲が出てきて作ることにしました。

なにが出来るの?

LINEのアカウントに画像を送ってもらったら、その中から文字を抜き取って返信してれます。

バックオフィス業務とかの効率化に使えるかなあ〜とか思いました。
細かいことは↓のツイートを見ていただけると〜

使ってる技術

使っている技術は以下です。
・実行環境: Cloud Functions for Firebase
・言語: TypeScript
・API:  Google Vision API  / LINE Messaging API

やったこととしては
1. LINE Developerアカウントを作成して、MessagingAPIを使ってLINEでbotを使えるようにした
2. Cloud FunctionsでLINEアカウントのメッセージを取得(今回は画像をユーザから受けとる)
3. 取得した画像をbase64エンコードする
4. 文字起こししてくれるVision APIに投げる(なので今回は機械学習部分の実装はすっとばして、脳死でGoogleのAPIを叩いてます。

Draw.ioで適当に構成図を書くと以下になります。


スクリーンショット 2020-05-03 20.26.33

苦労したこと

1. LINEのDeveloper Accountの設定が分かりづらい(LINEアカウントの名と画像の変更の仕方がわからずに3回くらいアカウントを作り直しました。
2. GCPが初めてだったのでAPIのkey作成や、権限周りが結局よくわかってない(だけどAWSのドキュメントより全然みやすくて感動した。)

学び

1. クラウドめっちゃ便利👍

ここまで読んで頂いてお気づきの方もいるかもしれませんが、
・ユーザインターフェイスはLINE
・実行環境はCloudFunctions(サーバーレス)
・機械学習周りはGoogleのAPIにお任せ
なのでほとんどコードを書いてません。200行くらい
各APIのインターフェイスを結合しただけみたいな感じです。

エンジニアには
・技術を作る人(GAFAの中の人とか、OSSのコミッターとか)
・技術を使う人(技術を作る人が作ったものをサービスに起こす人)
の2種類がいると思っていて、

後者の人や僕みたくスキルがそこまで高くない人には組み合わせ次第でお金と時間をかけずにアウトプットが出来るなあ〜〜〜と思いました。

2. サムネとか作るの意外と楽しい👍

以下のサムネとかをcanvaで作ってみたら、意外とそれっぽく出来たので今後もうちょいデザインの勉強とかもしたいです。
(今ノンデザイナーズ・デザインブック読んでます。)

グレー アイデア アイキャッチ インスタグラムの投稿のコピーのコピーのコピーのコピー

3. なにを作りたかったのかよくわからん😢

とりあえずノリと勢いで作ったので、
あれ?俺は何が作りたかったんや・・・?ってなりました。
アウトプット自体が好きなのですがだれのために、なにを作るのかをもうちょっと考えたほうがいいかなあ〜と思いました。
あとはマネタイズとかも全く考えていなかったので、そこらへんも考えられるようになりたい

特に個人開発だと誰かがマネジメントとか方向性を修正してくれたりする訳ではないのでそこらへんをなんかいい感じにできたらなあ〜。

最後に

以下から使えるので使ってみて下さい〜😸
https://line.me/R/ti/p/@716exboo
(雑に作ったのでバグがあったらこっそり教えてくれると嬉しいです。)

あと
いいね、リツイートとかしてもらえるとやる気が出るので下さい🤗


この記事が気に入ったらサポートをしてみませんか?