​
Overview

Interactive guides are step-by-step walkthroughs that help users navigate your application. Each guide consists of a series of steps that can include instructions, element highlighting, and automated actions.

All guides are automatically generated by AI — you don’t need to configure anything manually. The technical details below explain how guides work under the hood, helping you understand the system’s capabilities.

​
Guide structure

A guide is defined by the following properties:

interface Guide {
  id: string;          // Unique identifier for the guide
  name: string;        // Display name of the guide
  steps: Step[];       // Array of steps in the guide
  resumeData?: {       // Optional data for resuming guides
    currentStep: number;
    steps: Step[];
  };
}

​
Guide triggers

Users can trigger guides by simply asking questions in the chat widget. The AI determines whether to provide a quick answer or create a visual guide. For example:

  • “How do I create a new project?”

  • “Can you show me how to update my profile picture?”

  • “I need help setting up my account”

Simple questions get instant answers through AI chat, while complex tasks trigger step-by-step guides. Learn more about AI chat.

​
Step configuration

Each step in a guide contains:

interface Step {
  id: string;          // Unique identifier for the step
  position: string;    // Position of the highlight/pointer
  instructions: string; // Text instructions for the user
  action?: Action;     // Optional action to perform
  page: string;        // Page/route where the step occurs
}

​
Supported element interactions

Pointer can detect and interact with various UI elements:

  • Buttons

  • Links

  • Input fields

  • Lists

  • Tables

  • Media elements

  • Containers

  • Text elements

  • Navigation components

  • Dialogs

  • Tabs

  • Breadcrumbs

  • Icons

  • Progress indicators

  • Alerts

  • Accordions

  • Dropdowns

  • Sliders

  • Datepickers

  • Custom components

​
User controls and feedback

Users are able to pause/resume guides, skip steps, and exit guides at any time.

When a guide is completed, users can rate their experience by clicking 👍 or 👎, add comments about what worked or didn’t, and report any issues they encountered.

​
Troubleshooting

In testing, we’ve noticed a few common issues that can occur during guide generation and execution:

  • Elements not found

  • Failed interactions

  • Navigation problems

  • Timing issues

Please contact us if you need help resolving persistent issues.

RoadmapAI chat