e4exp / paper_manager_abstract

0 stars 0 forks source link

UIBert: Learning Generic Multimodal Representations for UI Understanding #606

Open e4exp opened 2 years ago

e4exp commented 2 years ago

スマートデバイスのアクセシビリティを向上させ、その利用を容易にするためには、ユーザーインターフェース(UI)を理解し、ユーザーがタスクを完了するのを支援するモデルを構築することが重要です。 しかし、画像、テキスト、構造的なメタデータを含むマルチモーダルなUIの特徴を効果的に活用する方法や、高品質なラベル付きデータが利用できない場合に良好な性能を達成する方法など、UI特有の特徴に起因するユニークな課題があります。 このような課題に対処するために、我々はUIBertを導入しました。 UIBertは、大規模なラベルなしのUIデータに対する新しい事前学習タスクを通じて学習された、変換器ベースの画像とテキストの共同モデルであり、UIとその構成要素のための一般的な特徴表現を学習します。 UIBertは、大規模なラベルなしのUIデータを用いて事前学習を行い、UIとその構成要素の一般的な特徴表現を学習します。 我々は、UIコンポーネントの異なる特徴間、および同じUI内の様々なコンポーネント間の自己整合性を利用した5つの事前学習タスクを提案する。 UIBertは、マルチモーダルなベースラインを最大で9.26%上回る精度で評価しました。

e4exp commented 2 years ago

image

1 はじめに

多くの人々がスマートデバイスに依存して日々の仕事をこなしている中で、人間が様々なアプリケーションとインタラクトするための有形メディアであるユーザーインターフェース(UI)は、快適なユーザーインタラクション体験を生み出すために重要な役割を果たしています。 近年、デバイスへのアクセス性を向上させ、デバイスの操作を支援するためのUI関連タスクが数多く提案されています。 例えば、[Li et al., 2020b]は、自然言語によるコマンド(例:「次の曲を再生する」)をUIにおける実行可能なアクションに接地する方法を研究し、視覚や状況(例:運転)に障害のあるユーザーがデバイスを音声で操作できるようにしました。 [Huang et al., 2019] は、Talkback1 のようなスクリーン・リーダーに役立つ UI 記述の生成を提案しています。 他のいくつかのタスクは、UIデザイナーがベストデザインプラクティスを学べるようにすることを目的としており、例えば、類似したUIの検索[Huang et al., 2019]やUI要素の検索[He et al., 2020]などがあります。 上記のタスクはすべて、UIの包括的な理解を必要とし、それはユニークな課題を提案する。

1つ目は、クロスモーダルな知識を効果的に活用する方法です。 UIは、画像、自然言語(例:UI上のテキスト)、構造的なメタデータ(例:モバイルアプリのAndroidビュー階層、ウェブページのDocument Object Model)などの異種情報(図1)から構成されています。 特に、メタデータには、ユーザーには見えないUIレイアウトやUI要素の潜在的な機能性に関する豊富な情報が含まれており、しかもノイズに悩まされている[Li et al., 2020b]。 これまでの研究では、タスクを解決するために、通常、画像のみなどのシングルモーダルデータを利用していました[Liu et al., 2018; Chen et al., 2020]。 一般的なUI理解のために、どのようにクロスモーダルな知識を効果的に活用し、ノイズの影響を減少させるかは、依然として未解決の問題である。

第二に、高品質なタスク固有のUIデータは、アプリ/ウェブクローラーの複雑な設定と時間のかかる人間のラベリング作業を必要とするため、実現にはコストがかかり[Li et al., 2020c; Swearngin and Li, 2019]、必然的にモデル開発サイクルを遅らせることになる。 大規模データが利用できない場合、オーバーフィッティングを克服し、満足のいく性能を得ることは容易ではない。

BERT[Devlin et al., 2018]やそのマルチモーダルバリエーション[Su et al., 2019; Li et al., 2020a]のような自己教師付き学習の最近の成功に触発されて、[He et al., 2020]は、さまざまなUI関連タスクに適用できるラベルなしデータからUIの汎用的な特徴表現を構築することを探求しました。 これらの有望な結果は、新たに出現した研究の方向性を開き、十分な探求の余地を残しています。 併行して、我々は、前述の課題を解決するために文脈に応じたUI表現を生成する、新しい変換器ベースのマルチモーダルアプローチUIBert(図2)を提案する。 しかし、Heらがユーザーのアクションによって接続されたUIシーケンス内のUIの時間的な接続性を利用するのとは異なり、我々は単一のUI上の異種機能間の相互接続性を利用します。 具体的には、1つのUI上の異質な特徴は、互いに予測可能であるというのが我々の重要な直感です。 例えば、マルチモーダルな特徴を持つUIを示した図1では、UI上のテキスト(「Healthy hollywood」、「Restaurants for families」)、料理やメニューに関するカルーセル画像、そしてビュー階層のノード2のコンテンツ(「Menu picture」)は、すべて意味的に関連しており、このUIのテーマを示しています。

これに基づいて、様々なUIの特徴の間の整合性を活用するために、5つの新しい事前学習タスクを設計します。 その結果、我々のアプローチは、すべての評価タスクにおいて先行研究よりも優れていることを実験的に示した。 全体として、我々の貢献は以下の通りです。

image

e4exp commented 2 years ago

2 Related Work

UIを理解するために、さまざまな機械学習モデルが提案されています。 例えば、[Li et al., 2020b]はTransformerを活用して、自然言語のコマンドをUIの実行可能なアクションにマッピングした。 また、[Li et al., 2020c; Chen et al., 2020]はTransformerを用いてUI要素のテキスト記述を生成した。 また、デザインマイニングのために類似したUIを検索するために、畳み込みニューラルネットワークを用いる試みもあった[Deka et al., 2017; Liu et al., 2018; Huang et al., 2019]。 過去の研究は一般的にタスクに特化したモデルを構築し、かなりのラベル付きデータを必要とした。

対照的に、我々は様々なタスクに適用可能なUIの一般的な知識を学習することに焦点を当て、大規模な非ラベルデータを活用する。

ActionBert [He et al., 2020] は、私たちに最も関連する研究です。 彼らは、画像とテキストの別々のエンコーダーによって生成されたマルチモーダルな特徴を、よく設計された事前学習タスクを通して取り込むTransformerの学習を提案しました。 主な違いは、彼らがUIシーケンス内のUI間の時間的なつながりを活用して事前トレーニングタスクを設計したのに対し、我々は1つのUI内の異なるマルチモーダル特徴間の自己調整に焦点を当てていることです。 さらに、ActionBertは事前学習中に画像とテキストのエンコーダをフリーズさせますが、私たちはAlbert[Lan et al., 2019]やEfficientNet[Tan and Le, 2019]などの学習可能な軽量エンコーダを使用します。 これにより、エンコーダのパラメータ内にドメイン固有の知識を表現することができます。

e4exp commented 2 years ago

3 背景

本節では、UIBertのモデル入力の1つであるAndroidのビュー階層を紹介し、UIBertがインスピレー ションを受けた元のBERTモデルを要約する。

View hierarchy(ビュー階層)。

ビュー階層は、Android 開発者によって作成された UI 要素のツリー表現である3 。 各ノードには、UIの基本的な構成要素であるUI要素の特定の属性(バウンディングボックスの位置や機能など)が記述されています。 図1の右側に、ビュー階層ツリーの例があります。 Content descriptionとResource-idには、通常はユーザーには見えない機能(ナビゲーションや共有など)に関する有用な情報が含まれることがあります。 Class nameは、開発者によって定義されたAndroid APIの分類的なクラス名であり、Boundsは、画面上の要素のバウンディングボックスの位置を示す。 なお、Class nameとBounds以外のフィールドは空欄でも構いません。 ビュー階層は情報量が多いものの、ノイズが多く[Li et al., 2020b]、異なるビュー階層でも同じ画面レイアウトになることは完全には標準化されていない。 そのため、それだけではUIの全体像を把握するには不十分です。

BERT

BERTはTransformer [Vaswani et al., 2017]ベースの言語表現モデルであり、特別な[CLS]トークンで前置された単語片トークンのシーケンスを入力とする。 BERTは2つの事前学習タスクを定義しています。 マスクされていないトークンからランダムにマスクされたトークンを推論することで単語レベルの埋め込みを学習するMasked language model(MLM)と、2つの入力文が連続しているかどうかを予測することで文レベルの[CLS]埋め込みを学習するnext sentence prediction(NSP)です。 UIBertでは、これらにヒントを得て、MLMを3つの、NSPを2つの新しい事前学習タスクに適応させ、汎用的で文脈に沿ったUI表現を学習します。

e4exp commented 2 years ago

4 事前学習

UIBertの詳細を、マルチモーダルな入力から始まり、アーキテクチャ全体、提案する事前学習タスク、そして最後に事前学習された埋め込みの定性的な評価を紹介する。

4.1 UIBertへの入力

図1に示すように、ビュー階層を持つUI画像が与えられると、まず3種類のUIコンポーネント、すなわち画像(IMG)、OCRテキスト(OCR)、ビュー階層ノード(VH)が得られます。 以下に、それらの定義と、次のサブセクションで使用される、我々が抽出する個々のコンポーネントの特徴を示します。

VHコンポーネント。

VHコンポーネントは,ビュー階層ツリーのリーフノード4である。 各リーフノードについて、セクション3で説明したテキストフィールド(Text、Content description、Resource-id、Class name)の内容を特徴ベクトルにエンコードする。 前処理として、クラス名の内容を22のクラス(例:TEXT VIEW, IMAGE VIEW, CHECK BOX, SWITCH)のいずれかにヒューリスティックに正規化し、リソースIDの内容をアンダースコアとキャメルケースで分割します。 正規化されたクラス名はワンショットエンベッディングとして符号化され、他のフィールドのコンテンツはそれぞれ事前学習されたAlbert [Lan et al., 2019]に投入され、文レベルのエンベッディングが得られる。 得られたすべてのエンベッディングは、VHコンポーネントの最終的なコンポーネント特徴として連結されます。

IMGコンポーネント。

IMGコンポーネントは、VHコンポーネントで示されたバウンディングボックスに基づいて、UIから切り取られた画像パッチです。 EfficientNet [Tan and Le, 2019]を使用し、最後の層を空間平均プーリングに置き換えて、各IMGコンポーネントのコンポーネント特徴量を得ます。

OCRコンポーネント

OCRコンポーネントは、事前に学習されたOCRモデル[MLKit, 2020]によってUI画像上で検出されたテキストであり、ほとんどの場合、VHコンポーネントのコンテンツと補完関係にある。 VHコンポーネントのエンコーディングに使用したのと同じAlbertモデルを使用して、コンポーネントの特徴を生成します。

4.2 UIBertのアーキテクチャ

図2は、当社のモデルの概要を示しています。 UIBertは、1つのUIに含まれる前述のコンポーネント(IMG、VH、OCR)を入力とし、512の隠れユニットと16の自己注意ヘッドを持つ6層のTransformerを使用して、異なるモダリティの特徴を融合します。 BERTに従い、入力を次のように整理します。 CLSはUIレベルの埋め込みを学習することを目的とし、SEPは異なるタイプのUIコンポーネントを分離するために使用されます。 以下では、UIBertのために計算した3種類のエンベッディングについて説明します。

タイプエンベッディング。

様々なタイプの入力コンポーネントを区別するために、6つのタイプトークンを導入します。 IMG、OCR、VH、CLS、SEP、MASKです。 MASKは、次のサブセクションで説明するプレトレーニングに使用される特別なタイプです。 ワンショット・エンコーディングと線形投影を用いて、シーケンスのi番目のコンポーネントのタイプ・エンベッディングTi∈R dを得る。

位置情報の埋め込み。

これは、正規化された左上、右下の点座標、幅、高さ、バウンディング・ボックスの面積からなる。 タイプエンベッディングと同様に、位置特徴をi番目のコンポーネントの位置エンベッディングPi∈R dに投影するために、リニアレイヤーを使用する(CLSとSEPではPi=0)。 コンテンツのエンベッディング type(i)∈{IMG, OCR, VH}のi番目の入力ごとに、抽出されたコンポーネント特徴(Sec.4.1)をコンテンツエンベッディングCi∈R d , に線形投影し、他のタイプの入力には0を使用する。 Transformerへの最終的な入力は、上記の3つのエンベッディングをすべて合計することで構成され、UIBertは、最終的なUIエンベッディングU∈R n×dを以下のように生成します。

image

ここで、T、P、CはR n×dであり、nは配列長である。

4.3 事前学習タスク

5つの新しい事前学習タスクを設計しました。 最初の2つのタスクは、異なるタイプのUIコンポーネント(VHとIMGなど)の間のアラインメントを学習することを目的としています。 これは、アラインメントのない偽のUIを作成し、それらを実際のUIと区別するようにモデルをトレーニングすることで行います。 最後の3つは、BERTのMLMタスクにヒントを得ています。 各UIについて、1つのタイプ(IMG、OCR、VH)を選択し、そのタイプのUIコンポーネントの15%をランダムにマスクし、マスクされていないものからその内容を推測します。 事前学習用のデータセットは、Firebase Robo app crawler [Firebase, 2020]を用いて得られた537k組のUIスクリーンショットとそのビュー階層から構成されています。 Adam [Kingma and Ba, 2014]を用いて,学習率1e5,β1 = 0.9,β2 = 0.999,=1e-7,バッチサイズ128で,16台のTPUで350kステップの学習を行った. 5つのタスクは以下のように定義されています。

タスク1: リアルUI予測(RUI)。

オリジナルのUIAが与えられた場合、そのUIコンポーネントの15%を、同じバッチ内のUIからランダムに選択されたUI-Bのコンポーネントで置き換えることにより、その偽バージョンA'を作成します。 各UIについて、最初は置換するコンポーネントのタイプがランダムに選択されます(IMG、OCR、VH)。 例を図3に示します。UI-Aの2つのIMGコンポーネントをUI-Bの2つのIMGコンポーネントで置き換えて、偽のUI-A'を作ります。 このケースでは、TransformerへのVHとOCRの入力を変更していないことに注意してください。 これは、元のUIと偽のUIの間にわずかな違いしかないことでタスクを難しくしようとしているためです。 RUIタスクは、クロスエントロピー(CE)目的を最小化することで、UIが本物かどうかを予測します。 image

ここで、yはUI xの2値ラベル(xが実在する場合はy=1)、yˆ=Sigmoid(F C(UCLS))は予測確率です。 UCLSはCLSトークンの出力埋め込みに相当し(図2)、F Cは完全連結層である。

image

タスク2:リアルコンポーネント予測(RCP)。

さらに、すべての偽のUIについて、あるUIコンポーネントが他のコンポーネントと一致するかどうかを予測します。 図3のUI-A'では、UI-Bと入れ替わった2つのIMGコンポーネントだけが偽物ですが、すべてのOCRコンポーネントとVHコンポーネント、残りのIMGコンポーネントは本物です。 直感的には、偽物のコンポーネントの内容は他のコンポーネントと一致しないので、モデルは正しい予測をするために文脈から学習する必要があります。 RCPの目的は、偽のUIに含まれる全てのUIコンポーネントの加重クロスエントロピー損失の合計です。

image

ここで yi は i 番目のコンポーネントのラベルであり、yˆi は UI 埋め込み Ui に接続された線形層による予測である。 重みλは、ラベルの不均衡に対処するために、偽のコンポーネントの損失に乗算されます。ここでは、λ=2を用いる。

タスク3:マスクド・イメージ・プレディクション(MIP)。

IMG入力のうち15%をランダムにマスクし、コンテンツの埋め込みを0に、タイプ特徴をMASKに置き換えます。 このタスクは、実際のUIごとに、周囲の入力からマスクされたIMG入力を推論することを目的としています。 マルチモーダル事前学習に関する先行研究でも同様のタスクが設計されているが、その多くは、事前学習されたオブジェクト検出器によって得られたマスクされた画像パッチのオブジェクトクラス(例:木、空、車)[Li et al., 2020a]またはオブジェクト特徴[Su et al., 2019]を予測しようとしている。 しかし、このような方法は、事前に訓練されたオブジェクト検出器の精度に大きく依存しており、汎用的なUIコンポーネントをすべて検出できるようにUIデータで特別に訓練された既存のオブジェクト検出器が存在しないため、我々のケースには適していない。 オリジナルのIMGコンポーネント(ポジティブ)のコンテンツ埋め込みと、同じUIからサンプリングされたいくつかのネガティブなディストラクティブIMGコンポーネントのコンテンツ埋め込みが与えられた場合、マスクされたポジティブの出力埋め込みは、それらのコサイン類似度スコアの観点から、そのコンテンツ埋め込みに最も近いことが期待される。 形式的には、MIMGを実際のUIにおけるマスクされたIMGインデックスのセットとする。 我々は、ソフトマックス版のNoise Contrastive Estimation (NCE) loss [Jozefowicz et al., 2016]を目的として採用する。

image

実際には、画像中のマスクされた成分iに最も近いk個のIMGを負の成分として使用します。

タスク4:マスクドOCR生成(MOG)。

OCR入力をマスキングする際、各OCRコンポーネントが単語のシーケンスであることから、マスキングされたOCRの予測を生成問題としてフレーム化する。 1層GRUデコーダ[Chung et al., 2014]は、マスキングされたOCRコンポーネントのUI埋め込みを入力として、元のOCRテキストを生成する。 我々の目的は強力なUI埋め込みを学習することなので、単純なデコーダを使用する。 全てのシーケンスをゼロから生成するのは難しいので、マスクされたOCRコンポーネントのトークンを15%の確率でマスクする(例えば、図2のOCRコンポーネント「Restaurants for families」では、「Restaurants」のみがマスクされている)。 ti = (ti,1, ... ti,ni ) を WordPiece [Wu et al, 2016] OCRコンポーネントiのトークンをti,j , ∀jとし、生成されたトークンの予測確率をtˆi = GRU(Ui) = (tˆi,1, . . .tˆi,ni )とすると、MOG目的は、マスクされたトークンと生成されたトークンの間の多クラスクロスエントロピー損失の合計としてフレーム化される

image

ここで、MOCRは、マスクされたOCRの(コンポメンントid、トークンid)のペアのセットを表します。

タスク 5: マスクド VH 生成(MVG)。

VHコンポーネントでは、Resource-idは通常2〜3個のトークンしか含まない短いもので、TextフィールドはOCRテキストと重なっています。 そのため、コンテンツの説明とクラス名のみをマスクします。 マスクされたVHコンポーネントに対して、MOGタスクと同じGRUデコーダを用いてコンテンツ記述を生成し、ソフトマックス活性化を用いた完全連結層によってクラス名ラベルを予測します。 形式的には

image

ここで、MVHはマスキングされたVHコンポーネントの集合、ciはVHコンポーネントiのクラス名ラベルのワンショット符号化、cˆi = Softmax(F C(Ui))は予測確率ベクトル、ti,j ,tˆi,jはOCRトークンと同じ定義に従ったオリジナルおよび予測されたDeepL コンテンツトークンを表す。 実際には、UIコンポーネントのDeepL コンテンツは、視覚障害者のためのヒントを提供するために、スクリーンリーディングツールによって使用することができます。 しかし、先行研究によると、66%以上のボタンがコンテンツを欠いています[Chen et al., 2020]。 MVGタスクで事前学習したUIBertは、意味のある説明文を生成することができ、スクリーンリーダーを支援する大きな可能性があることを4.4節で示す。 全体として、UIの事前学習の損失目的は

image

ここで、1{.}は指標関数です。

4.4 定性的評価

我々の事前学習タスクの有効性を検証するために、事前学習されたUIBertのUIエンベッディングを視覚化し、微調整なしで生成されたDeepL のコンテンツを紹介します。

埋め込みの視覚化。

我々はt-SNE[Maaten and Hinton, 2008]を使用して、9.7kのモバイルアプリでクロールされたビュー階層を持つ72kのユニークなUIスクリーンショットを含むパブリックモバイルデザインデータセットであるRico[Deka et al., 2017]のトップ5の共通アプリタイプに属するUIのUCLSとトップ5の共通アイコンタイプのUIコンポーネントのエンベッディングを可視化します。

同じアプリタイプやアイコンタイプのエンベッディングがグループ化されていることが観察され、UIBertが意味のあるUIレベルやコンポーネントレベルの特徴を捉えていることが示唆されています。

コンテンツ記述の生成。

公開されているRicoSCAデータセット[Li et al., 2020b]内の同期されたUIのコンテンツを生成します(詳細は項5.4)。 入力に含まれる のコンテンツをすべてマスクし、MVGタスクと同じ設定で生成した。 図5の例に示すように、生成された説明文のほとんどは正しいものである。 いくつかは間違っているが妥当である(ケース5)。 全体として、生成されたコンテンツの70%がグランドトゥルースと同じである。 image

e4exp commented 2 years ago

5 ダウンストリーム・タスク

UIBertは、様々なUI理解タスクに適用できる汎用的なコンテキストUI表現を学習するように設計されているため、ダウンストリーム・タスクでのパフォーマンスを評価する実験も行っています。 2つのゼロショットタスクを含む、5つのカテゴリから9つの実用的なダウンストリームタスクを選択します。 我々の微調整アプローチは、最小限のタスク固有のパラメータを導入し、すべてのパラメータをエンドツーエンドで微調整します。 各ファインチューニングタスクに対して、ドロップアウト率0.1で200kステップのモデルトレーニングを行い、事前トレーニングと同じオプティマイザ設定とバッチサイズを使用した。 以下では、まず比較対象となるベースラインについて説明し、次に各ダウンストリーム・タスクの定義、データセット、実験設定、結果などの詳細を説明します。

5.1 ベースライン

下流のタスクのために、2つのベースライン符号化メカニズムを検討する。 ひとつはEfficientNet+Albert、もうひとつはActionBertです。 最初のものは、EfficientNet-B0[Tan and Le, 2019]とAlbert[Lan et al., 2019]を用いて、UIの画像成分とテキスト成分を別々にエンコードする。 そして、得られた埋め込みを連結し、下流のタスクのためにUIBertで使用したのと同じ予測ヘッドに供給します。 2つのモダリティ間での注意はないため、UIBertで使用されているTransformerブロックのアブレーション評価として機能し、このクロスモダリティの注意を促進します。 2つ目のベースラインであるActionBert [He et al., 2020] 5 は、最近提案されたUI表現モデルであり、ユーザーインタラクションのトレースを用いて事前に学習されています。

5.2 類似UIコンポーネント検索

このタスクでは、クエリとしてアンカーコンポーネントを持つアンカーUIと、候補コンポーネントのセットを持つseacrh UIが与えられた場合、機能の観点からアンカーコンポーネントに最も近い候補を選択することが目標となる(図6(a))。 このタスクのモデルは、UIデザイナーが最良の設計手法を見つけるのに役立ちます。 例えば、新しいUIを作成する際に、デザイナーはUIデータベースから類似したコンポーネントを検索することで、任意のコンポーネントを改良することができます。 このタスクのための1つのデータセットは、モバイルアプリのUIのデータベースとして機能するRico [Deka et al.、2017]から拡張されています。 このデータセットは、クラウドソーシングとプログラムルールによってアノテーションされた1M個のアンカー検索UIコンポーネントペアからなる。 トレーニングには900kペア、開発には32kペア、テストには32kペアを使用します。 各検索UIには平均して10個のコンポーネント候補があり、その中からモデルが選択します。 このタスクの別のデータセットには、65kのアンカー検索ウェブUIのペアがあります。 各検索ウェブUIには、平均して35個のコンポーネントがあります。 Web UIではビュー階層が利用できないため、微調整中のUIBertにはVHコンポーネントの入力がないことに注意してください。 UIBertをこのタスクに適応させるために、アンカーUIと検索UIを別々にUIBertに入力し、出力されたエンベッディングを取得します。 そして、アンカーコンポーネントのエンベッディングと候補コンポーネントのエンベッディングの間のドットプロダクトを類似性スコアとして使用し、アンカーに最も類似した候補を選択します。 UIBertは、類似性スコアに対するマルチクラスクロスエントロピー損失を用いて微調整します。 モデルのパラメータを追加する必要がないため、事前に学習されたモデルを直接使用することで、ゼロショット方式でタスクを評価することもできる。 EfficientNet+Albertのベースラインを適応させるために、Albertに供給されるテキスト特徴として、各アンカーと検索コンポーネントのOCRテキストを使用しています。 4つのタスクバリエーションにおける全手法の予測精度をTab. 1.

UIBertは、すべてのケースにおいて、0.85%~9.26%の差でベースラインの両方を上回っており、特にゼロショットタスクでは大きな差をつけていることがわかります。

image

image

5.3 参照表現コンポーネント検索

参照表現とUI画像が与えられた場合、このタスクの目的は、画面上で検出されたUIコンポーネントの集合から、表現が参照するコンポーネントを検索することである(図6(b))。 このタスクは、音声制御システムで実用化されている[Wichers et al.] このタスクのデータセットは、RicoのUIもベースにしています。 言及表現はクラウドソーシングで収集しています。 平均して、モデルは各表現に対して20個のUIコンポーネント候補から選択することが求められます。 訓練セット、開発セット、テストセットには、それぞれ16.9k、2.1k、1.8kのUIコンポーネントとその参照表現が含まれています。 UIBertをこのタスクに適用するために、参照表現をOCRコンポーネント、UIコンポーネント候補をUIBertが入力とするIMGコンポーネントとして扱います。 表現の出力エンベッディングと候補コンポーネントの出力エンベッディングのドット積を、それらの類似性スコアとして計算し、参照候補を選択する。 予測結果をTab. 2.

UIBertは最高の精度90.81%を達成し,ActionBertを2.43%上回っている.

5.4 Image-VH Sync Prediction

View hierarchiesは、スクリーンショットと同期していない場合、ノイズが発生する可能性があります([Li et al. このタスクは、UI画面とそのVHを入力とし、VHが画面と一致するかどうかを出力します。 このタスクは、問題のあるUIをフィルタリングするための重要な前処理ステップとして機能します。 我々は、25kの同期されたUIと47kの同期されていないUIを持つRicoSCA([Li et al., 2020b])を使用し、8:1:1の比率で訓練セット、開発セット、テストセットに分割します。 CLSコンポーネントのUIエンベディングに続いて、1層のプロジェクションを用いて、UIの画像とビュー階層が同期しているかどうかを予測します。 Tab. 表2は、UIBertがベースラインを上回り、79.07%の精度と77.06%のmacro-F1を達成したことを示しています。

5.5 アプリタイプの分類

このタスクは、UIのアプリのタイプ(音楽、金融など)を予測することを目的としています。 合計27種類のアプリタイプの中からRicoの72kのユニークなUIをすべて使用し、8:1:1の比率で訓練、開発、テストに分けます。 このタスクは、不正なアプリタイプを持つ悪意のあるアプリをフィルタリングするのに役立ちます。 また、このタスクでは、1層の投影層を使って、UIBertの埋め込みをアプリの種類の1つに投影しています。 CLSコンポーネントの出力と、すべてのUIコンポーネントのエンベッディングを連結したものを使って実験を行いました。 予備実験の結果、後者の方が良い結果が得られることが分かりました。表2に示すように 表2に示すように、UIBertは、EfficientNet+Albertのベースラインよりも、精度で4.50%、MacroF1で4.72%上回っており、Transformerブロックの注目メカニズムと事前トレーニングから得られる利益を示しています。

5.6 アイコンの分類

このタスクは、スクリーンリーダーのようなアプリケーションに有用なアイコンの種類(メニュー、戻る、検索など)を識別することを目的としています。 ここでは,VHのリーフノードごとに人間がラベル付けしたアイコンの種類を,32クラスと77クラスの2つの粒度で表現したリコのデータを用いる[He et al.] アイコンのコンポーネントのタイプを予測するために、アイコンの対応するIMGコンポーネントとVHコンポーネントのUIエンベッディングを連結し、それらを完全連結レイヤーに供給する。 Tab. Tab.3に示すように、UIBertは精度とF1スコアの両方で一貫してベースラインを上回っています。

image

image