Teachable Machineで調教した柴犬がLINEBotとして姿勢判断をしてくれる

https://twitter.com/mWNYwPxi8h58533/status/1696530590311522362


仕事でもプライベートでもスマホやPCなど画面を見る時間が増えました。
それに伴い、長時間同じ姿勢や座りっぱなしなどが原因でストレートネック・眼精疲労など健康面も危惧されるようになっています。

せっかくだから仕事でもプライベートでも役に立ちそうなツール作りたいと考えました。

# ■使用したツール
Teachable Machine
→　https://teachablemachine.withgoogle.com

LINE Developer
→　https://developers.line.biz/ja/

Node-RED
→　https://nodered.org/

# ■Teachable Machine の設定

まずは学習させるためのサンプルを撮影。
良い姿勢だと、good
崩れた姿勢だとbadと表示されるようにします。



![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3485526/b4b34ca3-8e45-079a-26f4-0dbf684d1603.png)

ん～。画像登録しましたが、good bad両方ともNoN％と表示されてしまう。

:::note warn
おそらく、サンプルのように全身移っていないとうまく反応しない様子。
:::

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3485526/0a15a00b-27cd-02a5-009d-172d0acb388c.png)

ということで、改めて画像プロジェクトから入りなおして作り直すことに。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3485526/1dc98805-b2f6-182c-6e1a-6615e2492926.png)

先程同様に、画像を撮影しトレーニングさせます。

good,badだけだとおもしろくないので、他にも別の判定を追加したい！
何を追加しようか考えている際に、
お昼ご飯のあとや徹夜明けのPC作業は眠たくなることと、
拡大しても見ずらい文字はついつい画面に近づいてしまうことを想起したのでこの二つを判定で出てくるようにしたいと思います。

というわけで、追加でウトウト/眠っている状態は　**”sleep”**　
と画面に近づきすぎた場合の　**”too close”**　を追加。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3485526/62172613-6cd4-2d21-969f-ca14b8b6e5d9.png)

良い姿勢でもbadの判断になるため、
goodと被っている画像を削除し、他の明るさでも対応するように照明も少し修正。


:::note warn
ダブっている画像があると、**複数の判定に反応**してしまうようです。
:::
その為、撮影した画像サンプルで似たような画像や、ダブっている画像を改めて精査。
↓
ボケていた画像やダブりの画像を選んで削除。
↓
修正した内容で改めてモデルをトレーニング
↓
削除すれば判定もクリアになりました!
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3485526/dee27f40-0c55-de92-dafc-f86e3b39bbd1.png)

# ■Node-RED
続いて出力の為のNode-REDの設定。

☟ノードを繋げた状態がこのような形になります。




![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3485526/96ba17b1-044a-16d7-09b4-ca5de332f80e.png)

☟まずはWebhookの設定から、
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3485526/4eb28ab3-7b55-cf31-acbe-f653766a5af9.png)

Teacheable　Machine のノードでは、
トレーニング後のURLを設置。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3485526/8551b192-f159-9d56-bcd6-f194deb30b1a.png)
続いて、テンプレート内ではBotからの出力内容を記述します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3485526/3552da9f-689a-a2b0-b30f-37a86aa3f88c.png)

Reply Message　
LINE　BotのSecretとaccess Tokenを出力したいアカウントからコピペしてきます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3485526/304cc93f-9458-7cf5-11ec-7355d4091b26.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3485526/eb9ef9f2-4a58-c993-c50e-b4397e969359.png)



![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3485526/341133d3-e0f0-1696-e964-3da9a385ad0f.png)
出力する言葉が機械的過ぎたので柴犬っぽくしてます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3485526/615def0b-ec7a-f162-9e83-bb0c051f6645.png)

無事に出力できました！
☝いい姿勢のつもりでしたが画面に近いとのこと。

# ■反省点
画像投稿だとその都度LINEで画像を投稿する必要があるので少々面倒。
リアルタイムで姿勢を判断して画面に表示してくれるようにすればさらに実用的になると感じました。

アップデート案として定点カメラの設置とCodepenを使用したツールでも実装可能かやってみたいです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3485526/5d559c7c-2781-291c-e0ca-e690158c7c48.png)

☝柴犬とお友達になりたい方はこちらからどうぞ！