Embed Size (px)
Citation preview
「初めてのWatson」ハンズオン
2016年11⽉7⽇/14⽇井上 研⼀ (@inoccu)
確認• Bluemixのアカウントは作成しましたか？• 地域「⽶国南部」で組織とスペースを作成していますか？
• Monacaのアカウントは作成しましたか？• PC/MacにChrome、スマートフォン（Android/iPhone）に
Monacaデバッガーはインストールしてありますか？
⾃⼰紹介• 井上 研⼀• ITエンジニア• ITCA認定 ITコーディネータ（経済産業省推進資格）• アルティザンエッジ合同会社 代表社員・CEO• Tech Garden School 講師（CakePHP等）• こどもプログラミング 中野まなびじゅく 講師（Scratch/Arduino）
• 2000年より某SIerで業務向けWebシステム等の開発に携わる• 2013年7⽉にアルティザンエッジ合同会社を創業• @IT「JobSchedulerをNagiosと連携して⾃動化！」（2014/1）• 第1回Cordova勉強会「Cordovaで業務アプリを作る」（2014/11）
⼈⼯知能の研究者ではありません• 書籍にも書いたことですが･･･ （「おわりに」など）• Watsonの導⼊プロジェクト（2案件）や、機械学習の活⽤など
を「開発のお仕事の⼀環として」やっています。• あくまで現場⽬線で「初めてのWatson」や2冊⽬となる⼈⼯知
能系の書籍の執筆を⾏っています。• 今⽇のハンズオンをきっかけにして、Watsonはもちろん、そ
の他の⼈⼯知能も試してみてください。実際のプロジェクトに活⽤してみてください！（ Watsonは特に簡単です！！）• きっと損はしません！！！
書籍「初めてのWatson」著者：井上研⼀ 出版：リックテレコムB5変型版 224ページ定価：2,200円＋税 2016年10⽉下旬刊⾏ISBN：978-4-86594-052-7https://www.amazon.co.jp/dp/4865940529
本書は「Watsonを使ってみたい」という⽅向けの解説書です。「Watsonとは何か？」からスタートし、クラウドサービスIBM Bluemixの無料枠を使ってWatsonを動かしたり、簡単なボットアプリや画像認識アプリを作ります。ITエンジニアに限らず、JavaScriptが書ける⽅なら、⼀般ビジネスマンや学⽣さんでも、余さず本書を活⽤できるでしょう。
「初めてのWatson」⽬次1. Watsonを知るための6つの
質問2. ⼈⼯知能とは何か？3. とにかくWatsonを体験して
みよう4. Watsonでできること
5. Node-REDでTwitter Botを作ろう
6. 画像認識アプリを作ろう7. Watsonの可能性
ハンズオンの対象
今⽇のハンズオンは･･･• 書籍「初めてのWatson」の第6章にある顔認識アプリを作って
みます。• ⼈⼯知能（機械学習）の醍醐味は、⾃分で準備したデータで学
習モデルを作ったり、その精度を⾼めたりする「学習フェーズ」にあると思います･･･。• しかし、データの準備が⼤変ですし、Watsonが学習に要する
時間が読めないということもあり、ハンズオンには不向きなのです･･･。• なので、Watsonに実装済みの学習モデル（顔認識）を使った
ハンズオンとなることをご了承ください。
独⾃の学習モデルWatsonデフォルトの学習モデルを使⽤する場合は、学習
フェーズは必要ない
Watsonデフォルトの学習モデル：・画像分類のデフォルト分類器・顔認識
書籍：P129
Visual Recognition
Visual Recognitionの有効化• Bluemixダッシュボード＞カタログ＞Watson＞Visual
Recognition
• 画⾯最下部の「作成」
※既にVisual Recognitionのインスタンスがある⽅は、それを使っていただいても構いません。
書籍：P127
api_keyの確認
Monaca
Monaca Debugger書籍：P193
• アプリのインストール後、MonacaのユーザID／パスワードでログインしておいてください。
プロジェクトのインポート• Monacaの演習が⽬的ではないので、既にできあがったプロ
ジェクトをインポートして、⾃分の環境のVisual Recognitionインスタンスを使うようにコードを記述していきます。• 画⾯遷移と撮影機能は実装済みです。
ダウンロードURL
http://bit.ly/2dXBIGU
プロジェクトのインポート
インポート完了（Watson Camera）
Monaca IDE
index.htmlを開く
アプリの概要
撮影画⾯ (page1)• Cameraボタン
Face Detectボタン
結果表⽰画⾯(page2)
WatsonVisual
Recognition
API Referenceの確認（1）
API Referenceの確認（2）
Visual Recognitionでできること• Classify an image（画像の分類）• デフォルトの学習モデル• 独⾃の学習モデル
• Detect faces（顔の認識）• Collections (Similarity Search：類似画像の検索）• 2016/9/8 Beta版リリース
• Text Recognition（画像内の⽂字列の認識）• 2016/9/8 Beta版クローズ
Detect faces（顔認識）
Visual Recognition APIの呼び出し//画像ファイルのアップロード（顔認識APIの呼び出し）var url = 'https://gateway-a.watsonplatform.net/visual-recognition/api/v3/detect_faces?api_key=' + apiKey + '&version=2016-05-20';var options = new FileUploadOptions();options.fileKey = 'images_file';options.fileName = 'uploadfile.jpg';options.mimeType = 'image/jpeg';var fileTransfer = new FileTransfer();
書籍：P199
APIからの出⼒を表⽰（1）fileTransfer.upload(photoFileUri, url, function(r) { //顔認識APIからのレスポンスを処理
var response = JSON.parse(r.response); var image = response.images[0]; var text = '';
//recognize...部分を書き換えvar message = document.getElementById('message');message.innerHTML = text;
}, function(error) {alert(error.code);
}, options, true);
書籍：P199
ここに次スライドのコードが⼊ります
Android4.xの⽅は重要！
APIからの出⼒を表⽰（2）if ('faces' in image) { if (image.faces.length > 0) { //顔認識ができた場合
var face = image.faces[0]; //年齢
text += 'Age: '; if ('max' in face.age && 'min' in face.age) { //年齢の上限と下限が認識された場合
text += face.age.min + ' - ' + face.age.max + ' (' + face.age.score + ')<br>'; }
} else { //顔認識ができなかった場合
text += 'not found!'; }} else if ('error' in image) { //その他のエラーがあった場合
text += image.error.description;}
書籍：P199
書籍のコードより、⼀部省略しています。
Watsonからのレスポンス //顔認識APIからのレスポンスを処理console.log(r.response); var response = JSON.parse(r.response);
• 年齢の上限または下限だけが結果になった場合にも対応しましょう。• 性別の表⽰もしてみましょう。
この⾏を追加
書籍：P199
＜応⽤編＞画像の分類※顔認識ができた⽅はチャレンジしてみましょう！
Classify an image（画像の分類）
APIの違い• 顔認識
https://gateway-a.watsonplatform.net/visual-recognition/api/v3/detect_faces?api_key={api-key}&version=2016-05-20
• 画像の分類（パラメータファイルを使⽤しない場合）https://gateway-a.watsonplatform.net/visual-recognition/api/v3/classify?api_key={api-key}&version=2016-05-20
