Support

Developing Walkthrough guides

Walkthroughs provide contextual guidance directly within an application's flow. They can be single- or multi-step Guides that assist users through processes in a streamlined fashion, using rules and trigger logic to create a tour-like experience.

The image below exemplifies how employees view walkthrough steps when using the web application.

Accessing Adopt Editor for Walkthroughs

After creating a Walkthrough in Nexthink Applications, launch Adopt Editor using the installed Nexthink browser extension:

From Browser > Extensions:

  1. Sign in as an administrator in the installed Nexthink browser extension.

  2. Open the Nexthink browser extension, verify the Tenant, and select the target web Application.

  3. Click the guide of interest to open Adopt Editor directly on the web application URL.

Understanding Adopt Editor for Walkthroughs

When you open a Walkthrough in Adopt Editor mode, the in-application interface displays as follows:

  1. Move the Adopt Editor to the right side of the page, and vice versa if it is already on the right side.

  2. Add a new step, or assign an action or decision.

  3. Change the guide language to review and override guide content localized by Nexthink—AI generated.

  4. Access the guide settings, where you can toggle context help.

  5. Turn off the Adopt Editor, allowing you to preview the guide.

  6. Guide steps are listed in numerical order, except for decisions.

  7. Move the step up to rearrange the order.

  8. Move the step down to rearrange the order.

  9. Access the step properties to configure content, appearance, position and triggers.

  10. Remove the step or make it optional.

  11. Select multiple steps at once. You can configure position properties for all your selected steps.

Using Adopt Editor for developing Walkthrough Steps, Actions and Decisions

Steps are the cornerstone of any guide, but Actions and Decisions allow you to add immersion and focus to your Walkthroughs.

Creating Steps

After accessing Adopt Editor for Walkthroughs:

  1. Create a new Step by selecting Add a Step or clicking the + icon.

    • Select Step from the drop-down menu, or use the keyboard shortcut Shift + A.

    • This activates the element picker, where you can choose an element on the page to associate with this Step.

    • Hover the cursor over your page and choose an element by clicking on it or using the Shift + S keyboard shortcut. This creates a step assigned to the chosen element.

The Shift + S shortcut is useful when you cannot select an element with the cursor. For instance, when you select an element in a pop-up menu that is not visible when clicked.

  1. Open the Step properties to access the property tabs: Content, Appearance, Positioning and Display. Use these tabs to:

Creating Actions

Use Actions to automatically perform certain actions for the employee.

After accessing Adopt Editor for Walkthroughs, from the + menu:

  1. Select Action to create one.

  2. When associated with an element, set Actions to Click or Focus:

    • Click interacts with the associated element. When an employee reaches this part of the Walkthrough, you can create a Click Action rather than instructing them to navigate to a different page or interact with an element.

    • Focus switches the active focus to the associated element, provided it is a text input field, block of text, or a drop-down menu. You can create Focus Actions that bring important page elements to the employee's attention during a walkthrough.

Creating Decisions

Decisions allow you to change the sequential flow of a Walkthrough by setting conditions. When met, these conditions can be used to skip or return to certain steps.

After accessing Adopt Editor for Walkthroughs, from the + menu:

  1. Select Decision to create one.

  2. Define your conditions based on Element or Rule. If one option is enabled, Adopt automatically disables the other to prevent conflicts.

Element conditions for Decisions

Set conditions based on whether a selected element is visible or present on the page.

  • Visible indicates the element can be seen on the page.

  • Present indicates the element is available in the DOM.

Optionally, Ignore key page selections and modify Element locations by changing or deactivating selectors, similarly to enabling or disabling element selector overrides from Nexthink Applications.

Select which guide step Adopt displays after confirming whether the selected element is present or not.

  • The asynchronous nature of webpage element rendering can cause Decisions not to resolve properly. Therefore, you can optionally add a delay, measured in seconds.

  • Adopt waits for the delay to end before checking if the conditions of the Decision are met.

Rule conditions for Decisions

Set conditions based on guide engagement or occurrence. The available conditions are similar to those used for displaying Context help.

  • Engagement conditions focus on customer interaction with the current guide or related guides.

  • Occurrence conditions focus on the frequency of views or interactions with the current guide.

Optionally, you can define multiple conditions to achieve a more targeted or granular Decision. You can also Ignore key page selections.

Select which guide step Adopt displays after confirming whether your defined conditions are true or false.

Last updated

Was this helpful?