はじめに
Teachable Machineという面白いページがあって、お手軽に機械学習による画像、音、ポーズの分類を試してみることができます。トレーニングによって得られたモデルはダウンロードすることができ、前回はRaspberry piで動かしてみることに挑戦しました。
今回は、モデルをjavascriptから利用できる形でダウンロードし、ローカルに保存したモデルファイルを用いてブラウザ上で画像分類を再現します。ここが味噌です、
ローカルに保存したモデルファイルを用いて
実はこれ、以前から実現したいと思いつつ、どうもうまく動かすことができずにいました。Tensorflow lite用のモデルをpythonから使う、ならできる、javascript用のモデルをアップロードして、得られたリンクを使う、ならできる。でも、ローカルに落としてきたファイルを使うやり方が、あれ、なんで？そんなの簡単なはず、と侮っていたのがいけませんでした。File pathわたすだけでしょ。
それがちがーう！
javascriptはそもそも自動でローカルのファイルを勝手に読んだりはしなーい！
それを知らなかったという、超初心者な自分を反省することになりました。何度も睨めっこをしたAPIのページも、わかってから見れば、親切なご指示、ごもっともでございます、として読めるようになりました。
それでは参りましょう。
teachable machineで作業
Webカメラからの画像を用いた分類器をひとつ作ります。
Teachable Machineのページを開き、Get Startedをクリック。
Image projectを選択して、
Standard image modelを選びます。
分類したいものは、なんでも構いません。分類したいものが何も写っていないようなものをバックグランドとしてとって、合計３つか４つぐらいクラスを作ってください。笑顔と真顔、兄と弟と私、ケチャップとマヨネーズ、そば、うどん、ラーメン、なんでもいいです。ここではじゃんけんのグーチョキパーで試します。それぞれstone, scissors, paperとしています。バックグラウンドはblankとしました。
Webcamをクリックすると、
カメラにアクセスしたいんですが、というメッセージがでますので、サイト訪問中ならね、か、今回だけならね、をクリックします。OSやブラウザによって異なるメッセージがでますが、許可、という意味を含むものを選んでください。
カメラプレビューがでます。デフォルトでは、ボタンを押している間撮影し続けるようになっているのですが、１００枚取りたい、などというときには、少々使いづらいので、設定を変更します。右下のギアをクリック。
私の環境では、以下の設定で100枚と少し画像を得ることができましたので、これでいきます。手を近づけたり遠ざけたり、手のひら側、手の甲側など、これをパーとして判定してほしい、という画像を撮りためます。こりゃ失敗、というものがある場合には、マウスカーソルをその写真の上にもっていくとゴミ箱の絵がでますので、それをクリックすれば削除することができます。また、全部消したい、やり直したい、という場合には、右上の縦elipsisから、すべて削除という意味、の項目が選べるはずなので、それを用いてください。
同様にすべてのクラスのものについて画像を収集していきます。今回は100枚程度としましたが、背景を変えて取ったり、枚数を変えてみたり、いろいろ試してみてください。
すべてが揃うとTrain Modelへ進めるようになります。クリックするだけです。
トレーニングが完了するとすぐさまPreviewパレットが動き出します。いろいろ手の形を変えて遊んでみましょう。一旦止めたい場合は、Inputをoffにします。
もし判定具合に納得がいかない場合は、データ収集のところからやり直してみましょう。背景によっては、手が写っていないのに判定が出続けたりすることがあります。できるだけなにもないような背景をとるようにすると改善するかもしれません。
さて、これでいいぞ、となったら、Export Modelをクリックします。
下のように、選択して、Download my modelをクリックします。
zipファイルが得られるので、展開しておきます。フォルダの中には、以下の３つのファイルが入っているはずです。
さて、モデルはローカルに保存されました。あとは、これを使ってみるだけです。
localに保存したモデルファイルを使う
htmlファイルを一つ用意しました。以下から”tm-image_local.html”をダウンロードしてください。
GitHub: https://github.com/misson3/tm_related
htmlファイルは、モデルをダウンロードするときに表示されていたsnipetを核にして書きました。barグラフを書く部分は、ぽむたさんの記事と、ソースコード
を参考にさせてていただきました。このgokuri_counter、ものすごくオモシロイので、みなさまもぜひお試しください。gokuri_counterではモデルはリンクから得られるようになっていますので、モデルファイルのダウンロードは必要ありません。飲んでる、が認識されるとゴクリ、という音が出るところなどは、もう最高です。自分のコード書きを忘れてしばし飲み込まれて遊んでしまいました。
私の”tm-image_local.html”はダブルクリックするとデフォルトのブラウザで開くと思います。以下が表示されます。
先程zipを展開したフォルダの中にあった３つのファイルをChoose Fileをクリックして選択していきます。
| 項目 | 選ぶファイル |
| model | model.js |
| weights | weights.bin |
| metadata | metadata.js |
すべてセットできたら、
Startボタンをクリックします。カメラへのアクセス許可を求めるメッセージがでますので、許可してください。カメラからのリアルタイム画像と、predictionの確率が表示されます。
いかがでしょう。うまく動きましたでしょうか。動作中はCPUとメモリーが多く占有されますので、使い終わったらタブを閉じるか、リロードしてファイルを選ぶ前の状態に戻して停止させてください。
カメラから画像をとってリアルタイムで判定、がこうやってできてしまうのはすごいことですね。
なんでローカル保存にこだわったのか
機械学習をいろいろなことに使う、使おうとしてみる、使えばオモシロイことができるようになるようなモノゴトはないか、を考える、そういう機会が増えてきました。こうなると、ワイワイ相談するために、機械学習って何？が分かる仲間を増やす必要が生じてきます。データの集め方や手法の選択の話に突入する前に、トレーニングの結果として得られるもの、すなわちモデル、がそもそもどういう形をしたものなのか、いったいそれは何なのか、実体として見せたい、というのがローカルファイルにこだわった理由です。おお、これらがそれか、そういうことか、とわかってくれれば、別の場所に持っていけるよね、とか、他の人にも使ってもらえるね、ということが自然にわかってもらえます。
技術には触れてみる、使ってみる、それで何かを作ってみる、ことが大切です。Teachable Machineは本当に優れたシステムです。何も知らなくてもできる。ひとまずできた、までたどりついたら、次はそれを使ってみる、それで何かを作ってみる、を目指しましょう。
この小さな記事が、少しでもお役に立てば願ったりかなったりです。
