AIタグ付けを使用すると、ビジュアルデザインスタジオ(デザイナー)でタグの候補を直接収集、確認、適用できます。AIタグ付けを初めて使用する場合は、まず「AIタグ付けの概要(ベータ版)」で仕組みの概要を確認してください。
重要:AIタグ付けには、Pendoの有料サブスクリプションが必要です。サブスクリプションがPendo Freeプランの場合、手動でのみタグ付けできます。
前提条件
AIタグ付けを使用するには、以下の条件を満たす必要があります。
- 管理者が[設定]>[サブスクリプション設定]>[AIアクセス(]でAIタグ付けを有効にし、[AIタグ付け]チェックボックスがオンになっているサブスクリプションに所属していること。
- アプリケーションにタグを付ける権限があること。AIタグ付けには手動でのタグ付けと同じ権限が適用されるため、管理者に限定されていません。
AIタグ付けにアクセスする
- [プロダクト] > [ページ] > [ページをタグ付け]、または[プロダクト] > [フィーチャー] > [フィーチャーをタグ付け]に移動します。どちらからも、同じAIタグ付け画面が開きます。
- デザイナーでアプリケーションを開くには、[デザイナーを起動]を選択します。
- AIタグ付けがデフォルトで開きます。
[その他のオプション(...)]を選択すると、パネルのレイアウトを[ポップオーバー](デフォルト)、[新しいウィンドウ]、または[全画面表示]に変更したり、利用可能なキーボードショートカットを確認したりできます。AIタグ付けをリセットすると、すでに生成された提案がすべてリセットされます。
ヒント: AIタグ付けとクラシックタグ付けを切り替えるには、パネル上部の[AIタグ付け]ドロップダウンを選択して[クラシックタグ付け]を選択するか、[その他のオプション(...)]を選択して[クラシックモードに切り替え]を選択します。クラシックモードからAIタグ付けに戻るには、[AI拡張タグ付け]を選択します。
タグ付け設定を構成する
デザイナーが開くと、タグ付けを始める前に、推奨されるアクションが2つ表示されます。これらは任意ですが、AIによるタグ付けの提案の品質が向上します。どちらもアプリレベルの設定で、サブスクリプション全体に適用されます。構成オプションの全一覧については、以下の追加設定をご覧ください。
- 命名規則を設定する(管理者のみ)。テキストボックスにチームの命名規則を記述します。これにより、AIタグ付けで、既存の構造や用語に合った候補を生成しやすくなります。手動で付けたタグがすでに多数ある場合は、特にこの設定を先に行うことをお勧めします。この設定はサブスクリプション管理者が管理し、サブスクリプション内のすべてのタグ付けセッションに適用されます。
-
タグルールの設定を変更する(管理者のみ)。これにより、AIタグ付けで、提案された各タグのルールに使用するセレクターを選択する際の順序が設定されます。AIタグ付けでは、リストを上から順に確認し、要素に一致する最初のセレクターを使用します。リストの上位にあるセレクターほど安定性が高く、アプリケーションのコードが変更されても引き続き機能します。下位にあるセレクターほど、アプリケーションの変更によって機能しなくなる可能性が高くなります。Pendoは推奨されるデフォルトの順序を提示しています。セレクターをドラッグして並べ替えるか、AIタグ付けに使用しないセレクターをオフにできます。この設定はサブスクリプション管理者が管理し、サブスクリプション内のすべてのタグ付けセッションに適用されます。
このリストでは、次の2種類のセレクターを区別しています。- 推奨とマークされているものの遡及データがないセレクターは、Pendoサブスクリプションにまだ追加されていないカスタムHTML属性です。これらのいずれかを使用してタグを承認すると、Pendo は自動的にそれをサブスクリプションに追加します。ただし、これらのセレクターは、アプリケーションのコードにその属性がすでに存在する場合にのみデータを収集します。存在しない場合、データは収集されません。詳細については、カスタムHTML属性を参照してください。
- テキストの:contains()や位置の:nth-child()など、非推奨としてマークされているセレクターは、安定した識別子ではなく要素の文言や位置に依存します。文言やレイアウトは頻繁に変更されるため、これらのセレクターに基づいて作成されたルールは壊れやすく、壊れたルールは予告なしにデータ収集を停止する可能性があります。AIタグ付けではデフォルトでこれらがオフになっていますが、より強力なセレクターがない場合はオンにすることができます。AIタグ付けが脆弱なセレクターに頻繁にフォールバックする場合は、開発チームと連携して安定したカスタムHTML属性を追加することが最も効果的な解決策です。詳細については、以下の開発チームと協力してタグ付けを強化するを参照してください。
- アプリケーションが複数の言語でコンテンツを提供している場合は、ロケールごとに表示テキストが変わるため、AIによるタグ付けがテキストコンテンツセレクターに依存しないよう、[ローカライズ対応]を有効にしてください。
- 必要に応じて、[最後の手段]を選択すると、AIタグ付けで、要素の表示テキストやページ上の位置による要素のマッチングにフォールバックできます。これは、より信頼性の高い情報が利用できない場合にのみ適用されます。ページのコンテンツやレイアウトが変更されると、これらのルールが機能しなくなる可能性が高くなるため、この設定はデフォルトでオフになっています。
ページとフィーチャーにタグを付ける
- アプリケーションでタグ付けするページに移動します。
-
モーダルの下部でセッション設定を確認します。これらを編集するには、[調整]を選択して、以下を設定します。
- タグ付け方法。作成、更新、維持はすべてデフォルトで有効になっています。
- サイト全体。アプリ全体に存在するUI要素をタグ付けします。
- 表示されている要素のみ:。非表示または閉じているUI要素にはタグ付けしません。
- 非同期コンテンツを自動スキャン。タグの初回スキャン時には表示されないものの、表示される可能性があるUI要素にタグを付けます。
- [完了]を選択して、セッション設定を保存します。
-
[タグ付けを開始]を選択します。タグ付けの方法のさまざまなオプションが表示されます。以下のいずれかを選択します。
- このページ。このページとこのページ上のフィーチャーにのみタグを付けます。
- 複数のページ。推奨内容を確認する前に、1回のセッションで複数のページを収集します。タグ付けしたいページを閲覧してください。AIタグ付けでは、ページを閲覧する際に各ページのDOMを取得します。完了したら、[停止してAIでタグ付け]を選択して、キャプチャしたすべてのページの提案を一度に生成します。推奨内容の読み込みには時間がかかる場合があります。
- このページ上のコンテナ。UIの領域を選択し、その領域内のフィーチャーにタグを付けます。
- 手動タグ付け。クラシックモードのタグ付けに切り替えます。
- 作成。推奨される新しいページとフィーチャータグです。
- 更新。変更が必要な既存のタグです。 たとえば、説明、プロダクトエリア、ルールを変更できます。
- 維持。これらのタグは壊れているか使用されておらず、タグを適切に管理するために削除が必要な場合があります。
- 既存。アプリに関連付けられているタグのうち、更新する必要のない残りのタグ。
-
タグを展開すると、推奨名、要素タイプ、ルール、説明、プロダクトエリアが表示されます。
表示されるタグ候補は、フィルターを使用するか、検索バーにタグ名を入力して絞り込めます。
-
タグ付けしたいページまたはフィーチャーの横にあるチェックボックスを選択します。 リスト内のすべてを選択するには[すべて選択]を使用し、除外する項目は個別に選択を解除します。サブスクリプションには、[作成]を選択するまで何も確定されません。
[更新]タブでは、[すべて選択]を使用するか、更新するタグを個別に選択することもできます。変更を行う準備ができたら、[更新]を選択します。
- 最初からやり直すには、デザイナーの上部にある[終了 ]を選択してセッションを終了し、タグ付けを再開してください。
- デザイナーで削除に関する推奨事項を確認してください。
- 削除を確定するには、タグを選択し、次に[削除]を選択します。
- アプリレベル:サブスクリプション全体で共有されます。このアプリケーションにタグを付けるすべてのユーザーに変更が影響します。
- ユーザーレベル:ご自身のタグ付けセッションにのみ適用されます。 変更は他のユーザーには影響しません。
- プロダクトエリアの提案(アプリレベル):AIタグ付けにより、タグ付けされたフィーチャーやページのプロダクトエリアが提案されます。デフォルトで有効です。
- サイト全体モード(ユーザーレベル):タグが複数回、または複数のページに繰り返し適用されている場合に、サイト全体に適用すべきタグを提案します。デフォルトで有効です。
-
表示されている要素のみ:デフォルトで非表示になっているUI要素を無視します。
非同期コンテンツの自動スキャン: タグの初回取得後もスキャンを続行します。
方法:タグの作成、更新、または維持のいずれかを選択します。
- ドライラン(ユーザーレベル):常時オン。選択内容を確定するまではタグの作成や変更は行われません。完全な制御は今後のリリースで対応予定です。
- デバッグ(ユーザーレベル):タグ付けの問題のトラブルシューティングに役立つ詳細なログを表示します。デフォルトでは無効です。
AIタグ付けでは、現在のページのDOMを取得し、ページタグとそのフィーチャーに関する提案をデザイナーに表示します。大きなページはチャンク単位で取得されるため、提案の読み込みに時間がかかる場合があります。提案の読み込みには少し時間がかかる場合があります。
推奨タグを確認する
AIタグ付けは、フィーチャータグと並んでページタグも自動的に識別し、提案します。ページを個別にタグ付けする必要はありません。提案は以下の4つのタブに分かれています。
各タブでは、ページタグが最初に表示され、その後にフィーチャーが表示されます。フィーチャータグはテーマに基づいてグループ化され、通常はアプリ内の場所(サイト全体など)やナビゲーションのようなUI要素がテーマとなります。
ヒント:[レイヤー]ボタンを使用して、アプリ内の推奨タグや人気フィーチャーのヒートマップを表示します。
タグが表示されたら、提案内容を確認してください。
タグの提案を承認すると、AIタグ付けによって新しいタグが作成され、サブスクリプションに更新が適用されて、確認メッセージが表示されます。 提案リストが更新され、同じセッション内で他のページのタグ付けを続行できます。
削除対象のタグを確認する
AIによるタグ付けでは、壊れているタグや未使用のタグが削除候補として[維持]タブに表示されます。これらが表示されるのは、AIタグ付けがタグのメンテナンスを基盤としているためです。最近DOMとの一致がないタグを検出すると、そのタグを問題を放置せず確認対象としてフラグ付けします。
タグを削除すると、そのタグはサブスクリプション、およびそれを参照しているすべてのレポートやガイドから削除されます。承認する前に、削除の推奨を慎重に確認してください。
エンジニアリングチームと連携してタグ付けを強化する
AIタグ付けでは、優先順位付けされたルールセットを使用して、推奨される各タグのセレクターを選択します。カスタムHTML属性や要素IDなどの強力なセレクターが見つからない場合、その提案にフラグが付けられます。フラグが付けられた提案も機能しますが、アプリケーションのコードが変更された際に壊れる可能性が高くなります。
修正するには、コードベース内の重要なインタラクティブ要素にpendo-analytics属性を追加します。これにより、AIタグ付けは各要素に対する安定した人間が判読できる紐付け先を得られるため、提案の精度と持続性が向上します。また、好循環も生まれます。AIによるタグ付けがタグの特定と提案を行い、セレクターの精度が不十分な場合は、エンジニアリングチームが改善することで、次のセッションではより良い結果が自動的に得られるようになります。
Pendoはエンジニア向けのAIコーディングスキルを開発しました。これをエンジニアリングチームと共有すると、Claude Codeや他のAIコーディングツールを使ってReactコードベースを監査し、pendo-analytics属性を追加し、1回のセッションで完了できます。
Pendoのアナリティクスのタグ付けスキルをダウンロードする
属性が設定されてデプロイされたら、同じページでAIタグ付けを再実行してください。提案の精度が大幅に向上します。
追加設定
[その他のオプション]>[設定を管理]を選択するといつでも設定パネル全体にアクセスできます。設定は以下のセクションに整理されています。
各設定は、以下の2つのレベルのいずれかに適用されます。
収集
アプリレベルの命名規則
アプリケーション内のページやフィーチャーに、AIタグ付けでどのような名前を付けるかを説明してください。 命名規則は2か所で設定できます。AIタグ付けを初めて開いたときに推奨アクションとして設定する方法(こちらのタグ付けの設定方法を参照)、または随時こちらの[設定を管理]で設定する方法です。どちらも同じ設定を更新します。命名規則は最大1,000文字です。
命名規則を更新しても、既存のタグルールは自動的に変更されません。 AIタグ付けを利用すると、変更を承認する前に既存のタグを確認し、更新を適用できます。
タグ付けのコンテキスト(アプリレベル)
AIが正確にタグ付けできるよう、補足情報を追加してください。たとえば、プロダクト用語、除外する領域、または最も重視する点などです。これは、形式と構造を定める命名規則とは異なります。タグ付けのコンテキストによって、範囲と意図が決まります。
たとえば、管理者向けデバッグバーは無視してください。左側のレールはフィーチャーではなく、ナビゲーションとして扱ってください。
セレクターの設定(アプリレベル)
各タグのルールにセレクターを選択する際に、AIタグ付けが従う順序を設定します。これは2か所で設定できます。初めてAIタグ付けを開いたときの推奨アクション(タグ付け設定の構成を参照)、または随時この設定の管理で設定できます。ドラッグしてセレクターを並べ替え、最も安定した(アプリケーションの変更時に破損する可能性が最も低い)セレクターを先頭に配置します。AIタグ付けはリストを上から順に処理し、要素に一致する最初のセレクターを使用します。AIタグ付けに使用したくないセレクターはオフにします。
リスト上部のテキストフィールドを使用して、カスタムセレクターを追加することもできます。
高度な設定
よくある質問
適用する提案を選択できますか?
はい。各提案の横にあるチェックボックスを使用して、承認または拒否する内容を選択するか、[すべて選択]を使用してすべてを適用します。サブスクリプションへの変更は[選択した項目を承認]を選択するまで確定されません。