「初めてのWatson」ハンズオン
•
2 likes•3,109 views
2016年11月7日／14日に行った「初めてのWatson」ハンズオンの資料です。 2016年10月下旬刊行の「初めてのWatson」（井上研一＝著・リックテレコム＝刊）の書籍と連動したハンズオンで、第6章の顔認識アプリの開発をベースにしています。BluemixとMonacaのアカウントが必要です。 ハンズオンを進めるためのMonacaプロジェクトのアーカイブは資料内のURLでダウンロード可能です。（完成版のMonacaプロジェクトのアーカイブは書籍をご購入の上、書籍に記載のダウンロードサイトから入手できます。）
More Related Content
What's hot
What's hot (20)
Similar to 「初めてのWatson」ハンズオン
Similar to 「初めてのWatson」ハンズオン (20)
More from Kenichi Inoue
Recently uploaded
Recently uploaded (10)
「初めてのWatson」ハンズオン
- 2. 確認 • Bluemixのアカウントは作成しましたか？ • 地域「⽶国南部」で組織とスペースを作成していますか？ • Monacaのアカウントは作成しましたか？ • PC/MacにChrome、スマートフォン（Android/iPhone）に Monacaデバッガーはインストールしてありますか？
- 3. ⾃⼰紹介 • 井上 研⼀ • 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）
- 4. ⼈⼯知能の研究者ではありません • 書籍にも書いたことですが･･･ （「おわりに」など） • Watsonの導⼊プロジェクト（2案件）や、機械学習の活⽤など を「開発のお仕事の⼀環として」やっています。 • あくまで現場⽬線で「初めてのWatson」や2冊⽬となる⼈⼯知 能系の書籍の執筆を⾏っています。 • 今⽇のハンズオンをきっかけにして、Watsonはもちろん、そ の他の⼈⼯知能も試してみてください。実際のプロジェクトに 活⽤してみてください！（ Watsonは特に簡単です！！） • きっと損はしません！！！
- 5. 書籍「初めてのWatson」 著者：井上研⼀ 出版：リックテレコム B5変型版 224ページ 定価：2,200円＋税 2016年10⽉下旬刊⾏ ISBN：978-4-86594-052-7 https://www.amazon.co.jp/dp/4865940529 本書は「Watsonを使ってみたい」という⽅向けの解説書で す。「Watsonとは何か？」からスタートし、クラウドサー ビスIBM Bluemixの無料枠を使ってWatsonを動かしたり、 簡単なボットアプリや画像認識アプリを作ります。ITエン ジニアに限らず、JavaScriptが書ける⽅なら、⼀般ビジネ スマンや学⽣さんでも、余さず本書を活⽤できるでしょう。
- 6. 「初めてのWatson」⽬次 1. Watsonを知るための6つの 質問 2. ⼈⼯知能とは何か？ 3. とにかくWatsonを体験して みよう 4. Watsonでできること 5. Node-REDでTwitter Botを 作ろう 6. 画像認識アプリを作ろう 7. Watsonの可能性 ハンズオンの対象
- 7. 今⽇のハンズオンは･･･ • 書籍「初めてのWatson」の第6章にある顔認識アプリを作って みます。 • ⼈⼯知能（機械学習）の醍醐味は、⾃分で準備したデータで学 習モデルを作ったり、その精度を⾼めたりする「学習フェー ズ」にあると思います･･･。 • しかし、データの準備が⼤変ですし、Watsonが学習に要する 時間が読めないということもあり、ハンズオンには不向きなの です･･･。 • なので、Watsonに実装済みの学習モデル（顔認識）を使った ハンズオンとなることをご了承ください。
- 10. Visual Recognitionの有効化 • Bluemixダッシュボード＞カタログ＞Watson＞Visual Recognition • 画⾯最下部の「作成」 ※既にVisual Recognitionのインスタンスがある⽅は、それを 使っていただいても構いません。 書籍：P127
- 12. api_keyの確認
- 13. Monaca
- 15. プロジェクトのインポート • Monacaの演習が⽬的ではないので、既にできあがったプロ ジェクトをインポートして、⾃分の環境のVisual Recognition インスタンスを使うようにコードを記述していきます。 • 画⾯遷移と撮影機能は実装済みです。 ダウンロードURL http://bit.ly/2dXBIGU
- 16. プロジェクトのインポート
- 18. Monaca IDE
- 19. index.htmlを開く
- 20. アプリの概要 撮影画⾯ (page1) • Cameraボタン Face Detectボタン 結果表⽰画⾯ (page2) Watson Visual Recognition
- 23. Visual Recognitionでできること • Classify an image（画像の分類） • デフォルトの学習モデル • 独⾃の学習モデル • Detect faces（顔の認識） • Collections (Similarity Search：類似画像の検索） • 2016/9/8 Beta版リリース • Text Recognition（画像内の⽂字列の認識） • 2016/9/8 Beta版クローズ
- 25. 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
- 26. 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の⽅は重要！
- 27. 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 書籍のコードより、 ⼀部省略しています。
- 28. Watsonからのレスポンス //顔認識APIからのレスポンスを処理 console.log(r.response); var response = JSON.parse(r.response); • 年齢の上限または下限だけが結果になった場合にも対応しま しょう。 • 性別の表⽰もしてみましょう。 この⾏を追加 書籍：P199