The Onboarding Tour and the Header Compass
How a new tenant goes from “where do I click first” to “I know what each module is for” without watching a Loom video — and why the compass icon stays in the header for the months after.
New tenants need a clear first run, not a guessing game of clicking around until something happens. The onboarding tour gives them that guided start: where the dashboard lives, what each module is for, and which areas belong to their role.
The welcome dialog and the hub tour
On first sign-in the platform opens a welcome dialog offering a three-minute fly-over of every module in the header. The dialog has three answers. Take the grand tour starts the hub tour. Maybe later closes it for now and asks again on the next visit. Don’t show this again retires the prompt for good. Until the tour has been started or explicitly retired, the dialog keeps coming back. A soft no is not a no.
The hub tour walks the module entries in the navigation, points at the compass icon itself, and ends at the user menu — the home base. The dialog also says where to come back for more: the compass in the header, or Settings > Account > Welcome Tour.
Nine module tours
Beyond the hub there are nine module tours: Dashboard, Core Operations, Market Trading, Auction Platform, Escrow & Finance, Sourcing Platform, Finance, General and Settings. Each tour is independent — the user picks which ones to take and in which order. They are not the same length: Finance is three stops, Dashboard and Escrow six, Sourcing eight, General nine, Auction eleven, Market thirteen, Core Operations twenty-seven and Settings thirty-four. The launcher shows the stop count and an estimated duration next to each tour, so nobody starts the Settings tour two minutes before a truck arrives.
Module tours follow the subscription. A tour for a module outside the tenant’s plan is listed in the compass with a lock and a note that activating that plan unlocks it. The tour is not a demo of things the tenant cannot click.
The header compass
An icon in the header — a small compass — is the resume button. Clicking it opens the tour catalog and shows, per tour, Done, In progress, Resume or Restart. A user three months in who realises they’ve never used Auction can pick the Auction tour from the compass instead of having to remember where the tour was. The compass is quiet — it doesn’t blink, doesn’t pulse, doesn’t demand attention. It’s a button that waits.
How the tours work
The tours use driver.js for the highlight overlays and the step navigation. Each step pins to a real element of the interface with a stable selector — when the underlying UI changes, the tour content gets updated alongside it (a renamed button means the tour selector and the tour copy both change). Steps are short: one to three sentences, one screen’s worth of UI, one button to advance.
Dismiss and resume
A tour is interruptible at any step. Pressing Esc, clicking outside, or hitting Skip exits the tour with the progress saved. Returning via the compass picks up where the user left off, or restarts from the top. Multiple tours can be in progress at once (started Core Operations, paused, started Auction); the compass surfaces both with their progress states.
Why on-screen instead of video
Because a Loom video pauses on a different screen than the user’s. The on-screen tour pins to the user’s actual UI: their tenant’s actual data, their role-tuned widgets, their language preference. A new operations lead doesn’t need to translate from the video to their screen — the tour is already on their screen.