フォトバトラーが AI 技術と SQL でよみがえる！- Google Cloud Vision API

こんにちは普段は DB を触っているテクニカルディレクターの nobuh です。突然ですが

覚えていますかフォトバトラー

2012年12月にリリースされた弊社の iPhone アプリです。出題された「お題」を考えながら撮った写真を選ぶと、SR (スペシャル・レア）R (レア）などのランクとそれに応じた装飾が施されたカードになるというものでした。またそのカードには面白可笑しい文章（フレーバーテキストと言います）も合成されました。

楽しんでくださった多くのファンに惜しまれつつも 2015年12月にサービス終了となりました。

AI といえば画像認識技術

そして話は現在に戻ります。AI 技術、特に Deep Learning の成果は目覚ましいものがあり、碁の名人を打ち破ったなどニュースでも事欠きません。
ゲームのサーバーサイド開発を手掛けることの多い弊社でも、いつでも必要になったときに応用出来るようにと AI 技術のウォッチは続けていました。そして

AI といえばやっぱり画像認識、画像認識を応用してちょっとだけ何か作ってみよう
インフィニットループで画像といえば、、、「フォトバトラー」だよね！
あの面白文（フレーバーテキスト）を AI に選んでもらえると面白いかも？

ということで取り組んでみました。

写真を入れるとキーワードを返してくれる Cloud Vision API

画像認識 API は各社が提供しているのですが、中でも Google Cloud Vision API には画像をアップすると API がどういう結果を返すのかお試しで使えるページがあるのをご存じでしょうか。論より証拠、触って確認出来るのはやっぱり大きいですね！
Google Vision API の Label Detection （物体検知）と呼ばれる機能がそれになります。写真を文章で説明するというより、映っているものの名前を英単語で列挙してくれるというサービスです。キーワードやタグに近い感じのものになります。

(例) イグアナの写真を入れると Iguana, Lizard, Reptile などと返してくれます

立ちはだかる応用の壁、ラベルからフレーバーテキストへ

写真を入れると API が英単語のラベルを返してくれるのは確認出来ました。いよいよフレーバーテキストです。
フォトバトラーのフレーバーテキストでは 風景生き物 といった大きなカテゴリがあり、その下に小カテゴリで分類されていました。一つの小カテゴリに 20 個くらいのフレーバーテキストが用意されています。

アプリの方でお題目としてこの小カテゴリを提示し、ユーザーさんが写真を撮って、あとはその小カテゴリに所属するフレーバーテキストをランダムに選び出す、という仕組みです。
あらかじめ小カテゴリの狙いに沿ったテキストの中から選ばれているので、お題目に合わせて撮ったであろう写真と合成されることで、面白おかしい効果を発揮できました。
一方 VIsion API の物体検知が選定してくるラベルは、Iguana といった 目標物に対しての具体的な（英語の）単語 です。この差をどう埋めるかが課題でした。最初に出てきたアイデアが

機械学習で分類してフレーバーテキストを選択する
ラベルから小カテゴリ、またはラベルから直接フレーバーテキストを紐づけられる辞書を作る

すばやく構築したいということもあり、まずは辞書方式でどこまで出来るかやってみようと考えました。

頼りになる MySQL

辞書といえばデーターベースですよね！何はともあれ MySQL の出番です。とりあえず MySQL にフレーバーテキストをロードしてみようと考えました。フレーバーテキストの列だけを抜き出し、あとでタブ区切り(TSV) でロードしやすいように Google スプレッドシート上でデータを整形します。

これを眺めながら、「まず API の英語ラベルとフォトバトラーの小カテゴリ両方の言語を一致させないと。どっちに合わせよう。カテゴリを英訳するか。」などと考えていたところ閃きました。
「これ、フレーバーテキストをそのまま英訳すれば英語ラベルで上手くマッチング出来るのでは。」
翻訳といえばまたしても Google さんですね！さっそく Google スプレッドシートの関数を探してみると、このために用意されたかのような関数がありました！

これで A1 セルを日英翻訳してくれます。あとはこれをセルに貼り付けていくと・・・出来上がりです！

1000個近い翻訳が一瞬で終わりました！！
英文フレーバーテキストがありますので、そこで全文検索をかければちょうどよいフレーバーを選べるかもしれません。まずはやってみましょう！
テーブル定義がこちらです。前述のシートを TSV 形式で保存し、MySQL にロードしました

 CREATE TABLE `flavor_text` (
  `ja` text,
  `en` text,
  FULLTEXT KEY `en` (`en`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8

先ほどのイグアナの写真のラベルを MySQL で全文検索してみましょう。

SELECT ja
FROM flavor_text
WHERE MATCH (en)
AGAINST ('Iguana Lizard Reptile Vertebrate Scaled Reptile Iguania' IN BOOLEAN MODE)
ORDER BY RAND() LIMIT 1\G
*************************** 1. row ***************************
ja: グラッドシティの召還術師で、属性は炎とツンデレ。「あ、あんたのために喚ぶんじゃないんだからね！」と唱えながら火蜥蜴を召還する。
1 row in set (0.00 sec)

よさそうです！これで基本的な仕組みは手にいれました

デモサイト完成！

中核の技術は手に入れたので、あとは全体設計です。

写真をアップロードして保存するサイト（プラットフォーム）を用意する
写真格納時に API でラベルを取得
ラベルを使って全文検索でフレーバーテキスト決定
レアリティ (R, SR, UR) の飾り装飾決定
写真、装飾、フレーバーテキスト、を合成して完成

写真のプラットフォーム部分はゼロから作らずに既存のオープンソースのものを流用して作成しました。今回採用させて頂いたのは Slim フレームワークを使っている Slim Image Archive です。そしてそれを改造して完成したのがこちらのデモサイトです！！
→　実際のデモサイト photo-battler.infiniteloop.co.jp （ゲストユーザーでの自動ログインのみで写真の削除は出来ませんのでご注意下さい） 2017-03-09 更新：ゲストで写真削除可能になりました 2017-08-22 更新：8/22 にてデモサイトは閉鎖いたしました。

サムネ画像をクリックするとカード画像になります

元々のフォトバトラーは（課金などの変動要素はありますが）基本ランダムにレアリティが決定されていました。今回のリメイク版では API が返してくれるラベルのある特徴に応じて決定するようにひねりを加えてみました！ぜひデモサイトで UR を狙って投稿してみてください！