PowerPoint Presentation

Size: px

Start display at page:

Download "PowerPoint Presentation"

としなりはぎにわ
7 years ago
Views:

1 IBM Bluemix と AlchemyAPI を使って画像認識アプリケーションを作る日本アイビーエム木村桂

2 まずは Free API Key の取得

3 入力項目目的名姓メールアドレス確認メールアドレスチェック ( 例 )To retrieve meta information in images. 挑戦すること

4 Free API Key の条件無料 1 日 1000 トランザクション API の種類は問わずに合計した値画像関連だけでなく言語やニュース系 API を使う場合にも適用 API を1 回実行 = 1トランザクション? 違います API を1 回実行した時のトランザクション数は実行結果に含まれていますより複雑な API ほどトランザクション数が大きくなります

5 API Key を保管 ( 申請から5 分程度でこのようなメールが届きます) この文字列を保管しておく

7 人工知能学習の種類ちなみに IBM では人工知能 (AI) とは言いませんコグニティブ(Cognitive 認識型人工知能 ) と言います人間型非人間型人間の脳学習モデル人間の脳ではないもの先生上限無限人間らしさ目的人間を超える人間の棋譜を使って人間のように打てるように学習させる ( 例 ) 将棋 AI 膨大な選択肢から仮説に基いた絞り込みを行い最適解を探す AlchemyAPI Watson 今日はこちら

間らしさ目的人間を超える人間の棋譜を使って人間のように打てるように学習させる ( 例 ) 将棋 AI

8 画像認識何が写っているのか? Alchemy Vision 誰が写っているのか? Alchemy Face Detection 結果のフォーマットの可能性があるの可能性がある : (という配列 ) 人が写っている 1 人目の情報 2 人目の情報 : (という配列 ) 各配列要素の中身識別したものその確率顔の位置性別その確率年齢その確率個人名その確率

9 これからこんなアプリを作ります Alchemy Vision の結果をタグクラウド指定画像と Alchemy Face Detect の結果を表示この API で使ったトランザクション数認識対象画像のURLを(パラメータで) 指定するとその画像を顔認識 / 物体認識した結果を視覚的に表示する

10 AlchemyVision デモサイト

11 Alchemy Vision API 画像ファイルのURLから何が写っているのかの認識を行うパブリックに公開されている URL であること! 具体的には以下のエンドポイントへ Get メソッドでアクセスする: キー) &url=( 画像 URL) &outputmode=json &knowledgegraph=1

具体的には以下のエンドポイントへ Get メソッドでアクセスする: http://access.alchemyapi.

12 URLGetRankedImageKeywords API の実行結果 { "status": "OK", "usage": "By accessing AlchemyAPI or ", "url": " "totaltransactions": 4", この API コールで消費したトランザクションは 4 "imagekeywords": [ 結果は imagekeywords の中 ( 配列 ) { text": sport", "score": " sport の確率が % と認識 }, { text": football", football の確率が % と認識 "score": " } ] } 詳細は API リファレンス参照

jpg", "totaltransactions": 4", この API コールで消費したトランザクションは 4 "imagekeywords": [ 結果は imagekeywords の中 ( 配列 ) { text":

13 API リファレンス情報

14 試しにブラウザで実行してみるウェブブラウザで以下の URL を指定してアクセスします: Key の値 ) &outputmode=json &url= 画像 URL

com/calls/url/urlgetrankedimagekeywords?

15 Alchemy Face Detection デモサイト

16 Alchemy Face Detection API 画像ファイルのURLから誰が写っているのかの顔認識を行うパブリックに公開されている URL であること! 具体的には以下のエンドポイントへ Get メソッドでアクセスする: キー) &url=( 画像 URL) &outputmode=json &knowledgegraph=1

17 URLGetRankedImageFaceTags API の実行結果 { "status": "OK", "usage": "By accessing AlchemyAPI or ", "url": " "totaltransactions": "5", この API コールで消費したトランザクションは 5 "imagefaces": [ 結果は imagefaces の中 ( 配列 ) { age : { "agerange": "18-24", "score": " }, age: 推定年齢層とその確度 ] } "gender": { "gender": "FEMALE", "score": " }, "identity": { "knowledgegraph": { "typehierarchy": "/people/ariana grande }, "name": "Ariana Grande", "score": " " }, "positionx": "116", "positiony": "19", height : 48, "width": "48 } gender: 推定性別とその確度個人が特定できた場合は identity 内に情報が入り名前とその確度 positionx, positiony: 顔の位置 width, height: 顔のサイズ詳細は API リファレンス参照

702753 }, age: 推定年齢層とその確度 ] } "gender": { "gender": "FEMALE", "score": "0.

18 API リファレンス情報

19 試しにブラウザで実行してみるウェブブラウザで以下の URL を指定してアクセスします: Key の値 ) &outputmode=json &url= 画像 URL

com/calls/url/urlgetrankedimagefacetags?

21 これから作成するアプリ( 今日のゴール) 認識対象画像のURLを(パラメータで) 指定するとその画像を顔認識 / 物体認識した結果を表形式で表示する

22 これから作成するアプリ( 最終形 ) Alchemy Vision の結果をタグクラウド指定画像と Alchemy Face Detect の結果を重ねて表示 ( 男性 = 青枠女性 = 赤枠 ) この API で使ったトランザクション数認識対象画像のURLを(パラメータで) 指定するとその画像を顔認識 / 物体認識した結果を視覚的に表示する

23 Bluemix にログインログイン後のダッシュボード画面でアプリの作成をクリック

24 WEB アプリを選択アプリの種類は WEB を選択

25 PHP ランタイムを選択ランタイムの種類は PHP を選択実際はどのランタイムでも作れるが本資料では PHP で作成する

26 続行 PHP ランタイムの説明を確認して続行

27 アプリケーションの名前を指定 PHP ランタイムアプリケーションの名前を指定して入力して終了ホスト名の一部になるので重ならない名前にする ( 例 ) kkimura( 自分の名前 )-php-yyyymmdd( 日付 )

28 ステージング処理待ち PHP ランタイムの作成はこれで終わりステージング処理が完了するまで待つこの画面ではこの後にどうやって PHP アプリをランタイムに反映させるかの方法が紹介されている

29 ステージング処理完了ステージング処理完了 (もうアプリケーションサーバーとして利用可能 ) 一度ダッシュボードに戻る

30 ダッシュボード画面ダッシュボード画面に今作った PHP ランタイムが追加されていることを確認このアイコンをクリック

31 作成した PHP ランタイムの概要作成して稼働中の PHP ランタイムが表示されていることを確認

32 アプリの実装内容 (1) PHP ファイルがパラメータで画像 URLを受け取る ( 例 ***.php?url= (2) 受け取ったパラメータの値 ( 画像 URL)に対して Alchemy Vision API と Alchemy Face Detection API をそれぞれ実行する (3) 各結果の JSON を解析して表形式で表示する (4) (おまけ) 結果表示方法をより視覚的にカスタマイズする

33 Bluemixソースコードの開発 /デプロイ選択肢は3つ Eclipse 環境で開発し Eclipse プラグインを使ってデプロイ普通にテキストエディタで開発し cf ツールを使ってデプロイ IDS(IBM DevOps Services) を使って Git リポジトリを作りリポジトリのコードを編集した後にビルド&デプロイ今回は cf ツールを使った方法を紹介します

34 cf コマンドラインツールをダウンロードの Stable Installers から環境にあったモジュールをダウンロードしてインストール

35 cf コマンドラインツールの動作確認コマンドプロンプト(OS X の場合はターミナル)を開き cf v と入力バージョン番号が表示されればインストール成功

36 ドキュメントルート作成 PHP のウェブアプリケーションを作る上でのドキュメントルートとなる空フォルダをローカルマシン内に作成しますこの例では c: tmp docroot をドキュメントルートとしました

37 ドキュメントルートに移動コマンドプロンプトでこのドキュメントルートのフォルダに移動します > cd tmp docroot

38 cf ツールでログイン cf ツールを使って Bluemix にログインします: > cf login a (ユーザー名とパスワードを聞かれるので入力する)

39 PHP ファイル作成このドキュメントルートフォルダに PHP ファイルを新規に作成します: > notepad image.php

40 image.php の内容 (1) <html> <head> <title>alchemyapi サンプル</title> </head> <body> <?php $trans1 = 0; $trans2 = 0; if( isset( $_GET['url'] ) ){ $apikey = (Alchemy API Key の値 )'; $url = $_GET['url']; $alchemyurl = ' <img src='<?php echo $url;?>'/> <p/> <?php API key の値 $apiurl1 = $alchemyurl. 'URLGetRankedImageKeywords?apikey='. $apikey. '&outputmode=json&url='. urlencode( $url ); $text1 = file_get_contents( $apiurl1 ); $json1 = json_decode( $text1 ); 画像 URL を取得モノ認識 API の URL API を実行して結果の JSON を取り出す $trans1 = $json1->totaltransactions; $imagekeywords = $json1->imagekeywords; if( count( $imagekeywords ) ){?> <h2>keywords</h2> <table border='1'> <tr><th>text</th><th>score</th></tr> <?php 配列の結果をループで1つずつ取り出す for( $i = 0; $i < count( $imagekeywords ); $i ++ ){ $imagekeyword = $imagekeywords[$i]; $text = $imagekeyword->text; $score = $imagekeyword->score;?> <tr><td><?php echo $text;?></td><td><?php echo $score;?></td></tr> <?php }?> </table> <p/> <?php }

41 image.php の内容 (2) $apiurl2 = $alchemyurl. 'URLGetRankedImageFaceTags?apikey='. $apikey. '&outputmode=json&knowledgegraph=1&url='. urlencode( $url ); $text2 = file_get_contents( $apiurl2 ); $json2 = json_decode( $text2 ); $trans2 = $json2->totaltransactions; $imagefaces = $json2->imagefaces; if( count( $imagefaces ) ){?> <h2>facetags</h2> <table border='1'> <tr><th>attr</th><th>value</th><th>score</th></tr> <?php for( $i = 0; $i < count( $imagefaces ); $i ++ ){ $imageface = $imagefaces[$i]; $positionx = $imageface->positionx; $positiony = $imageface->positiony; $width = $imageface->width; $height = $imageface->height; $ageo = $imageface->age; 顔認識 API の URL API を実行して結果の JSON を取り出す配列の結果をループで1つずつ取り出す $gendero = $imageface->gender;?> $gender = $gendero->gender; $genderscore = $gendero->score; <tr><th colspan='3'><?php echo $i;?></th></tr> <tr><td>positionx</td><td><?php echo $positionx;?></td><td> </td></tr> <tr><td>positiony</td><td><?php echo $positiony;?></td><td> </td></tr> <tr><td>width</td><td><?php echo $width;?></td><td> </td></tr> <tr><td>height</td><td><?php echo $height;?></td><td> </td></tr> <tr><td>age</td><td><?php echo $agerange;?></td><td><?php echo $agescore;?></td></tr> <tr><td>gender</td><td><?php echo $gender;?></td><td><?php echo $genderscore;?></td></tr> <?php?> $identityo = $imageface->identity; if( $identityo ){ $name = $identityo->name; $namescore = $identityo->score; <tr><td>name</td><td><?php echo $name;?></td><td><?php echo $namescore;?></td></tr> $agerange = $ageo->agerange; $agescore = $ageo->score;

42 image.php の内容 (3) <?php?> } <?php?> } </table> <p/> <?php }?> <div align='right'> 使ったトランザクション数 :<?php echo $trans1;?> + <?php echo $trans2;?> = <?php echo ($trans1 + $trans2);?> </div> <?php }?> </body> </html>

43 ソースコード本ハンズオンセミナーのソースコードはこちらからダウンロード可能です: 実際に使う場合は jqcloud ライブラリと合わせて用意する必要があります: 上記 2サイトからダウンロード& 解凍した結果の *.php, *.js, *.css ファイルを全て同じ(ドキュメントルートの)フォルダに展開します

44 PHP ファイルをプッシュカレントディレクトリを丸ごと Bluemix 上の PHP サーバーのドキュメントルートにプッシュ( 転送 )します: > cf push (アプリ名 )

45 プッシュ成功を確認プッシュが成功すると図のような PHP サーバーの稼働状態が表示されます:

46 image.php の動作確認ウェブブラウザで名 ).mybluemix.net/image.php?url=( 画像のURL) にアクセスして期待通りに表が出力される結果になることを確認するいくつかの画像 URLで確認する

47 (おまけ) index.php の動作確認ウェブブラウザで名 ).mybluemix.net/?url=( 画像のURL) にアクセスして期待通りにタグクラウドと顔認識結果が出力されることを確認するいくつかの画像 URLで確認する

48 ( 改良に挑戦してほしいこと) 人間が写っているとは限らないのに顔認識が実行されていてトランザクションが無駄写っているものが人間だった場合のみ顔認識を実行する画像がプライベートネットワーク上にあったり認証がかかっていて普通に URL を指定しただけではアクセスできない場合を想定画像を一度ダウンロードした上でそのバイナリデータをポストして認識させるというアルゴリズムに変更 ImageGetRankedImageKeywords API と ImageGetRankedImageFaceTags API を使う

Alchemy API 2

IBM Bluemix AlchemyAPI 1 Alchemy API 2 Free API Key h"p://www.alchemyapi.com/ 3 目的チェック ( 例 )To retrieve meta informa7on in images. 名姓メールアドレス確認メールアドレス挑戦すること 4 Free API Key!! 1000! API API! API =! API