IBM Bluemix と AlchemyAPI を使って 画像認識 アプリケーションを作る

IBM Bluemix と
AlchemyAPI を使って
画像認識
アプリケーションを作る
日本アイ・ビー・エム
木村 桂
まずは Free API Key の取得
http://www.alchemyapi.com/
入力項目
目的
名
姓
メールアドレス
確認メールアドレス
挑戦すること
チェック
（例）To retrieve meta information in images.
Free API Key の条件
• 無料
• １日 1000 トランザクション
• API の種類は問わずに合計した値
• 画像関連だけでなく、言語やニュース系 API を使う場合に
も適用
• API を１回実行 = １トランザクション？
• →違います
• API を１回実行した時のトランザクション数は実行結
果に含まれています。
• より複雑な API ほど、トランザクション数が大きくなります
API Key を保管
（申請から５分程度で、このようなメールが届きます）
この文字列を保管しておく
「人工知能」学習の種類
ちなみに IBM では「人工知能(AI)」とは言いません。
「コグニティブ(Cognitive 認識型人工知能）」と言います。
人間型
人間の脳
非人間型
学習モデル
人間の脳ではないもの
先生
上限
無限
人間らしさ
目的
人間を超える
人間の棋譜を使って、人間のように打てるよ
うに学習させる
AlchemyAPI
↑今日はこちら↑
(例)将棋AI
膨大な選択肢から仮説に基いた絞り込みを
行い、最適解を探す
Watson
「画像認識」
何が写っているのか？
Alchemy Vision
誰が写っているのか？
Alchemy Face Detection
結果のフォーマット
各配列要素の中身
○○の可能性がある、
××の可能性がある、
：
（という配列）
識別したもの
その確率
○○人が写っている
１人目の情報
２人目の情報
：
（という配列）
顔の位置、
性別、
その確率、
年齢、
その確率、
個人名、
その確率
これからこんなアプリを作ります。
Alchemy Vision の結果をタグクラウド
指定画像と、
Alchemy Face Detect の結果を表示
この API で使ったトランザクション数
認識対象画像のURLを（パラメータで）指定すると、
その画像を顔認識／物体認識した結果を視覚的に表示する。
AlchemyVision デモサイト
http://www.alchemyapi.com/products/demo/alchemyvision
Alchemy Vision API
画像ファイルのURLから「何が写っているのか」の認識を行う
※パブリックに公開されている URL であること！
具体的には以下のエンドポイントへ Get メソッドでアクセスする：
http://access.alchemyapi.com/calls/url/URLGetRankedImageKeywords
?apikey=（API キー）
&url=（画像URL）
&outputMode=json
&knowledgeGraph=1
URLGetRankedImageKeywords API の実行結果
{
"status": "OK",
"usage": "By accessing AlchemyAPI or …",
"url": "http://xxx.com/wp-content/uploads/2015/05/aaaa.jpg",
"totalTransactions": “4",
この API コールで消費したトランザクションは 4
"imageKeywords": [
結果は imageKeywords の中（配列）
{
“text": “sport",
“sport” の確率が 98.9013% と認識
"score": "0.989013“
},
{
“football” の確率が 98.5226% と認識
“text": “football",
"score": "0.985226“
}
]
}
詳細は API リファレンス参照
http://www.alchemyapi.com/api/image-tagging/urls.html
API リファレンス情報
http://www.alchemyapi.com/api/image-tagging/urls.html
試しにブラウザで実行してみる
ウェブブラウザで以下の URL を指定してアクセスします：
http://access.alchemyapi.com/calls/url/URLGetRankedImageKeywords
?apikey=（API Key の値）
&outputMode=json
&url=画像URL
Alchemy Face Detection デモサイト
http://www.alchemyapi.com/products/demo/face-detection
Alchemy Face Detection API
画像ファイルのURLから「誰が写っているのか」の顔認識を行う
※パブリックに公開されている URL であること！
具体的には以下のエンドポイントへ Get メソッドでアクセスする：
http://access.alchemyapi.com/calls/url/URLGetRankedImageFaceTags
?apikey=（API キー）
&url=（画像URL）
&outputMode=json
&knowledgeGraph=1
URLGetRankedImageFaceTags API の実行結果
{
"status": "OK",
"usage": "By accessing AlchemyAPI or …",
"url": "http://xxx.com/wp-content/uploads/2015/05/aaaa.jpg",
"totalTransactions": "5",
この API コールで消費したトランザクションは 5
"imageFaces": [
結果は imageFaces の中（配列）
{ “age”: { "ageRange": "18-24", "score": "0.702753“ }, age: 推定年齢層と、その確度
"gender": { "gender": "FEMALE", "score": "0.991837“ }, gender: 推定性別と、その確度
"identity": {
"knowledgeGraph": { "typeHierarchy": "/people/ariana grande“ },
"name": "Ariana Grande", 個人が特定できた場合は identity 内に情報が入り、名前とその確度
"score": "0.622459"
},
"positionX": "116",
positionX, positionY: 顔の位置
"positionY": "19",
width, height: 顔のサイズ
“height”: “48”,
"width": "48“ }
]
詳細は API リファレンス参照
}
http://www.alchemyapi.com/api/face-detection/urls.html
API リファレンス情報
http://www.alchemyapi.com/api/face-detection/urls.html
試しにブラウザで実行してみる
ウェブブラウザで以下の URL を指定してアクセスします：
http://access.alchemyapi.com/calls/url/URLGetRankedImageFaceTags
?apikey=（API Key の値）
&outputMode=json
&url=画像URL
これから作成するアプリ（今日のゴール）
認識対象画像のURLを（パラメータで）指定すると、
その画像を顔認識／物体認識した結果を表形式で表示する。
これから作成するアプリ（最終形）
Alchemy Vision の結果をタグクラウド
指定画像と、
Alchemy Face Detect の結果を重ねて表示
（男性＝青枠、女性＝赤枠）
この API で使ったトランザクション数
認識対象画像のURLを（パラメータで）指定すると、
その画像を顔認識／物体認識した結果を視覚的に表示する。
Bluemix にログイン
ログイン後のダッシュボード画面で「アプリの作成」をクリック
WEB アプリを選択
アプリの種類は「WEB」を選択
PHP ランタイムを選択
ランタイムの種類は「PHP」を選択。
※実際はどのランタイムでも作れるが、本資料では PHP で作成する
続行
PHP ランタイムの説明を確認して「続行」。
アプリケーションの名前を指定
PHP ランタイムアプリケーションの名前を指定して入力して「終了」。
ホスト名の一部になるので、重ならない名前にする。
（例） kkimura（自分の名前）-php-YYYYMMDD（日付）
ステージング処理待ち
PHP ランタイムの作成はこれで終わり。ステージング処理が完了するまで待つ。
この画面では、この後にどうやって PHP アプリをランタイムに反映させるか、
の方法が紹介されている。
ステージング処理完了
ステージング処理完了（もうアプリケーションサーバーとして利用可能）。
一度ダッシュボードに戻る。
ダッシュボード画面
ダッシュボード画面に今作った PHP ランタイムが追加されていることを確認。
このアイコンをクリック。
作成した PHP ランタイムの概要
作成して稼働中の PHP ランタイムが表示されていることを確認。
アプリの実装内容
(1) PHP ファイルがパラメータで画像URLを受け取る。
（例 ***.php?url=http://XXXXXXXX/XXX.jpg）
(2) 受け取ったパラメータの値（画像URL）に対して、Alchemy Vision API と Alchemy
Face Detection API をそれぞれ実行する。
(3) 各結果の JSON を解析して、表形式で表示する。
(4) （おまけ）結果表示方法をより視覚的にカスタマイズする。
Bluemixソースコードの開発／デプロイ
• 選択肢は３つ
• Eclipse 環境で開発し、Eclipse プラグインを使ってデプロ
イ
• 普通にテキストエディタで開発し、cf ツールを使ってデ
プロイ
• IDS(IBM DevOps Services) を使って Git リポジトリを作り、
リポジトリのコードを編集した後にビルド＆デプロイ
今回は cf ツールを使った方法を紹介します。
cf コマンドラインツールをダウンロード
https://github.com/cloudfoundry/cli#downloads
の Stable Installers から環境にあったモジュールをダウンロードしてインストール
cf コマンドラインツールの動作確認
コマンドプロンプト（OS X の場合はターミナル）を開き、”cf –v” と入力。
バージョン番号が表示されれば、インストール成功
ドキュメントルート作成
PHP のウェブアプリケーションを作る上での、ドキュメントルートとなる空フォルダを
ローカルマシン内に作成します。
この例では c:¥tmp¥docroot をドキュメントルートとしました。
ドキュメントルートに移動
コマンドプロンプトで、このドキュメントルートのフォルダに移動します。
> cd ¥tmp¥docroot
cf ツールでログイン
cf ツールを使って Bluemix にログインします：
> cf login –a https://api.ng.bluemix.net/
（ユーザー名とパスワードを聞かれるので入力する）
PHP ファイル作成
このドキュメントルートフォルダに PHP ファイルを新規に作成します：
> notepad image.php
image.php の内容(1)
<html>
$trans1 = $json1->totalTransactions;
<head>
$imageKeywords = $json1->imageKeywords;
<title>AlchemyAPI サンプル</title>
if( count( $imageKeywords ) ){
</head>
?>
<body>
<h2>Keywords</h2>
<?php
<table border='1'>
$trans1 = 0;
<tr><th>text</th><th>score</th></tr>
$trans2 = 0;
<?php
if( isset( $_GET['url'] ) ){
for( $i = 0; $i < count( $imageKeywords ); $i ++ ){
$apikey = ‘（Alchemy API Key の値）';
$imageKeyword = $imageKeywords[$i];
API key の値
$url = $_GET['url'];
$text = $imageKeyword->text;
画像 URL を取得
$alchemyurl = 'http://access.alchemyapi.com/calls/url/';
$score = $imageKeyword->score;
?>
?>
<tr><td><?php echo $text; ?></td><td><?php echo $score; ?></td></tr>
<img src='<?php echo $url; ?>'/>
<?php
<p/>
<?php
配列の結果をループで１つずつ取り出す
}
モノ認識 API の URL
$apiurl1 = $alchemyurl . 'URLGetRankedImageKeywords?apikey=' .
$apikey . '&outputMode=json&url=' . urlencode( $url );
$text1 = file_get_contents( $apiurl1 );
$json1 = json_decode( $text1 );
API を実行して、
結果の JSON を取り出す
?>
</table>
<p/>
<?php
}
image.php の内容(2)
$apiurl2 = $alchemyurl . 'URLGetRankedImageFaceTags?apikey=' .
$apikey . '&outputMode=json&knowledgeGraph=1&url=' .
urlencode( $url );
$genderO = $imageFace->gender;
$gender = $genderO->gender;
顔認識 API の URL
$genderScore = $genderO->score;
$text2 = file_get_contents( $apiurl2 );
$json2 = json_decode( $text2 );
API を実行して、
結果の JSON を取り出す
?>
<tr><th colspan='3'><?php echo $i; ?></th></tr>
$trans2 = $json2->totalTransactions;
<tr><td>positionX</td><td><?php echo $positionX; ?></td><td>&nbsp;</td></tr>
$imageFaces = $json2->imageFaces;
<tr><td>positionY</td><td><?php echo $positionY; ?></td><td>&nbsp;</td></tr>
if( count( $imageFaces ) ){
<tr><td>width</td><td><?php echo $width; ?></td><td>&nbsp;</td></tr>
<tr><td>height</td><td><?php echo $height; ?></td><td>&nbsp;</td></tr>
?>
<h2>FaceTags</h2>
<table border='1'>
<tr><th>attr</th><th>value</th><th>score</th></tr>
<?php
配列の結果をループで１つずつ取り出す
<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
for( $i = 0; $i < count( $imageFaces ); $i ++ ){
$identityO = $imageFace->identity;
$imageFace = $imageFaces[$i];
if( $identityO ){
$positionX = $imageFace->positionX;
$name = $identityO->name;
$positionY = $imageFace->positionY;
$nameScore = $identityO->score;
$width = $imageFace->width;
?>
$height = $imageFace->height;
<tr><td>name</td><td><?php echo $name; ?></td><td><?php echo
$nameScore; ?></td></tr>
$ageO = $imageFace->age;
$ageRange = $ageO->ageRange;
$ageScore = $ageO->score;
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>
ソースコード
• 本ハンズオンセミナーのソースコードはこちらからダ
ウンロード可能です：
• https://github.com/dotnsf/alchemyapi_php_sample
• 実際に使う場合は、jQCloud ライブラリと合わせて用
意する必要があります：
• https://github.com/lucaong/jQCloud
上記２サイトからダウンロード＆解凍した結果
の *.php, *.js, *.css ファイルを全て同じ（ドキュ
メントルートの）フォルダに展開します。
PHP ファイルをプッシュ
カレントディレクトリを丸ごと Bluemix 上の PHP サーバーのドキュメントルート
にプッシュ（転送）します：
> cf push （アプリ名）
プッシュ成功を確認
プッシュが成功すると、図のような PHP サーバーの稼働状態が表示されます：
image.php の動作確認
ウェブブラウザで
http://（アプリ名）.mybluemix.net/image.php?url=（画像のURL）
にアクセスして、期待通りに表が出力される結果になることを確認する。
いくつかの画像URLで確認する。
（おまけ）
index.php の
動作確認
ウェブブラウザで
http://（アプリ名）.mybluemix.net/?url=（画像のURL）
にアクセスして、期待通りにタグクラウドと顔認識結果が出力されることを確認する。
いくつかの画像URLで確認する。
（改良に挑戦してほしいこと）
• 人間が写っているとは限らないのに顔認識が実行
されていて、トランザクションが無駄
• 写っているものが人間だった場合のみ、顔認識を実行
する
• 画像がプライベートネットワーク上にあったり、認
証がかかっていて、普通に URL を指定しただけで
はアクセスできない場合を想定
• 画像を一度ダウンロードした上で、そのバイナリデータ
をポストして認識させる、というアルゴリズムに変更
• ImageGetRankedImageKeywords API と
ImageGetRankedImageFaceTags API を使う