LINE の AIプロダクト LINE BRAIN の OCR API を試してみた。 Google Vison API との比較付き

# 概要

2019/11/21 、 22日まで行われていた 「LINE DEVELOPER DAY 2019」に参加者限定で LINE BRAIN の OCR 機能が試せる API が先行公開されたのでそれを試してみました。
https://linedevday.linecorp.com/jp/2019/

```:ハッシュタグ
#linedevday
```

LINE BRAIN の OCR 機能に関してはこちらからご覧ください。
https://www.linebrain.ai/ocr/

# 試す

今回は OCR の API と Power Automate(旧 Microsoft Flow) と Power Apps を利用してノーコードでレシート読み取りアプリを作成します。

完成品はこちらです。

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr"><a href="https://twitter.com/hashtag/LINEBRAIN?src=hash&amp;ref_src=twsrc%5Etfw">#LINEBRAIN</a><a href="https://twitter.com/hashtag/powerapps?src=hash&amp;ref_src=twsrc%5Etfw">#powerapps</a> <a href="https://twitter.com/hashtag/PowerAutomate?src=hash&amp;ref_src=twsrc%5Etfw">#PowerAutomate</a><br>LINE BRAIN の API と Power Apps + Power Automate でレシート読み取りアプリを作ってみました。ほとんどドラックアンドドロップで作成しているので非ITエンジニアの方も簡単に作成できます。<br>作り方は後程ブログにする予定です。 <a href="https://t.co/CMsneeSDRl">pic.twitter.com/CMsneeSDRl</a></p>&mdash; たく丸 (@taku_ma_ru) <a href="https://twitter.com/taku_ma_ru/status/1200017322963959808?ref_src=twsrc%5Etfw">November 28, 2019</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

## Power Apps

画面構成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/183354/9f63ae41-644c-1901-a0ec-ac8936933ade.png)

**下のメニューに 「Graph」とありますが、今回は利用していません。**

画面に関してはこんな感じです。
利用している色コードは以下になります。(利用していない色もあります。)

```:App.OnStart
Set(brand,  
{
    primary:RGBA(255, 51, 120,1),
    secondary:RGBA(51, 201, 255,1),
    optional:RGBA(65, 233, 75, 1),
    white:RGBA(252,252,252,1)
})
```

ポイントは JSON 関数を利用して Power Automate に対して画像を base64 の形でアップロードしています。
JSON 関数に関してはこちらをご参照ください。
https://qiita.com/h-nagao/items/83fa46547eece917d496

```:Btn.Onselect

Set(response,'PowerApp->HTTP,変数を初期化する'.Run(JSON(Image2.Image,JSONFormat.IgnoreBinaryData)));
Notify("保存しました");
Reset(AddMediaButton1);
ClearCollect(responseCollection,Split(response.response,"@@"));
Back()

```

## Power Automate

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/183354/a08ad65b-18fc-e8fd-f6c7-a2f762ca7eb4.png)

ポイントとなるのは 「PowerApp または Flow に応答する」で区切り文字込みの OCR した結果の文字列を返しています。一度配列変数に追加し、それを split 関数を利用して分解しています。（ここの処理はいちいち配列に追加せずに、文字列を結合したほうが良いかもしれません。）

Http コネクタに関しては次の LINE BRAIN で解説します。

## LINE BRAIN

今回の核がここになります。
LINE BRAIN には様々なAIサービスがありますが、現時点で公開されているものは OCR サービス機能となります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/183354/778dc25b-214e-456c-0915-2b41852c7b4f.png)

現時点で公開されている API は detection　と recognition の 2 点です。
指定できる画像の種類には URL, base64, 画像ファイルの 3 種が扱えそれぞれ JPEG、JPEG2000及びPNG の 10MB 以下の画像が扱えます。
 
### detection

文字領域の検出のみを行います。
検出した文字は配列として結果が返ってきます。

### recognition 
文字認識または、文字領域の検出が終わっていない画像に関しては detection の後に認識を行います。


### 認識精度

認識精度ですが、Google の Vision API と比較したものがこちらになります。

https://twitter.com/taku_ma_ru/status/1199517909929738240

https://twitter.com/taku_ma_ru/status/1199518291808571392

日本語の認識率は Google よりも高いですが、手書き文字になると少し精度が落ちる印象でした。（2種類の画像でしか検証していないのでもう少し多くの画像の検証は必要です）
ただ、現時点でまだプレビュー版ですので更なる精度アップは期待できると思います。
Google はこちらを利用しました。
https://cloud.google.com/vision/


# まとめ

新しく公開された LINE BRAIN の OCR API を試しましたが、使いやすく、それなりの精度が出る印象です。
LINE さんが今後どのようにこのサービスを展開してくるかを気にしつつ、今後 GA された場合、日本語の OCR サービスとしての1つの選択肢になるのではないでしょうか？

また、API でなくても web 上でデモができる環境がありますのでこちらから手軽にお試しください。
https://ocrdemo.linebrain.ai/

# 参考

- https://ocrdemo.linebrain.ai/
- https://linedevday.linecorp.com/jp/2019/
- https://cloud.google.com/vision/