Configure Insights UI Tracking

Overview

AppNavi Insights records how users interact with an application. You can configure tracking at application level and define which areas and individual elements should be included or excluded.

The configuration has two main sections:

• Basic Configuration: Controls application-wide tracking options, including page, activity, table, form, and navigation tracking.
• Tracking Configuration: Defines the application areas and individual elements that AppNavi should identify and track.

This guide explains how to configure Insights, test the tracking setup, and handle common configuration scenarios.

Use the related guides for more detailed examples of table tracking, privacy exclusions, and troubleshooting.

Before you begin

Make sure you have:

• Access to the AppNavi Portal.
• An application with an Insights contract assigned.
• Permission to edit the application's Insights settings.
• Access to the target application so you can identify the areas and elements you want to track.
• An understanding of which user interactions you need to analyze.

Important: An application must have an Insights contract assigned before you can configure Insights through the Portal.

Also, if you establish a reference between a Portal application and its JSON configuration while Insights is active, the source documentation states that recording will be limited to non-logged-in users. Review this behavior before configuring an application where logged-in user activity is required.

1. Open the Insights configuration

1. Sign in to the AppNavi Portal.
2. Open the Insights tab.
3. Select the application you want to configure.
4. Open Settings on the Insights Edit page.
5. Review the Basic Configuration and Tracking Configuration sections.

Expected result: The application's Insights configuration is available for editing.

2. Configure application-wide tracking

Basic Configuration controls the tracking capabilities available across the application.

You can enable or disable each option using its corresponding toggle.

Available settings

Understand the relationship between Insights and Recording

These settings have different purposes:

• Insights displays the configured areas and trackable elements with their selected borders.
• Recording controls whether Insights events are recorded.
• The other tracking options determine which types of activity can be captured.

If Recording is disabled, the enabled tracking options will stop recording events as well.

Choose the tracking options you need

For example:

• Enable Page Tracking to analyze page usage.
• Enable Page Activity Tracking to capture page activity duration.
• Enable Form Tracking to analyze interactions with forms.
• Enable Navigation Tracking to analyze navigation usage.
• Enable Table Tracking to capture table activity automatically.

You do not need to enable every option for every application. Choose the capabilities that support your reporting requirements.

3. Configure tracking areas

An area represents a specific section of an application where interactions can be recorded.

Examples include:

• Main navigation bar
• Search panel
• Employee information form
• Application dashboard
• Data table
• Sidebar

You can create multiple areas within an application's Tracking Configuration.

Add an area

1. Open Tracking Configuration.
2. Add a new area.
3. Enter a descriptive Area Title.
4. Configure the CSS Selector that identifies the section.
5. Choose a border color to make the area easier to identify during debugging.
6. Configure the remaining options according to your requirements.
7. Save the configuration.

Area settings

Choose a suitable CSS Selector

A CSS Selector identifies the section of the application that you want AppNavi to track.

For example, if you want to track the main navigation bar, configure a selector that identifies that navigation section rather than selecting the entire page.

When choosing a selector:

1. Identify the section in the target application.
2. Inspect its HTML structure or use the browser's developer tools to identify a suitable selector.
3. Prefer a selector that uniquely identifies the intended section.
4. Check whether the selector matches the correct section on all relevant pages.
5. Verify the result using Debug Mode.

Avoid selectors that match multiple unrelated sections. Also consider whether the application's CSS classes or element identifiers are likely to change after application updates.

Restrict an area by URL

Enable URL Filter when an area should be identified only on specific application URLs.

For example, a search panel might appear on several pages, but you may want to track it only on the reporting page.

Configure the URL Filter for the intended page and verify that:

• The area is identified on a matching URL.
• The area is not identified on a URL that does not match the filter.

Configure Text Extraction Type

Text Extraction Type determines how AppNavi obtains the title of an area.

Choose the method that provides a meaningful and consistent title for the area.

For example, use Static Text when you want an area to have a fixed label such as Employee Search, regardless of the text displayed inside it.

Configure Auto Detection

When Auto Detection is enabled, AppNavi automatically identifies trackable elements within the configured area.

Use this option when you want to track multiple elements without adding each one separately.

If you need precise control over individual elements, configure them separately instead.

Expected result: The area is configured with a recognizable title, an appropriate selector, and the required tracking behavior.

4. Configure individual trackable elements

A trackable element is an individual element within an area that you want to identify and track separately.

Examples include:

• Search button
• Submit button
• Navigation tab
• Form input
• Action button
• Link

Add a trackable element

1. Open the area where you want to configure the element.
2. Add a trackable element.
3. Enter a descriptive Trackable Element Title.
4. Configure its CSS Selector.
5. Choose a border color.
6. Select the appropriate Text Extraction Type.
7. Enable or disable the element as required.
8. Save the configuration.

Trackable element settings

Text Extraction Type supports the same four options as area configuration: Auto, Selector, Static Text, and URL.

Use meaningful element titles

Use titles that describe the element's purpose rather than generic labels.

For example:

Meaningful titles make the configuration easier to maintain and help users understand the resulting Insights data.

5. Configure Target Audience

Target Audience allows you to restrict tracking to users who meet specific audience conditions.

You can configure it at two levels:

• Basic Configuration: Applies a global audience condition to all areas.
• Area Configuration: Applies an additional audience condition to an individual area.

The global condition is evaluated first. If it is satisfied, AppNavi then checks the audience condition configured for the area.

Tracking runs for that area only when both applicable conditions are satisfied.

For example, suppose the global audience includes all employees, while a particular area is restricted to Finance employees. That area will only be tracked for users who satisfy both conditions.

If an area has no separate audience condition, it follows the global audience configuration.

6. Configure Journey View aggregation

Journey View helps you understand the sequence of areas users interact with while completing a workflow.

You can control whether an area is included in Journey View and how its data is grouped. These settings affect Journey View only and do not change how other Insights dashboards or tables aggregate data.

Consider in Journey

This setting determines whether the configured area appears in the user's journey.

• Enabled: The area is included in Journey View. This is the default setting.
• Disabled: The area is excluded and treated as if it does not exist in the journey.

When to disable it: Disable this option when an area should not be considered part of the workflow you want to analyze.

Data Aggregation Type

Choose how AppNavi identifies and groups the area in Journey View.

Example: If you want Journey View to distinguish areas using both their identifiers and displayed labels, select ID and Label.

Expected result: Journey View includes only the areas you have selected and groups their data according to the chosen aggregation type.

7. Configure individual trackable elements

A trackable element is an individual UI component within an area that you want to monitor, such as a button, input field, link, or navigation item.

Use individual elements when you need more control over what is tracked instead of relying entirely on Auto Detection.

Add a trackable element

1. Open the area where you want to configure the element.
2. Add a trackable element.
3. Enter a descriptive title.
4. Specify the CSS Selector that identifies the element.
5. Choose a border color to identify it during debugging.
6. Select the required Text Extraction Type.
7. Configure its activation and exclusion settings.
8. Save the configuration.

Trackable element settings

Choose a Text Extraction Type

The following options are available:

Choose the method that provides a clear and consistent label for the element.

Example: For a button that displays different text depending on the page, you can use Static Text to give it a consistent label such as Submit Request.

Use descriptive titles

Use names that explain the purpose of each element.

Expected result: The element is configured under the correct area and can be identified separately during tracking and debugging.

8. Verify the configuration using Debug Mode

After configuring Insights, verify that AppNavi identifies the intended areas and elements in the target application.

Prerequisite

The Use Behavior Mining option must be enabled in the Portal configuration for the application. Otherwise, the UBM settings and tracking borders will not appear on the Avatar side.

Enable Debug Mode

1. Open the target application.
2. Log in through the Avatar side.
3. Open the Avatar settings.
4. Navigate to UBM settings.
5. Enable Debug Mode.
6. Navigate to a page containing your configured areas.

When Debug Mode is enabled:

• Configured areas are highlighted using their selected border colors.
• Configured trackable elements are highlighted using their selected border colors.
• Mining events can be displayed in the browser console when global Debug Mode is enabled.

Inspect an area or element

To view the configuration details:

1. Keep Debug Mode enabled.
2. Locate the area or element you want to inspect.
3. Hold Shift and hover over it.
4. Review the displayed details.

This helps you confirm that the correct selector and configuration are being applied.

Disable Debug Mode after testing

When Debug Mode is enabled, clicking on highlighted elements may not perform their normal application actions.

Disable Debug Mode when you have finished testing so that you can use the application normally.

Expected result: The configured areas and elements are highlighted correctly, and the tracking configuration behaves as expected.

9. Understand special tracking behavior

Some application components behave differently depending on how automatic tracking and UI configuration are combined. Review these scenarios before configuring complex pages.

9.1 UI configuration overrides automatic tracking

When automatic tracking is enabled for tables, forms, or navigation, you can use UI configuration to control specific areas.

For example, suppose automatic navigation tracking is enabled across the application, but you do not want to track the sidebar.

1. Create an area for the sidebar.
2. Configure its CSS Selector.
3. Disable the area or exclude it from mining.
4. Save and test the configuration.

The sidebar will not be tracked according to the configured override, while other automatically tracked navigation areas can continue to be tracked.

You can also configure a specific area to be tracked with its own settings.

Use this approach when: You want automatic tracking across the application but need to control individual sections.

9.2 Individual element configuration inside tables

Tables have special tracking behavior. Configuring an individual trackable element inside a table does not necessarily override the table's tracking behavior.

For example, if you configure a table as an area and add a separate trackable element for one of its buttons, AppNavi may prioritize the table's own detection behavior rather than displaying the button as a separate trackable element.

Use the table-specific configurations described in Section 10 to choose the expected behavior.

9.3 Individual element tracking for forms and navigation

Unlike tables, forms and navigation elements support individual element configuration.

For example, suppose you want to track a form but exclude one input field and a navigation bar but exclude one navigation item.

1. Enable the required Form Tracking and Navigation Tracking options.
2. Configure the relevant form and navigation areas.
3. Add the individual elements you want to control.
4. Disable or exclude the elements that should not be tracked.
5. Save and verify the result.

The individual element configuration is applied to the relevant form and navigation elements.

Use this approach when: You want to track a form or navigation section but need to exclude specific fields or items.

9.4 Tracking nested areas

When two areas are nested, AppNavi identifies and monitors only one of them at a time.

For example, suppose:

• Area 1 is a parent section.
• Area 2 is a section inside Area 1.

If both are configured, Area 1 is identified and tracked, while Area 2 is not identified separately.

If you deactivate Area 1, AppNavi can then identify and track Area 2.

Important: Do not expect nested areas to be tracked independently. Test the configuration to confirm which area is identified.

9.5 Track a container that contains a table

You can configure a container around a table as an area instead of configuring the table itself as the area.

When Auto Detection is enabled for the container, AppNavi identifies clickable elements inside the table.

When only the relevant automatic table-tracking option is enabled, the table can be detected even if it does not contain clickable elements.

Choose the configuration based on whether you want to identify the table itself or its individual clickable elements.

10. Configure table tracking

Table tracking depends on the CSS Selector you use and whether Auto Detection or individual trackable elements are configured.

There are two common approaches:

• Configure the table itself as the area.
• Configure a container that contains the table as the area.

10.1 Configure the table as an area

Example: If you want to track only the Edit button inside a table, configure the table as an area and add the Edit button as an individual trackable element.

If you enable Auto Detection instead, AppNavi identifies the trackable elements within the table automatically.

10.2 Configure a container as an area

Example: If a dashboard section contains a table and other controls, configure the dashboard section as the area and use Auto Detection to identify its trackable elements.

10.3 Enable Table Tracking from Basic Configuration

When Table Tracking is enabled in Basic Configuration, AppNavi identifies the entire table as a single element.

This differs from configuring the table as an area with Auto Detection, which can identify individual trackable elements inside it.

Important: Table performance

When Auto Detection identifies individual elements in a large table, it can affect application performance.

The Portal displays a warning when individual element tracking in large tables may cause performance bottlenecks.

Before enabling Auto Detection for a large table:

• Review the number of rows and interactive elements.
• Consider whether individual element tracking is necessary.
• Test the configuration in the target application.
• Reduce the tracking scope if performance is affected.

Expected result: The table or its container is configured according to the level of tracking detail you need.

11. Privacy and password-field exclusions

AppNavi does not perform mining on password fields, even when they are explicitly configured as trackable elements.

When a password field is encountered:

• The field is excluded from mining.
• Its tracking border is hidden.
• Its description dialog is hidden.
• A console message informs authorized users that password fields were excluded from tracking.

This behavior applies automatically and does not require a separate exclusion setting.

For other sensitive application areas or elements, use the Exclude setting in the area or trackable element configuration.

Before enabling tracking, review forms and pages that may contain personal, confidential, or sensitive information. Configure exclusions where appropriate and verify the result.

Important: Password-field protection does not automatically exclude other fields in the same form. Review those elements separately.

EXAMPLE CASES FOR TRACKING

We have outlined several scenarios to provide customers with a clear understanding:

• UI configuration Overrides for Automatic Tracking by disabling its toggle, specific elements can be disabled while the rest remain tracked.
• Table Element Tracking Exception: Individual elements within a table cannot be tracked if they are added as auto-detect trackable elements or by enabling automatic tracking table.
• Individual Element Tracking for Forms and Navigation.
• Tracking in Nested Areas.
• UI Configuration for a DIV that contains a table.
• In this case, a table is defined as an area, and the user defines separate trackable elements.

CASE 1: UI configuration OVERRIDES AUTOMATIC TRACKING

In this scenario, when automatic tracking is enabled for all three types and users specify selectors for individual tables, forms, and navigation elements, the configuration takes precedence. For instance, if the configuration designates a particular table, form, or navigation element as disabled, tracking for that specific table, form, or navigation will cease. Alternatively, if distinct properties are outlined in the configuration with selectors for specific tables, forms, or navigation elements, these specified details will be displayed during tracking.

EXAMPLE:

DISABLE CASE:

In the configuration, a designated "Side bar" will not undergo tracking, as indicated in the configuration for that specific area. This is due to the property being disable for the said area, effectively excluding it from tracking.
In contrast, tracking functionality remains operational for other areas. A visual comparison highlighting these distinctions is available in the attached images.

ENABLE CASE:

In the following configuration, the "side bar" is tracked, which is mentioned in the configuration for the specific area.

Note: Here, the mentioned configuration that overrides the automatic tracking because the tracking is enabled for areas mentioned.

CASE 2: Trackable element override the Auto Detection

UI configuration for tracking or untracking individual table elements will not affect detection specifically within the context of tables.

Example:

In the provided illustration, Configuration has been applied to a table, and a distinct trackable element has been defined independently. However, the trackable element associated with the designated table will not be presented separately. This outcome arises due to the prioritization of the table's unique characteristics.

CASE 3: Individual element tracking for forms and navigation

If we configure area to track form and navigation elements individually, the system will follow the set configuration to monitor specified elements within forms and navigation.

Example :

In the given example, we've configured forms and navigation, allowing the disabling of chosen form fields and navigation tabs. Consequently, contrary of a table case, it will utilize configuration for specific form and navigation, deactivating selected trackable elements within those particular forms and navigation instances.

Here we can disable input fields of "form" and Knowledge Base button of "navigation bar".

CASE 4: Nested Area tracking

When two nested areas are defined within UBM configuration, only one of these areas will be identified and monitored.

Example :

Consider the scenario below: "Area 1" will be identified and tracked, whereas "Area 2" will neither be identified nor subjected to tracking.

DISABLING AREA 1 :

If "Area 1" is deactivated, "Area 2" will subsequently be detected and presented.

CASE 5 : Another div that contains a table

When an area contains a table, activating the "Auto Detection" feature facilitates the identification of the table within that designated area. Detection hinges on the presence of a clickable element within the table; lacking this, detection will not occur. However, if the "toggle" function alone is enabled, the table will be detected regardless of clickable elements.

EXAMPLE:

In the following example, the area that contain table will be detected automatically, and only the clickable elements are tracked.

CASE 6: In this case, a table is defined as an area, and the user defines separate trackable elements

When a table is incorporated as an area and the "Auto Detection" is enabled, the system will detect all clickable elements within the table. However, in cases where "auto detect trackable element" is disabled and distinct trackable elements are individually defined, the system will ignore configured trackable element and only track the complete table regardless of clickable elements.

EXAMPLE:

In the following example, the Auto Detection is disabled, and trackable element is defined individually.
So for this, the configuration for trackable elements will be ignored, and the complete table will be tracked even if it doesn't contain clickable elements.

In the second example, the Auto Detection is enabled, and trackable element is not configured individually.

So for this, A complete table area will be detected, but only clickable elements will be tracked.

TABLE TRACKING CASES

We now have type selectors in the settings, allowing you to choose a type for the configuration and set insights configurations accordingly.

Case 1: Using the Selector Table

Table + Auto Detection: It will highlight the entire table with separate selectors, and a yellow bar will appear on the portal, indicating that individual element tracking in large tables may lead to performance bottlenecks. Please ensure that your table size is manageable to maintain optimal performance.
Table + 1 Trackable Element: Only a single trackable element will be highlighted.

**Table + 1 Trackable Element:**It will highlight the entire table as an area, but only the defined element will be trackable, while the other elements will not be tracked.

Case 2: Using the Selector Container

Container + Auto Detection: All trackable elements within the container will be highlighted and a yellow bar will appear on the portal, indicating that individual element tracking in large tables may lead to performance bottlenecks. Please ensure that your table size is manageable to maintain optimal performance.

Container + 1 Trackable Element: Only the specified individual trackable element will be highlighted, while the other elements will not be tracked.

Case 3: Table tracking

Table Tracking from Basic Configuration: Highlights the entire table as a single element.

Related documents

• Area – Learn how to configure areas and understand how AppNavi identifies and tracks sections of an application.
• Pages – Learn how AppNavi identifies and tracks application pages for usage analytics.