ソフトウェアエンジニアが CIID の IDP コース（10週目）に参加して学んだことをゆるりと共有します。今週（5/4~5/8）は機械学習を勉強しました。機械学習といってもプログラミングやアルゴリズムなどの難しい話はせずに、デザイナーとしてどのように機械学習を使うかというのを学びました。
9週目の記事もあるので良かったら読んでみてください。
Day 41: Teachable Machine
この日はブラウザーとウェブカメラを使って機械学習のモデルを作る Teachable Machine というサービスを教わりました。冒頭でも記述している通り難しい技術的な話はありません。それよりも、世の中に出てきた機械学習のツールをデザイナーとしてどのようにインターフェースに落とし込むかというを学びました。
機械学習で遊べ！
下記にリンクが本日の主役の Teachable Machine のリンクです。
実はこの授業の前に、自分でも Python を使って機械学習を勉強していました。その勉強方法は、まずは参考記事を５〜６本読んで、その後に GitHub に上がっているサンプルコードを読んで、やっとその後に実際に動かすという方法でした。ですが、Teachable Machine というウェブサイトは、想像より簡単に機械学習を使うことができました。これは個人的には、結構な驚きでした。なぜなら、機械学習のことがよく分からなくても、どんなことが出来るのかなんとなく想像できるからです。これは、僕の勉強方法とは逆方向のアプローチで最初に機械学習を動かしてしまうという方法です。そして、それは単純にとても楽しかったです。
Teachable Machine では、画像、音声、体勢のモデル化をやってくれます。特に難しいことは分からなくても、普通に使えます。これを使って、僕個人では「どうぶつの森」のアバターのどれが自分に似てるかを判定するモデルを作りました。
チームでは、椅子の正しい座り方の判定モデルを作りました。
上記のように、機械学習を気軽に試せる環境は整っていると感じました。また、その一方で機械学習は銀の弾丸ではないことを講師が強調していました。機械学習を無闇矢鱈に使えば良いサービスが出来るというわけではなく、使い所を意識した正しいサービスをデザインする必要があると教わりました。なので、デザイナーとしては何が出来て何が出来ないという難しいアルゴリズムの議論ではなく、まずは使ってみるという姿勢で機械学習の可能性を試すことを勧められました。後述しますが、今週はこのことを口を酸っぱくして講師からフィードバックを受けていました。
章末ですが、機械学習の身近な利用例として紹介されたウェブサイトを共有しておきます。
Day 42: p5.js + ml5.js + RunwayML
この日は p5.js/ml5.js という JavaScript のライブラリーと RunwayML というサービスを教わりました。冒頭でも記述している通り難しい技術的な話はありません（２度目）。この日はツールの授業をした後に、金曜日に向けてのプロジェクトに取り掛かりました。今週のブリーフは「機械学習を使って、コロナの孤立感を減らすサービスをデザインする」でした。僕たちのチームは「機械学習を使ってエアバンドを出来るようにする」をコンセプトにしました。この章はツールの紹介をしようと思います。
p5.js + ml5.js
p5.js は Processing を JavaScript で動かせるようにしたライブラリーです。ユーザーのアクションをリアルタイムに感知して、特定のフィードバックを返してくれます。基本的に JavaScript のブラウザで動く非同期の特性と Processing の API を組みあせたライブラリーです。
ml5.js は機械学習のモデルを作成/読み取りしてくれるライブラリーです。 TensorFlow.js がもともと出発地点で、それをブラウザーでも使えるようにしてくれたライブラリーです。p5.js との親和性を意識して作られているようで、p5.js の再レンダリングの機能を活かしたリアルタイムな解析を行っています。
参考のコードや事例は下記にまとまっています。興味ある方は見てみると良いと思います。
また、annyang というライブラリーを使うと、ブラウザーで音声の認識と解析も出来るようになります。
p5.js と ml5.js を使った実装のチュートリアルが下記の再生リストにまとまっていました。これは個人的にかなり勉強になりました。（説明してくれるおじさんが愉快で見てて和みます。笑）
RunwayML
RunwayML は機械学習のモデルの GitHub みたいなサイトです。RunwayML 上に投稿されたモデルは自由に作って、自由に試せます。実際に使ってみたい方は、ダウンロードが必要なので下記のリンクからダウンロードしてみてください。
ただ、全部の機能が無料で使えるというわけでないです。投稿されたモデルの読み込みをクラウドで行う際の、読み込み時間の従量課金です。サインアップすると10ドルが無料で使えるので試す分には良いと思います。これを試すと、世の中にある写真加工アプリや最近流行りの Snap Camera がどのように作られているのかイメージできるようになります。チュートリアル動画を下記に示しておきます。
RunwayML と p5.js を繋げる方法があるようでしたが、難しかったのでとりあえず飛ばしました。（分かり次第更新予定です。）
Day 43: Simple Concept
この日は前日に決めたコンセプトを講師たちとディスカッションしてフィードバックをもらう日でした。機械学習を使ってデザインする際に気を付けることをメインに教わりました。
小さな課題と明確なコンテキスト
前述のした通り機械学習は万能ではありません。難しい問題を魔法のようにすべて解決してくれるわけではないです。むしろ、なぜ機械学習を使う必要があるのかを定義する必要があります。その時に必要なものがシンプルなコンセプトです。そして、シンプルなコンセプトを構成する要素が、「課題」と「コンテキスト」だと教わりました。
これは僕のエンジニアとしての経験ですが、この「課題」と「コンテキスト」に集中する意義がとても腑に落ちました。実際に、ものづくりのフェーズに入ると、フワッとした夢のようなコンセプトでは何も作れません。今回のように機械学習を使ってサービスを作るというのは、プログラミングを使ってサービスを作る行為と全くの同義だと思います。よりコンセプトが具体的であればあるほど、集中するべき機能が分かり、考慮するべき箇所が分かり、開発速度は早くなります。実際にものづくりをすると、抽象的なコンセプトでは出戻りも多くなるし、たくさん作りすぎてしまうのでプロトタイプのフィードバックループを遅くしてしまいます。
なので、いきなり大きな課題を解決するのではなくて、小さな課題に集中する。また、ユーザーやインタラクションを明確にすることで、コンテキストを明確にする。そして、その結果としてコンセプトをシンプルにする。これらの講師からの教えは、心の底から賛同しました。特に今回のように機械学習という難しい初めての技術を使う際は、殊更にシンプルなコンセプトを心がけた方が良いのだろうと思いました。
僕たちのチームは、「エアバンド」というコンセプトから「楽器をまだ持っていない音楽勉強への入門者に、スケッチの楽器を実際に弾けるサービス」というコンセプトにしました。下記の記事や動画はちょっと違いますが、機械学習を使って音楽を楽しむという観点で、チーム内で参考にしました。
Day 44: Try and Make a lot of models
この日は翌日の発表に向けてプロトタイプを作り込む日でした。この日は特にモデル作成に注力していました。この日はエンジニアリングがメインでした。その中でも講師に言われて印象的だったことを共有しようと思います。
No speech, Show me
何度も言ってますが、機械学習は魔法でも銀の弾丸でもありません。ただ、機械学習で何でも出来ると思っている人は、少なくないように感じています。これはプログラミングでも同じようなことがあって、プログラミングで何でも解決できると思っている人が多いように感じています。
そして、この日に「No speech, Show me（語るな、作って示せ）」と講師に言われて、「確かにな」と思いました。僕たちのチームは、ギターのモデルの作成に苦労していました。そのことを講師たちに「こんなことできたら面白いと思うんですよ！」と話したら、この言葉を言い渡されました。それに続いて「作って実現可能性を示して、絞っていけば良い。自分たちの出来る範囲でプロトタイプしていくことが重要だ。」と言われました。これから分かるように、最初のプロトタイプに複雑な要素は不要だと思います。実際に求められているサービスなのかを試すために、格好良い完璧なプロトタイプは必要ありません。まずは、自分たちのコンセプトを何らかの形で実現することが一番重要です。そうすることでフィードバックを得てまた改善に進めることができます。
その後、僕たちのチームはギターのモデルの作成だけで12回行いました。最初はリアルのギターっぽくしたかったので、立ったでの体勢モデル作成をやっていましたが、実現可能なレベルまで複雑性を落とすことに決めました。ギターの絵を画像認識しやすいレベルまで落とし、色と形を使って認識しやすいようにしました。また、Teachable Machine で作成したモデルだと ml5.js で上手く再現できなかったので、ml5.js でモデルを作成してそれをもとに画像解析をするように変更しました。下記の動画は最終的なギターのモデルのデモ動画です。ギターの面影はありませんが、「スケッチで楽器を弾ける」というコンセプトを最大限簡素に再現しました。
Day 45: Presentation
この日は今週のプロジェクトの発表の日でした。僕たちは「Sketch Band」というプロトタイプを作りました。その発表資料とコンセプト動画を下記に載せておきます。
今週は実際にコードを書いてプロトタイプ作成ができたので個人的にはとても楽しかったです。更に、今回作った「Sketch Band」は本当にあったら楽しいだろうなと思って作れたので満足度がとても高い週でした。また、自分たちで実際に「Sketch Band」を使って動画を作るという丁度よい目標があったので、1週間を通してみんなのエンゲージメントが高く、脇道に逸れることも少なかったと思います。改めて、実現可能な目標をチームで持つとそれぞれのアウトプットが高いのだなと感じました。（ちなみに下記の曲を演奏したつもりです。笑）
11, 12週目の記事もあるので良かったら読んでみてください。