1-1. 新規プロジェクトを作成する

下記URLにアクセスして、 Get Started ボタンをクリックします。

https://teachablemachine.withgoogle.com/

s100

Image Project をクリックします。他にも音声を学習させたり、骨格を学習させるプロジェクトもあります。

s101

1-2. 各種説明

学習画面に遷移しました。画面はとてもシンプルで左側から学習させたいモデルを登録する箇所、実際にモデルを学習する箇所、最後に学習したものを評価する箇所があります。

s102

1-3. Classを登録する

学習したいものを準備してください。Class名を学習させたい名前に変えます。今回は自分を学習させたいので、Class名を「がおまる」としました。Webcamボタンをクリックして学習する準備をします。

s103

1-4. 学習データを登録する

Webカメラが無いPCをお持ちの方はUploadでもデータを登録することが可能です。今回はWebカメラがある前提です。

Hold to Record ボタンを押しっぱなしにすることで学習データを作成することが可能です。Webカメラに映ったものをどんどんと記録していきます。首を傾けたり、様々な角度を試したりして学習データを溜め込んでいきます。

s104

1-5. 他のデータも登録する

Classが1つだけだと学習させることができませんので、近くにあったボールペンを学習させてみました。他にも身近にあるものを学習させてみましょう。複数登録できたら、 Train Model ボタンをクリックします。

s105

Train Model ボタンをクリックすると、学習がスタートします。バーが端まで到達すると学習完了します。

s106

1-6.動作確認する

学習が終わると、プレビュー画面で結果を確認することができます。リアルタイムでカメラに写ったものを判定します。

s107

1-7. 学習モデルをエクスポートする

学習したモデルを他のシステムでも使えます。右上にある Export Model ボタンをクリックします。

s108

ポップアップが表示されるので、「Tensorflow.js」タブをクリックして、その右側にある Upload my model をクリックします。

アップロードが完了するとURLが発行されるので[Copy]ボタンをクリックしてメモしておきます。

s109

2-1. 新規チャネルを作成する

LINE DeveloperページへアクセスしてLINEログインしてください。 https://developers.line.biz/ja/

まだプロバイダー設定してない方はお好きな名前でプロバイダー名を設定してください。 s300

新規チャネルをクリックします。 s301

Messaging APIをクリックします。 s302

各種項目を埋めていきます。

①チャネル名

機械学習Bot

②チャネル説明

機械学習Bot

③大業種

個人

④小業種

個人(その他)

⑤メールアドレス

ご自身のメールアドレスを入力

s303

2つチェックを入れて、[作成]ボタンをクリックします。 s304

[同意する]ボタンをクリックします。 s305

作成された「機械学習Bot」チャネルをクリックします。 s306

2-2. チャネルシークレットをメモする

下の方にスクロールすると「チャネルシークレット」という部分があるので、その値をメモしておきます。

s307

2-3. Botと友だちになる

作成したBotと友だちになっておきます。QRコードを読み取って友だちになります。

s308

[追加]ボタンをクリックします。 s309

2-4. チャネルアクセストークンをメモする

下の方にスクロールすると「チャネルアクセストークン」という部分があるので、[発行]ボタンをクリックして、アクセストークンを発行します。発行されたトークンは後ほど使うので、メモしておきます。

s310

2-5. LINE公式アカウントを設定する

Botの応答メッセージを無効にしたいので設定を行います。[編集]部分をクリックします。

s312

詳細設定にある応答メッセージとWebhookの設定を行います。設定したら、[Messaging API設定]をクリックします。

応答メッセージ

オフ

Webhook

オン

s313

2-6. WebhookのURLを設定する

enebularのURLコピーします。末尾に linebot と追記して貼り付けて[保存]ボタンをクリックします。

s314

以上でLINE Botの設定は完了です。

3-1. Teachable Machineノードを追加する

右上のメニューから 「パレットの管理」 をクリックします。

s400

「ノードを追加」タブをクリックして、検索窓に teachable で絞り込みます。 [ノードを追加]ボタンをクリックして node-red-contrib-teachable-machine を追加してください。

s303

3-2. LINEのMessaging APIノードを追加する

続いてLINEにメッセージを送るノードを追加します。検索窓に line-messaging-api と入力して絞り込みます。 [ノードを追加]ボタンをクリックして node-red-contrib-line-messaging-api を追加してください。

s402

3-3. http in ノードを設定する

ネットワークカテゴリにある http in ノードをドラッグ&ドロップしてください。ノードをダブルクリックして、プロパティ画面を開き、下記項目を設定してください。設定したら完了ボタンを押して閉じてください。

メソッド

POST

URL

/linebot

s405

3-4. function ノードを設定する

機能カテゴリにある function ノードをドラッグ&ドロップします。httpノードと functionノードを線で繋いでから、ダブルクリックでプロパティ画面を開いてください。コード部分を編集します。

下記コードをコピペしてください。

const messageID = msg.payload.events[0].message.id;
const replyToken = msg.payload.events[0].replyToken;

msg.messageID = messageID;
msg.replyToken = replyToken;

return msg;

s406

3-7. http request ノードを設定する

ネットワークカテゴリにある http request ノードをドラッグ&ドロップします。 functionノードと http requestノードを線で繋ぎます。プロパティ画面の設定は下記項目を設定します。

URL

https://api.line.me/v2/bot/message/{{{messageID}}}/content

認証を使用

チェック入れる

種別

Bearer認証

トークン

step2-4で発行したアクセストークンを貼り付ける

出力形式

バイナリバッファ

s407

3-8. Teachable Machine ノードを設定をする

分析カテゴリにある teachable machine ノードをドラッグ&ドロップします。 http requestノードと teachable machineノードを線で繋ぎます。プロパティは下記項目を設定します。

Url

Step1-7でメモしたTeachable MachineモデルのURLを貼り付ける
https://teachablemachine.withgoogle.com/models/xxxxxxxxxx/

Image

チェックを入れる

s408

3-9. 結果を取得する

機能カテゴリにある function ノードをドラッグ&ドロップして、Teachable Machineノードと繋ぎます。

下記コードをコピペしてください。

const className = msg.payload[0].class;
msg.payload = {};
msg.payload.events = [
    {
        "type": "message",
        "replyToken": msg.replyToken,
        "message": {
            "type": "text",
            "text": `これは、「${className}」かな?`
        }
    }
];
return msg;

s409

3-10. LINEに返す

LINEカテゴリにある ReplayMessage ノードをドラッグ&ドロップして、 functionノードと繋ぎます。プロパティは下記設定を行います。

Secret

Step2-2の値を貼り付ける

Access Token

Step2-4で発行した値を貼り付ける

s410

3-11. デプロイする

画面上部にある[デプロイ]ボタンをクリックしてデプロイしてください。

s411

3-12. 動作確認

LINEアプリから友だちになったLINE Botを開いて、学習したものを投稿してみましょう。判定結果が返ってきます。色んなものを学習させて結果が返ってくることを確認しましょう!

s413

Node-RED画面にも結果が可視化される。

s412

まとめ

GUI画面でポチポチするだけで簡単に学習モデルデータが作成できました。新たなClassを学習させたらエクスポートして、再度 Upload my model して、 発行されたTeachable MachineのモデルURLを貼り付けて再度デプロイしてみてください。