Skip to main content

How Dopt works

Dopt is a developer-first platform for building self-serve product onboarding and education. Our pre-built components and SDKs make it easy to build set-up wizards, new user onboarding checklists, tours, AI-powered user assistants and more.

Dopt consists of two foundational concepts:

  • A visual flow builder that you use to design the targeting, logic, and content of the onboarding and education your users will flow through.
  • AI assistants that can crawl your website, documentation, or help center to provide seamless in-product assistance to your users.
  • Pre-built components, SDKs, and APIs that you use in your application to build the experiences by fetching and updating state and content from flows and assistants.

Visual flow builder​

Flow builder

A flow defines an end user’s onboarding or education experience. This could be a simple flow with a single step, like a dismissible alert, or a flow with multiple steps, like a getting started checklist. You create and manage flows through our visual flow builder.

Flows are composed of connected blocks. A block defines a step of the end user’s experience. There are different kinds of blocks, like Checklist and Tour component blocks, true/false branching blocks, and webhook blocks. Blocks contain content, user targeting rules, and other configuration.

So for example, you might have a "New user onboarding" flow that contains a Start block with targeting rules, a Checklist block with 3 checklist items, and a Tour with 3 steps.

Flows and blocks also encapsulate user state. You can think of flows like user state machines. As a user moves through a flow, Dopt tracks the states of the user like which blocks they’ve completed and which blocks are active.

Flows are versioned which makes it easy to deploy, restore, and audit your changes across development environments.

Assistants​

AI assistant

Assistants are AI models that are trained on your content. Assistants can be queried with a question about your product (or anything at all!) and provided with relevant context like what plan a user is on or what page in your product they're asking from.

You can define sources for a given assistant which allows you to crawl publicly accessible websites (like your docs or help center) or you can manually upload HTML to produce documents. These documents are then used as inputs for the assistant's query responses.

Pre-built components, SDKs, and APIs​

Components and SDKs

Once you've created your flow or assistant, you can use our SDKs and APIs to integrate them in your app.

When a user enters your application, Dopt will evaluate the targeting conditions in your flows to determine if a user should qualify for the flow and which state and content to return to your app. You use the returned data in your app to natively render experiences.

You can either use our pre-built, customizable React components or use Dopt headlessly in React, Vue, and other web frameworks with your own components. Our components solve common UI problems like positioning and order of steps.

Our SDKs and APIs are simple and easy to use. Under the hood, we handle the complex backend tasks of storing and updating user states so you don’t have to model user states in your DB or use localstorage. And we provide elegant client-side abstractions which enable you to fetch and update user state from anywhere in your application

All of these tools enable you to build deeply integrated, in-product onboarding and education experiences.

Demo​

Here’s a short demo of how to use Dopt to build a getting-started checklist.