マイクロソフトが提供する Lobe は、画像分析モデル(Classification)を手軽に作成、利用できるアプリです。最低5枚の画像(1タグ付けあたり)からモデルが簡単に作成でき、動画を撮りながらスナップショットで学習画像登録ができる機能などもあります。こちらモデル作成が全部ローカルアプリで完結するのが良いところですね。
さまざまなフォーマット (TensorFlow, ONNX,...) に出力したり、Web やモバイルアプリのテンプレート (React | Swift | Kotlin | Flask) として利用できたりするほか、この度 Power Platform との連携が追加されました。
今回は、Lobe と Power Platform の連携機能を利用して、Lobe で作成したモデルを Power Platform (AI Builder) に Export して、Power Automate | Power App で使って画像分析アプリを作成する手順を紹介します。
開発(?)環境
Lobe (Version 0.10.1130.5)
Mirosoft Edge (バージョン 102.0.1245.33) 64b bit
on Windows 11 Enterprise 21H2
手順
0. 事前準備
Lobe を使って画像分析モデルを作成
Lobe でカスタム画像分析モデルを作成してみよう の手順を参考に、ローカルに Lobe をインストールして、画像分析モデルを作成しておきます。今回は同じ素材で作成した Yoga Pose モデルを利用します。
Lobe 自体のアップデートを忘れずに。(※ Lobeの利用は無料です)
Power Platform ライセンス + AI Builder
今回は Power Platform および AI Builder を使用します。
Plan2 (Microsoft 365 付属のラインセスではなく Power Platform 専用ライセンス) 以上、かつ AI Builder ラインセンス (試用版以上) が必要です。Power Platform は Communicty Licence が、AI Builder も試用版がありますので、無料で試してみることが可能です。
(参考) https://qiita.com/yugoes1021/items/98c8a3504ac72c7fb5be
1. Lobe から AI Builder に ML モデルを Export
Lobe で Export したい Project を開きます。左列メニューから [Use] を選択し、[Power Platform] (の欄にある Configure) をクリックします。
[Sign In] をクリックして、Power Platform へのサインインを行います。クリックするとブラウザーが開きますので、そちらで Power Platform のアカウントでサインインを行います。
サインインが完了すると、Lobe を開くダイアログが表示されますので、[開く] をクリックして Lobe の画面に戻ります。
再び Lobe から、Export するモデル名を入力し、Power Platform 環境 (Environment) を確認して、[Export] をクリックします。
最初に Export するときは Optimize (最適化)するかどうかを聞かれます(の場合があります)。お急ぎの時は [Just Export] (時間があれば Optimize & Export) をクリックすると、Power Platform AI Builder に ML モデルが送信されます。
しばらくモデルの Export 作業が行われ、完了すると Done Exporting と表示されます。
[View Model] をクリックすると、ブラウザーが開いて Export した Power Platform AI Builder の画面を開きます。
Ai Builder の画面で、Export した ML モデルをクリックします。
ML モデルの内容 (ラベルなど) を確認できます。[クリックテスト] をクリックすると、画像をアップロードしてモデルの分析結果をテストできます。
2. ML モデルを利用する Power Automate を設定
Power Platform AI Builder の画面から、[モデルの使用] をクリックして表示されるメニューから [インテリジェントな自動化を構築する] を選択、または Power Automate (https://flow.microsoft.com/) にアクセスし、[+作成] から新規フローの作成画面に進みます。
一から開始(Start from blank) から インスタントクラウドフロー(Instant cloud flow) をクリックします。
フロー名(Flow name) を入力、このフローをトリガーする方法...(Choose how to trigger...) は PowerApps を選択し、[作成(Create)] をクリックします。
Power Automate フローの作成画面が表示されます。
[+新しいステップ(New step)] をクリックして、ステップを追加します。
[組み込み(Build-in)] タブをクリックして、[データ操作(Data Operation)] コネクターをクリックして選択、[作成(Compose)] アクションを選択します。(英語版ですと input で検索できます)
[入力(input)] の欄をクリックすると、動的コンテンツ(Dynamic content) ウインドウが表示されますので、[PowerAppsで確認(Ask in PowerApps)] をクリックして選択します。
[作成_入力(Compose_input)] といった項目が配置されれれば OK です。
[+新しいステップ(New step)] をクリックして、次のステップを追加します。
検索窓に AI Builder と入力して AI Builder コネクターを選択、[Predict] アクションを選択します。
Predict アクションの設定で、Model 欄はドロップダウンボックスから、ご自分で Lobe から Export したモデルを選択します。
Image 欄は再び動的コンテンツを設定します。動的コンテンツ(Dynamic conent) ウインドウで 式(Expression) をクリックします。
入力欄に dataUrlToBinary(replace()) と入力してから、動的なコンテンツ(Dynamic content) タブをクリックして、動的コンテンツである [Output] をクリックして入力します。数式の末尾を修正して dataUrlToBinary(replace([Output],'"',")) という入力に修正します。入力し終わったら [OK] をクリックして完了です。
dataUrlToBinary(value) で value (Power App で取得する画像データのURL) をバイナリーデータとして取得します。その前に replace() を使ってURLを成形 (" を除去) しています。
[+新しいステップ(New Step)] をクリックして、次のステップを追加します。
PowerApps と入力して PowerApps コネクターの PowerApps または Flow に応答する(Respond to PowerApps or Flow) アクションを探し、クリックして選択します。
+出力追加(Add an output) をクリックして、PowerApps への出力を2つ作成していきます。
出力項目の1つ目として、テキスト(Text) をクリックします。
タイトルに Pose と入力し、値の欄をクリックします。
first() と入力した状態で 動的コンテンツ(Dynamic Content) タブをクリックして、[Labels]
をクリックして入力します。first(............) の末尾に ['Label'] と入力して、[OK] をクリックして確定します。
[Labels] で取得できるデータには、各ポーズの判定結果と精度が含まれています。(精度が高い順)
(イメージ)
[ { "Label": "Cobra", "Confidence": "0.90000"}, { "Label": "DownDog", "Confidence": "0.00023"}, ....]
そのため、first() で最初の項目を取得し、Label と Confidence をそれぞれ取り出します。
同様の手順で、もう一つ出力を追加します。
出力項目の2つ目は、タイトルに Confidence と入力、値の欄をクリックします。
first() と入力した状態で 動的コンテンツ(Dynamic Content) タブをクリックして、[Labels]
をクリックして入力します。今度は first(............) の末尾に ['Confidence'] と入力して、[OK] をクリックして確定します。
終了したら、[保存] をクリックしてフローを保存します。
3. Power App を作成、ML モデルを利用 (Power Automate 経由)
Power Platform AI Builder の画面に戻ります。[モデルの使用] をクリックして表示されるメニューから [インテリジェントアプリを構築する] をクリックして選択します。
または Power Apps のトップページ (https://make.powerapps.com/) にアクセスし、[+作成] から新規アプリの作成画面に進みます。
Power Appps の作成画面で、必要なパーツを配置していきます。
Screen1 (初期画面) が表示された状態で、上部メニューから [挿入] をクリックします。
まず、写真をアップロード＆表示するパーツを追加します。挿入 メニューにある [メディア] > [画像の追加] をクリックします。
右のツリービューで、追加された 画像の追加 パーツ (AddMediaWithImage1) をクリックして開きます。
パーツをクリックして画像がアップロードされたときの動作を設定します。
AddMediaWithImage1 を構成している AddMediaButton1 をクリックして選択した状態で、上部バーに表示される [アクション] > [変更時] をクリックします。
プロパティ欄が OnChange になっているのを確認して、アクション メニューにある [Power Automate] をクリックします。
左メニューから Power Automate タブが表示されるので、+フローの追加 をクリックします。
フローの追加 ウインドウから、2.で作成した Power Automate フローを選択します。
左メニュー Power Automate タブに表示されたら OK です。(これで Power Apps からこのフローを使えるようになります。)。左メニューの上から2つ目のアイコンをクリックしてツリービューを再表示しておきます。
AddMediaButton1 の OnChange プロパティ (の状態のまま) での数式欄をクリックして、以下の数式を入力します;
Set(DefineYogaPoseResult,DefineYogaPose.Run(JSON(UploadedImage1.Image,JSONFormat.IncludeBinaryData)));
Set(変数,value): 変数に value を代入
FLOWNAME.Run(input): FLOWNAME (Power Automate フロー)を実行、input をフローに渡す
JSON(データ,形式) → フローに UploadedImage1 の画像(Image) を渡したいので、フォーマットを変換して渡します。
画像をアップロードするパーツを配置できたので、フローで取得した情報を表示するパーツ (ラベルx3) を配置します。
上部バーの [挿入] メニューをクリックして、[ラベル] をクリックします。
Screen1 にラベルが追加されるので、Text プロパティで内容を設定します。
まずはアプリ名 (お好みの名前) を入力します。
右側に表示されるプロパティでフォントやテキストサイズなどなどお好みで変更します。
同様の手順でラベルをもう一つ配置します。Text プロパティで、以下の数式を入力します;
"Pose Name: " & DefineYogaPoseResult.pose
ここでは フローの戻り値(pose, confidence)が DefineYogaPoseResult に取得されているので、それぞれの値を取得できます。"&" を使って文字列を連結します。
同様の手順で3つ目のラベルを配置します。Text プロパティで、以下の数式を入力します;
"Confidence: " & DefineYogaPoseResult.confidence
設定は以上で完了です。設定内容を保存しておきます。
上部メニューの [ファイル] をクリックします。
名前を付けて保存 画面でお好みの名前を付けて保存しておきます。
左メニュバー ← でアプリ編集画面に戻ります。
アプリを試す
Power Apps アプリ編集画面で、右上の ▷ (または F5) をクリックしてアプリを実行します。
アプリ実行画面で、画像の追加パーツをクリックして、画像をアップロードします。
画像がアップロードされると、アプリが稼働して AI Builder モデルによる分析結果が表示されれば完了です。