Teachable Machineを使って日本の硬貨を画像で判別する機械学習に挑戦しました

## 何故か外国からのお客さまは日本の硬貨が区別出来ない。。。
私は近畿で展開している地場スーパーに勤めています。大阪でも有名な繁華街にいわゆる「旗艦店」(企業を代表する店舗、というイメージです)を展開しているのですが、土地柄、店舗の周りにたくさんの大型ホテルが建っています。コロナ過前だと、大勢の外国から来られたお客さまが夜に酔って来店されていました。すると、意外と少額のお買い物だと、カードを使わず、硬貨でお支払いされようとするのですが、金額の判別がつかずレジでまごまごされるんです。すると自然とレジが込み合い、外国からのお客さまと日本のお客さまが若干揉める、というような事があり、今回「画像による機械学習」を勉強しよう、と思った際に真っ先に、「硬貨を判別する」という機能を思い立ちました。実際、読み込ませる画像の素材としてすぐ揃えやすい、という理由もありました。

## Teachable Machineとは
近頃よく目に耳に飛び込んでくる「AI」「機械学習」というものを体験してみたい、と思い色々調べていたところ、ちょっと面白いサービスを見つけました。
[Teachable Machine](https://teachablemachine.withgoogle.com/)は、googleが提供している誰でも短時間で簡単に機械学習モデルを作成できる、ウェブベースのツールです。
例えば,ジャンケンをする手の形（グー,チョキ,パー）をAIに機械学習させて,カメラに映った手の形を判別することができます。簡単に試せるので,ぜひやってみてください。

必要な物
・Webカメラ：最近はパソコンに標準装備されているので、それでOKです。
・GoogleChromeなどのブラウザ：Teachable Machineはgoogle製品なので、GoogleChromeがおススメです。
・画像判別に使いたいもの：ネット検索した画像でもOKです。

Teachable Machineの勉強の為に検索していた際に、偶然見つけたこちらの学習サイトがとても分かりやすいので、よければご一読下さい。

AI とプログラミングの初歩を学ぶ（by Google）

https://services.google.com/fh/files/misc/ai_programming_booklet.pdf



## Teachable Machine完成
![スクリーンショット (21).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668078/6e1aca19-a01c-fc97-9c54-61d4f7d030d0.png)
1円から500円までの硬貨を用意し(今回50円硬貨と100円硬貨が手元になかったので、検索画像を代用)、それぞれをノートPCのカメラに読み込ませ、機械学習させています。この画像だと右の「10yen」が「100％」と判断されているのは「100%、10円硬貨です」と判断している事になります。

## アウトプットの方法を考える

## Node-REDを学習する
硬貨を画像から判別するTeachable Machineは完成しましたが、この見た目ではあまりにもそっけがないので、何かしら美しくアウトプットする方法は無いか、と考えたことろ、以前、目にした[Node-RED](https://nodered.org/)の存在を思い出し、これなら見た目も整ったアウトプットに繋がるのではないか、と考え、挑戦する事にしました。

[Node-RED](https://nodered.org/)は、ローコードプログラミング開発ツールです。要するにプログラミングが分からなくても手軽に始められるブラウザで動くプログラミング環境です。自分でコツコツプログラムを書かなくても、「ノード」と呼ばれるプログラムの塊をGUI(ビジュアル化されたUI)で「繋ぐ」事でプログラムが完成する、という便利なツールです。そして、今回は機能説明の中にある「オンラインサービスを新しく興味深い方法で接続するためのツール」、これが導入の目的です。

https://nodered.jp/

実際にログインして画面を開くとこのようなシンプルな画面が開きます。画面左側に並んでいるかわいいブロックが「ノード」です。この「ノード」を画面中央の「フロー」(キャンバスみたいな部分)にドラッグ&ドロップでどんどん配置していきます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668078/d5904e4c-d0a9-9148-ed22-fedde40f7ff1.png)

今回の流れは、「PCのカメラで硬貨を読み取り」→「Teachable Machineで何円硬貨か、を判断」→「結果を定型文化」→「結果を表示」までを設定します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668078/55aff3bf-349a-b37f-f915-5552f9c415e2.png)

これで一旦はNode-RED上で硬貨判別のプログラムが出来た事になりますが、結局PC画面上でのアウトプット止まりです。折角なのでもっとお手軽に判別結果を見れないか、と考えたときに、個人的に取り組んでみたい事が浮かんでいました。

## LINEBotに再挑戦
私は先週からこの「Qiita」を書き始めたのですが、その初めての記事がこちら、「LINEBotでレシピ検索に挑戦」です。

https://qiita.com/tamashiro-tat/items/54a25cf29f070403c5c3

結論から言いますと、このLINEBotは完成に至らず、勉強不足を痛感したのですが、今回のこの「硬貨判定プログラム」のアウトプットを「LINEBot」を使って「LINE」に通知したい、という復習も兼ねた意味で、アウトプット先を「LINE」にしたい、と考えました。

## 「[Make](https://www.make.com/en)」と「LINE」を使ってBot作成

まずは「Webhooks」と「LINE(Send a Push Message)」というモジュールを準備します。
![スクリーンショット (24).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668078/9b4e9707-b0a6-af26-8491-27f5c339cf10.png)

Node-REDにも「Webhooks」と連携される為の「http request」という「ノード」を追加します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668078/fe8d73dc-1a54-0ffa-8822-b518daee106d.png)

Node-REDと連携するリンクを設定し、
![スクリーンショット (28).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668078/7cfab56d-e61f-d73e-5686-7cfc6ad27f2d.png)

Node-RED側にはMakeに「硬貨判別結果」を引き渡す設定を行います。

![スクリーンショット (29).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668078/8127a9da-969e-4cae-f7f1-1ce2184ef83b.png)

LINE Developersで作成した自身の公式アカウントとの連携させる設定が済んだら、応答の書式を設定します。今回は見せるお客さまが外国から来られている方、という前提で英語表記にしました。

![スクリーンショット (31).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668078/40ce19ab-9d09-638b-2972-31eb441a479e.png)

## いざ実証

それでは、無事稼働するか、確かめます。

https://twitter.com/KohyoTamashiro/status/1532629126334803969

無事、判別出来ます。画像には映っていませんが、PC上には結果もきちんとアウトプットされた表示がされています。
※会社のセキュリティ方針で動画キャプチャ機能が止められています。粗い画像ですみません！

では、きちんとLINEに通知が来てるでしょうか。

https://twitter.com/KohyoTamashiro/status/1532631697988419584

通知も無事に来ました。ゴールイメージは最近主流のセルフレジにカメラを設置、お客さまが硬貨をカメラでスキャン、セットで設置したスマホに判別結果を通知、みたいな流れをイメージしました。

今回は「Make」で「LINE(Send a Push Message)」モジュールを使用したので、一方的にメッセージが飛んでくる仕様です。お客がお持ちの硬貨を据え置きのPCのカメラで読み取り、手元のLINEに回答が来るので、それをお見せする、というイメージです。外国からのお客さまなので、「カカオ」の方が良いとか、直接お客さまのアカウントに返事が飛ぶ、とか、運用は考えればキリがないですが、自分的には「初めの一歩」という印象です。

## 最後に
今回は初めて「Teachable Machine」を使って機械学習に取り組んでみました。一番の驚きはこのお手軽さで自分のPCで機械学習が動く、という事です。もっと人手があって、たくさんの画像を集める事が出来れば、スーパーマーケットの課題である、「傷んだ生鮮品」を見つけるプログラムなんかも作れるのでは、という印象です。

加えて個人的には「LINEBot」に再挑戦して、きちんと動くものが作れた、というのがとても嬉しいです。少しは理解が進んだのか、と自己満足しております。

それではご一読頂きました皆さま、今後とも、宜しくお願い致します。