Top Banner
ドキュメントライブラリに 画像認識機能を追加する アドバンスド・ソリューション株式会社 及川 紘旭 2017年11月3日 Japan SharePoint Group in 東京
19

ドキュメントライブラリに画像認識機能を追加する 20171103

Jan 21, 2018

Download

Technology

Hiroaki Oikawa
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: ドキュメントライブラリに画像認識機能を追加する 20171103

ドキュメントライブラリに画像認識機能を追加する

アドバンスド・ソリューション株式会社

及川 紘旭

2017年11月3日

Japan SharePoint Group in 東京

Page 2: ドキュメントライブラリに画像認識機能を追加する 20171103

目次

はじめに自己紹介

このセッションのゴール

デモの説明今回のデモ 画像認識タグ付け機能

アーキテクチャ

ランニングコスト現時点 (2017/11/3) のランニングコスト

Flow のクォータ

Custom Vision API のクォータ

構築のポイントFlow のポイント

Azure Function のポイント

Custom Vision API のポイント

まとめ

2© SharePoint Developer

sharepoint.orivers.jp

Page 3: ドキュメントライブラリに画像認識機能を追加する 20171103

はじめに セッションの本題に入る前に。

3

Page 4: ドキュメントライブラリに画像認識機能を追加する 20171103

自己紹介

© SharePoint Developersharepoint.orivers.jp 4

及川 紘旭 (おいかわ ひろあき)

Microsoft MVPfor Office Servers and Services 2007年10月~2016年9月

for Office Developer 2016年10月~

アドバンスド・ソリューション株式会社SharePoint 開発担当

ブログ SharePoint Developer(http://sharepoint.orivers.jp)

Twitter @HiroakiOikawa

Qiita https://qiita.com/HiroakiOikawa

Page 5: ドキュメントライブラリに画像認識機能を追加する 20171103

このセッションのゴール

SharePoint Online の機能拡張におけるアーキテクチャの一例を理解する。

© SharePoint Developersharepoint.orivers.jp 5

Page 6: ドキュメントライブラリに画像認識機能を追加する 20171103

デモの説明 今回作るデモをご紹介します。

6

Page 7: ドキュメントライブラリに画像認識機能を追加する 20171103

今回のデモ 画像認識タグ付け機能

ドキュメントライブラリにアップした画像を識別し、自動的にタグ付けする。

© SharePoint Developersharepoint.orivers.jp 7

画像をアップロードすると・・・

キーワードを自動的に更新!

秘スマホに通知!

Page 8: ドキュメントライブラリに画像認識機能を追加する 20171103

アーキテクチャ デモの裏側の仕組みをご紹介します。

8

Page 9: ドキュメントライブラリに画像認識機能を追加する 20171103

アーキテクチャ

© SharePoint Developersharepoint.orivers.jp 9

Flow 画像解析

①画像アップでFlowが起動

②ドキュメントライブラリからバイナリデータ取得

Azure BlobStorage

③バイナリデータをBlobに保存、公開

Azure FunctionGetTag()

Custom VisionAPI

④Function 経由でCustom Vision API呼び出し

④’ 画像解析 AI で画像を識別し、タグを返却

⑤タグをアイテムのキーワードに登録

⑥解析結果をスマホに通知

Page 10: ドキュメントライブラリに画像認識機能を追加する 20171103

ランニングコスト でも、お高いんでしょう?

10

Page 11: ドキュメントライブラリに画像認識機能を追加する 20171103

現時点 (2017/11/3) のランニングコスト

© SharePoint Developersharepoint.orivers.jp 11

Office 365 E3

Flow

Custom Vision API

Azure Function

0円※O365は契約している前提

0円※O365に含まれる

0円※Preview 版のため

0.53円※500Call 辺り

Page 12: ドキュメントライブラリに画像認識機能を追加する 20171103

Flow のクォータ

Office 365 に含まれる Flow にはクォータ制限があります。

クォータ制限を超えて利用する場合は追加コストが発生します。

© SharePoint Developersharepoint.orivers.jp 12

Microsoft 公式情報より抜粋https://japan.flow.microsoft.com/ja-jp/pricing/

Flow の最大実行数は「ユーザー単位の最大実行数 x ユーザー数」で、

テナントの全ユーザーでシェアし、ユーザーごとのクォータはありません。

Page 13: ドキュメントライブラリに画像認識機能を追加する 20171103

Custom Vision API のクォータ

Custom Vision API にはクォータ制限があります。

Preview 版のため、GA後クォータや価格は変更の可能性大です。

© SharePoint Developersharepoint.orivers.jp 13

1 日 1000 Call まで

Page 14: ドキュメントライブラリに画像認識機能を追加する 20171103

構築のポイント 構築時のポイントをハイライトでお届け

14

Page 15: ドキュメントライブラリに画像認識機能を追加する 20171103

Flow のポイント

条件分岐大事

- 無駄を省くためにも条件分岐は入れましょう。

© SharePoint Developersharepoint.orivers.jp 15

Page 16: ドキュメントライブラリに画像認識機能を追加する 20171103

Azure Function のポイント

Flow から Azure Function の呼び出しはひと手間必要

① Azure Function の開発

② API 定義の手直しと、API の公開自動生成された API 定義は、そのままだと Flow で使用するには支障あり。operationId 属性の変更と、parameters 属性の追加。

③ Flow で接続の追加新しい接続の追加ボタンから、②で作成した API を追加し、API Keyを登録して接続。

© SharePoint Developersharepoint.orivers.jp 16

API Key は Azure Function 側で生成し、接続の追加の際にセットする。

Page 17: ドキュメントライブラリに画像認識機能を追加する 20171103

Custom Vision API のポイント

たくさん鍛錬してから公開へ

- とにかくたくさんデータを投入し、精度を高めることが重要。目標は 90%

- 公開は Prediction URL から。使用は JS から。

© SharePoint Developersharepoint.orivers.jp 17

Page 18: ドキュメントライブラリに画像認識機能を追加する 20171103

まとめ 本日のセッションのまとめ。

18

Page 19: ドキュメントライブラリに画像認識機能を追加する 20171103

まとめ

Flow をフル活用

- Flow を使うことであらゆるサービスを連携させることができる。

- Flow そのものは非常に低コスト。

- SharePoint との親和性も高い。

足りない機能のみ補う

- Flow から直接呼び出せない機能や、Flow が備えていない機能は、Azure Function を、API 連携のためのハブとして活用する。

© SharePoint Developersharepoint.orivers.jp 19