TeachableMachineを使って識別した結果をLINEに送ってみた

## １．はじめに
　お疲れ様です。デジタル関連には詳しくないのに、会社でIT・システムを担当している50代の会社員です。
　今回は先日学んだTeachableMachineで識別した結果をLINEに送る試みを実施してみました。優秀なチームメイトに助けられて、こんなオッちゃんでも何とか完成まで漕ぎつけた内容を記事にします。　
## ２．取組の理由
　せっかく学ぶ機会に恵まれたので過去に学習したツールと接続したら、どんなことができるのだろうか？またTeachableMachineの学習能力はどの程度のものかを知りたかったからです。
## ３．使用したツール
  Teachable Machine
  Node-RED
  make
  LINE bot
## ４．完成品
https://twitter.com/mvminami2022/status/1532958358227275776

## ５．作業手順
#### （１）Teachable Machineに学習させる。
今回はとある記事に従ってモデルに学習するところまで学びましたが（下記リンク参照）、ここで疑問に思ったことがあったので、それについて試してみることにしました。

https://qiita.com/sasao3/items/becdf981d8e9dea496e5

　その疑問とは、じゃんけんの取り込み画像は３Ｄであるが、２次元での画像ならばサンプルとして１００枚も２００枚も必要ないのでは？です。じゃんけんの場合、グー・チョキ・パーの３種類×１００枚で３００枚ほどのサンプル画像を必要としていました。ならば「あ」から始まる国旗１３か国で「データ形式」で画像を取込めたら、楽勝で正しい判断をしてもらえるのではないかと考えたからです。
　そこで各国、３枚ずつの画像を取込んでモデルを作ってみました。取り込んだ画像は以下の３種類です。
![スクリーンショット (21).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2669820/245bec32-a35b-0c98-6804-0a364f642797.png)
![スクリーンショット (22).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2669820/d6478b45-ead3-e44f-d18a-0e35f4d70d02.png)
![スクリーンショット (51).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2669820/ac3786c0-d755-6a36-0578-806dec77bd67.png)
　その後の結果画像です。
![スクリーンショット (79).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2669820/8e47d663-7aea-7ac7-2624-2d5d7d81f374.png)
　ちょっと分かりにくくて申し訳ないのですが、右下の出力の所に「アメリカ」が下のほうに隠れていて、この距離での撮影では「アメリカ」は２０％未満でトップは「アンゴラ」の３０％以上でした。そしてスマホをカメラに近づけていくにつれて「アメリカ」が８０％以上のスコアが出るといった感じです。
　ですがこれはあくまで動画の取り込みによる判別スコアなので、画像取り込みの場合はどうでしょうか？その結果がこちらです。
![スクリーンショット (83).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2669820/b4a66504-b011-8055-feae-9ed25313b7ed.png)
この画像も右下のオレンジのグラフの所に注目していただきたい。なんと８１％というスコアを記録していました。僕の仮説はひょっとしたら当たっていた？のかもしれません。２次元データだと判別力が高くTeachable Machineの学習能力は非常に高いことになるんですね。
#### （２）Node-REDからmakeへの接続
　次はNode-REDで作ったフローをmakeへ送る部分のみを解説します。
既に作成済みのTeachable MachineとNode-REDを合わせたフローに、makeと接続するためのノード「http request」と「http responce」を以下のように加え、配置します（赤で囲んだ部分です）。
![スクリーンショット (89).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2669820/39430bf8-46ff-e34b-7007-4857ed28f590.png)
　とここで今度はmakeの準備をします。makeは極めてシンプルで「Webhook:Custum webhook」と「LINE:Send a Notification」を使います。
![スクリーンショット (91).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2669820/367fce83-6087-6fae-a094-0d9f339ea225.png)
　Webhookの設定のポイントは赤で囲ったURLです（これはNode-REDで使用します）。
Webhookの名前は国旗識別とさせて頂きました。
![スクリーンショット (93).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2669820/12693ac4-d612-499e-ed67-f81379c24cb4.png)
　 LINEのモジュールの設定はメッセージを”結果は「4.kokkisikibetu」です”にします。
![スクリーンショット (95).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2669820/6da7cdad-0cf7-c395-2338-859e9c3ba1d8.png)
　最後にもう一度Node-REDに戻って、「http request」ノードをダブルクリックしてURL欄に先程のmakeのWebhookのURLをコピーして貼り付けてください。その際に下のペイロード欄「クエリパラメータに追加」への変更も忘れないでください。
![スクリーンショット (85).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2669820/9b5549db-c205-c7d0-2164-cc89817c8070.png)
　解説の順を誤ってしまいましたが、「templete」ノードの中はプロパティ欄のmsg.payload.の後に「kokkisikibetu」を加えております。テンプレート欄も画像のようになっていなければ変更してください。
![スクリーンショット (98).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2669820/e71bf315-9fea-880d-2b47-49433c6e1197.png)
　これで終了となります。冒頭の動画が完成品です。お疲れ様でした。
## ６．最後に
　いろいろなツールの扱い方を学ぶのはとても楽しいのです。が、実際のビジネスの場において、学んだことを「集客」だとか「収益化」とかに役立つツールとして作り上げていかねばなりません。それが僕ら役割となるのでしょうけど、、しかしながら現実的には未熟すぎて「前方暗雲、波高し」ってとこでしょうか。