【UiPath】セレクターが壊れた時にAIが頑張って要素を見つけてくれるターゲットメソッド「Computer Vision」の正しい使い方

この記事はUiPathブログ発信チャレンジ2024サマーの3日目の記事です。

# はじめに

本ブログで掲載するターゲットメソッド「Computer Vision」とは下図の統合ターゲットで指定できるセカンダリーメソッドのことです。
セレクターが壊れ、実行中にプライマリメソッドであるセレクター（厳密セレクターや曖昧セレクター）で認識できなかった場合、AI搭載エンジンがセレクターを使わずに画面上のUI要素をコンピュータービジョンで認識し、信頼性と回復性を向上させると言ったものです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/639319/72d655a8-0422-e633-df2c-ec7c67bbb410.png)


このComputer Visionはv23.4.xから統合ターゲットに組み込まれ、表舞台の仲間入りになりました。既定のプロジェクトでは、下記の様に、ほとんどが既定でON状態になっているため、なんとなくComputer Visionが効いている風に思っている人もいるのではないでしょうか。
| 対象アプリ | 設定状態 |
|:-----------|:------------:|
|デスクトップ アプリケーション| ON|
|Web ブラウザー| ON|
|Java| ON|
|SAP| OFF|

# 結論
ただし、結論から言うと、

**1.デフォルトのままでは日本語の要素では役に立ちません。**
**2. 設計時の画面指定の画面から、例えば動的に画面デザインが変更されると効きません。**
**3. Computer Visionが重複した要素を認識した状態では効きません。**

そこで、表舞台でありながらも「Computer Visionが使える様になりました！」だけで、それ以上、あまり、言及されることなかったので、ブログに書くことにしました。Computer Visionを効かせるための正しい使い方（と思われる）の説明ですが、公式ドキュメントポータルにも書いてない著者推測も書いてますので、その点はご容赦くださいw


# 前提
1. どうしてもComputer Visionを効かせたい場合の記事です。必ず必要と言った物ではありません。
1. UiPath Studio 2023.10.4、UiPath UIAutomation Activities 23.10.11を利用して解説しています。将来、仕様が変更される可能性はあります。
 


# 正しい使い方

## 1.日本語の要素でComputer Visionを利用する方法
以降、RPA Challengeを使って、解説します。まずは、デフォルトのままで英語サイトと日本語サイトの比較をしてみます。下記は、自動的にアンカーに設定された文字列です。

**＜英語サイトの場合＞**

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/639319/b9a52a2e-a633-fc80-24bd-0e2937ec87fd.png)

**＜日本語サイトの場合＞**
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/639319/9d407544-8f88-963b-1969-65ec4deba252.png)

日本語サイトの場合、 ***#it9,*** って、これでは、ちゃんと認識してくれませんよねw
Computer Visionでは、OCRで取得した文字列も利用しており、既定では埋め込みOCRエンジン、つまりUiPath画面OCRが利用されていますが、埋め込みOCRエンジンでは日本語サポートされていません。 
そこで、「アプリケーション/ブラウザーを使用」アクティビティで、カスタムOCRエンジンを選択してCJK OCRを使う必要があります。まずは、「プロジェクト設定」>「OCR」>「OCR - 日本語、中国語、韓国語」に遷移してEndpointとComputer VisionのAPIキーを設定します。（※プロパティに直接設定しても可）


| 項目 | 設定値もしくは取得場所 |
|:-----------|:------------|
|Endpoint| https://du.uipath.com/cjk-ocr |
|APIキー|Automation Cloud>管理>ライセンス>ロボットとサービス>Computer VisionのAPIキー|

**＜プロジェクト設定＞**
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/639319/1ba572ca-91ee-c301-0aa4-7f6dcaa0f74e.png)

下記の手順で「アプリケーション/ブラウザーを使用」アクティビティでカスタムOCRエンジンを選択して、「OCR - 日本語、中国語、韓国語」（CJK OCR）アクティビティを挿入します。
**＜「アプリケーション/ブラウザーを使用」アクティビティ＞**
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/639319/a2800b40-14a3-3b89-6db5-15331a12452c.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/639319/4926dfc7-9ed0-b83e-c3b7-974b18f9ecb2.png)

設定して要素を指定すると、ちゃんとした文字列で設定できる様になります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/639319/92de82e4-5809-7ac0-68c0-6af97a9211bd.png)

:::note warn
UIAutomation Activities v23.10.11以降を利用しなければエラーになります。2024年4月3日発行のリリースノートに記載されている下記の通り、それまでのバージョンでは機能しません。
> 1. [OCR - 中国語、日本語、韓国語] アクティビティを Computer Vision の API キーで使用した場合、このアクティビティが統合ターゲットでComputer VisionのカスタムOCRとして機能しませんでした。
> 2. プロジェクト名に日本語の文字が含まれていると、[OCR - 中国語、日本語、韓国語] アクティビティが [アプリケーション/ブラウザーを使用]アクティビティでカスタムOCRとして機能しませんでした。

https://docs.uipath.com/ja/activities/other/latest/ui-automation/release-notes-uipath-uiautomation-activities-v23-10

:::

## 2.画面デザインが動的に変更される場合の対処
RPA Challengeの様に入力位置（要素）が動的に変更される場合は、英語サイトで埋め込みOCRエンジンのまま暗黙的に使っていても正しく認識されません。設計時（「アプリケーション/ブラウザーを使用」アクティビティで画面指定時）の画面デザインが、そのまま使われる様に見えます。そこで、画面変更されたタイミングで取り直しを行う様に組み替えて、カスタムOCRの設定で明示的にUiPath画面OCRを入れておきます。尚、日本語サイトの場合も下記の様な組み替えで同様に対処できます。

***＜英語サイト＞***
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/639319/8e76508e-06fe-db85-9872-af5bbd2dd170.png)

## 3.Computer Visionが要素を認識しているか確認する

[検証]して、Computer Visionが機能しているかも確認します。セカンダリーで機能している場合は、チェックマークが表示されます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/639319/376399f5-43ea-ebbb-5b59-18791ee6e14a.png)

[検証]して、重複した要素が見つかり、セカンダリーとしてComputer Visionが機能しない場合は、下記の様な表示となります。この場合、CVテキストを一意のテキストになる様に変更して再度検証することにより、機能される場合もあります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/639319/918702dc-2d38-67fd-45c6-0f3e4145b2b8.png)

:::note info
実行時、統合ターゲットでは、下記、いくつものターゲットメソッドによる認識アプローチと順番で要素を見つけ出そうと試みます。
1. 第1（プライマリ）のターゲットメソッドはセレクターです。厳密セレクターまたは、あいまいセレクターで、そのうち、厳密セレクターが優先されます。
1. 第2（セカンダリ）のターゲット メソッドは Computer Vision です。
1. 第3（ターシャリ）のターゲット メソッドは画像です (既定では無効化されています)。
:::

# セレクター入れずにComputer Visionだけで頑張らせて見た！
セレクターが～！とかは、もう関係ないです。
**＜設定なし設定＞**
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/639319/ea2b6366-cd04-cdf0-c246-5cfdab8d2e7a.png)

<iframe width="560" height="315" src="https://www.youtube.com/embed/-odKeWE5z9c?si=YxSm-IAwW91L4FDr" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

:::note warn
Computer Visionが安定していると言うわけではないので、ご注意を。
あくまでも、セカンダリとして機能し、信頼性と回復力が向上すると言うことです。
:::

# Computer Visionをデフォルトで無効にしたい場合

デフォルトのまま使用し、Computer Visionで日本語の要素が文字化けで設定されている状態は、悪さをしないまでも、適切ではないため、その場合は、Computer Visionはデフォルトで無効にすることをお勧めします。この設定は、プロジェクト設定>UI Automationモダンに、「ターゲットメソッド-デスクトップアプリケーション」、「ターゲットメソッド-Webブラウザー」、「ターゲットメソッド-Java」、「ターゲットメソッド-SAP」それぞれ設定があります。

**＜デフォルトで統合ターゲットのComputer Visionの無効設定＞**
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/639319/346d07d4-dfd3-ec66-c7e4-9cd45f674603.png)

# おわりに
Computer Visionは最近、モバイルオートメーションやStudio Webでも利用可能になってきたテクノロジーです。そして、Computer Visionもそうですが、UiPathの要素認識技術は一般的なUI操作のフレームワークと比べて、かなり先を行ってる感じがします。簡単に表現すると、
**従来から**：現在でも他と比較して安定したセレクターを自動的に取得できる**厳密セレクター**
**2020年**：マシンラーニングのテクノロジー、弾力性を持たせる**曖昧セレクター**の登場
**2023年**：AIが画面上のUI要素をコンピュータービジョンで認識する**Computer Vision**の統合
**2024年**：AIが意味理解、セレクターの課題を排除した**セマンティックアクティビティ**の登場

他のRPAやE2Eテスト自動化経験者ならわかると思いますが、UIの要素認識や安定性に起因する作業は、開発時は勿論、運用時にもコストに大きく跳ね返ってくるので、この性能は、最重要と言っても過言ではないと思ってます。

そして、最後の最後になりますが、先進的なテクノロジーに加えて、やはり基本テクノロジーも大事です。セレクターが正しく取れない、またはワークフローの動作が不安定で、どのように対処すればよいかわからないという問題に直面した時は下記のガイドの活用がお勧めです。良くまとまってます。

https://www.uipath.com/ja/community-blog/knowledge-base/workflow-stabilization