Power Platformでノンコーディングで筋トレ成果を記録するアプリを作ってみた - 1.AI Builder編 -

# 1.やったこと
iPhoneのアクティビティアプリのスクショを画像認識して、筋トレ結果を抽出、データを格納してダッシュボードで表示する…までを、Power Platformの各種サービスを駆使してノンコーディングでやってみたことのうち、**AI Builder**でやったことのメモです。

1. [Power Platformでノンコーディングで筋トレ成果を記録するアプリを作ってみた - AI Builder編 -](https://qiita.com/miokawa/items/17d84d8811fe38ff4704)←コレ
2. [Power Platformでノンコーディングで筋トレ成果を記録するアプリを作ってみた - Power Apps編 -] (https://qiita.com/miokawa/items/0f3dc6ac6a1be01984d6)
3. [Power Platformでノンコーディングで筋トレ成果を記録するアプリを作ってみた - Common Data Service編 -](https://qiita.com/miokawa/items/da330e778afabf46579d)
4. [Power Platformでノンコーディングで筋トレ成果を記録するアプリを作ってみた - Power Automate編 -](https://qiita.com/miokawa/items/2ca2c75fdb52fcc90e78)
5. [Power Platformでノンコーディングで筋トレ成果を記録するアプリを作ってみた - Power BI編 -](https://qiita.com/miokawa/items/c7afe408e076cb9f7578)

人恋しさと運動不足解消のため、定期的にオンラインフィットネス（Teams繋ぎながらyoutubeのトレーニング動画を流してみんなでやる）を会社の人とやり始めたことがきっかけで作りました。

最終的な成果物はこんな感じ（細かいデザイン方法については触れません）。
<img width="250" alt="サンプルスクショ" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/5369c570-2e83-4f8e-c113-e0be8f557090.jpeg"> <img width="250" alt="サンプルスクショ" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/badb9fb8-1fea-ea0e-387b-f1a46ac248b9.jpeg"> <img width="250" alt="サンプルスクショ" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/ed233619-7794-1379-2ef0-c5e85ac2b356.jpeg">

※試行錯誤した結果、こうしたらできた！って感じなので、これが一番スマートなのかどうかは不明ですのでご注意ください。

# 2.本アプリでのPower Platformの各サービスの役割
- **Power Apps**：iPhoneのアクティビティアプリのスクショをアップロードする。Power BIで筋トレ記録見られる。
- **AI Builder**：アクティビティアプリのスクショに含まれる筋トレ時間、消費カロリー、日付などを画像認識する
- **Power Automate**：Power Appsのアップロードボタンをトリガーに、アップロードされたスクショをAI Builderに投げ、結果のデータをCommon Data Serviceに格納する
- **Common Data Service**：ひたすら筋トレ結果を格納する
- **Power BI**：Common Data Serviceに格納された筋トレ成果たちをそれっぽく表示する

図にすると以下のような感じです。
気づいたら割といろいろ使ってた。わお。

![筋トレアプリ図解.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/17447ad0-bd5a-0f5f-e48a-20bddeeb914e.png)

# 3.開発環境
今回はこちらの無料ライセンスを使いました。
[Power Apps Community Plan](https://powerapps.microsoft.com/ja-jp/communityplan/)


# 4.実現したいこと
iPhoneのアクティビティアプリのワークアウト画面スクショ（以下サンプル）から、以下の情報を抽出するAIを作る。  
<img width="200" alt="サンプルスクショ" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/0c67826c-564d-4424-f62b-eb2d13f0c228.jpeg">

- 曜日（例：木）
- 月（例：12）
- 日（例：17）
- トレーニングカテゴリ（例：フィットネスゲーム）
- 合計時間（例：0:29:24）
- アクティブキロカロリー（例：90KCAL）
- 合計キロカロリー（例：120KCAL）
- 平均心拍数（例：116拍/分）

# 5.作成過程
[Power Apps](https://make.powerapps.com/)にログインし、**AI Builder**から**ビルド**、**フォーム処理**を選択。
画面の指示に従って、AIモデルに名前を付けて作成します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/31762784-6782-a7dd-eb3c-96775315b652.png)

抽出する情報のフィールド（タグみたいなもの）を作成します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/0c787f4a-934d-91f6-e4ca-fc2a163e1b92.png)

AIモデルを作成するにあたり、学習の元になる写真を5枚以上アップロードして、分析します。
ちょっと待機。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/16b795f5-140b-10e2-6c69-0b06c3106cf9.png)

ここで第一の壁。必要なフィールドを満遍なく認識してくれない！
緑の枠が自動で認識されてフィールドを関連付けできる部分だよという意味らしいのですが、以下画像だと日や曜日、トレーニングカテゴリが認識されていません。
<img width="300" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/f650fff5-39b7-a5f4-01ea-1a3693f9f33d.png">

そして画像ごとに認識されている要素もバラバラで、1枚も全てのフィールドをタグ付けられた画像がなかった…。
早くもちょっとめげそうになる。
<img width="300" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/1f4504ce-da14-d318-c8e0-574a0354cc46.png">

他の手法もいろいろ考えたが、結果、画像の方を英語にしたらうまくいきました。
日本語の認識はまだちょっと苦手な模様。
<img width="300" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/f94ec2ad-6881-71f7-8bf5-653e737dd5aa.png">

こんな感じで、全てのフィールドを全ての画像で関連付けしていきます。
<img width="300" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/9f7e6a7b-fdad-0686-7e0c-ad85aa7fbe49.png">

バラバラに認識されているものを、一つのフィールドとして関連付けしたい場合は、ドラッグでエリア選択すればできます。
<img width="300" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/79baef22-409c-ec05-4e5c-47eb8de26697.png">

全てのフィールドへの関連付けが終わると、対象画像にチェックマークがつくので、次の画像の関連付けに移っていきます。
<img width="300" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/8c81f509-d019-76b4-79cd-d48a196eccec.png">

もし認識してくれないフィールドがあったら、該当フィールドの三点リーダみたいなボタンから、**ドキュメントで使用不可**を選ぶと、そのフィールドはスキップ可能です。
但し、全ての画像で特定のフィールドをスキップしてしまうと、該当フィールドは抽出されないことになってしまう（その旨の通知が出る）ので注意！
<img width="300" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/c202c835-1c76-7d6d-ce0a-091c74522b0f.png">

なお、英語にした途端、水を得た魚かのように、自動で関連付けしてくれたりする。AIは既に始まっている…！！
<img width="500" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/8cce6acb-e8bb-59cf-86a8-0b3a73ccb419.png">

こんな感じで全ての画像でフィールドの関連付けをしたら、次へ進めて、モデルのトレーニングができるようになります。
ちょっと待機。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/0f19e7c4-50a3-6320-b9d0-50f09acf4700.png)

トレーニングができたら、詳細ページに移動すると、クイックテストができるのでやってみます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/b1ad5209-fb7e-cbe2-2bca-d339d9709dad.png)

関連付けられたフィールドと、信頼度が見られます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/cddd1bcc-10ee-8741-dfa2-40f2575f59f1.png)

テストがうまくいったら、**公開**→**モデルの使用**→**Power Automate**→**続行**と進め、Power Automateの中で作成したAIモデルを呼び出すステップに移ります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/4b6d989a-ffcc-9dc8-9cf8-4609c1056951.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/df520bc9-d7a5-5b1c-e2ff-c6ac6a783258.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/fde8c242-4bb1-740e-4c05-df066f5afcb3.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596292/453365ec-a1f4-d655-c80c-77cb1235277d.png)

# 6.次のステップ
今回作ったAIモデルを、[Power Platformでノンコーディングで筋トレ成果を記録するアプリを作ってみた - Power Apps編 -](https://qiita.com/miokawa/items/0f3dc6ac6a1be01984d6)で作ったPower Appsから呼び出せるようにします。