No typed text
A trail says where to type, not what — unless your site opts a field in. Passwords, cards and one-time codes never.
TT—01 / Click trails for web appsNo screen recording · Links expire
Record a walkthrough by clicking through your app. Send the link. Your teammate gets the real interface — with numbered marks showing exactly where to go next.
Press record and use your app normally. Every click and every field you type in becomes a numbered step — even across page loads.
Stop and copy a ?trail= link. Pick how long it lives: an hour, a day, three days.
They open it and the page scrolls, pulses, and draws the path — opening the menus, tabs and dialogs on the way, one step at a time, at their pace.
Videos go stale the moment the UI changes, and watching isn't doing.
| Screen videoVideo | TapTrail | |
|---|---|---|
| Follower clicks the real UIClicks the real UI | — | Yes |
| Survives a redesign | — | Targets elementsYes |
| Captures typed text | Everything on screenAll | Only fields you allowIf allowed |
| Cleans up after itselfCleans up | Lives foreverNever | Expires |
| Time to make | Record, trim, uploadMinutes | Click, stop, copySeconds |
A trail is the clicks, not the screen. It lives on your server, and the link deletes itself.
A trail says where to type, not what — unless your site opts a field in. Passwords, cards and one-time codes never.
Nothing is screen-recorded. A trail is a few kilobytes of element paths, with emails and long numbers masked.
Links live 1 hour, 1 day or 3 days, then they’re gone. Delete one sooner any time.
Lock recording to signed-in staff with a token from your app. Anyone with a link can still follow it.
The script finds its server from its own URL, so your app can live anywhere.
<script type="module" src="/taptrail.js"></script>
?button=0
Hide the record button. The shortcut still works.
<script type="module" src="/taptrail.js?button=0"></script>
Or start and stop from your own button with TapTrail.start() and TapTrail.stop().
?record=0
Replay only. Load it for everyone but your team.
<!-- everyone: follows shared links, cannot record -->
<script type="module" src="/taptrail.js?record=0"></script>
<!-- support team and admins: can record -->
<script type="module" src="/taptrail.js"></script>
Your app picks the tag from the signed-in user's role. Pair it with UPLOAD_SECRET so the API is locked too.
data-tt-record
Let a trail keep what is typed in this field. Off by default.
<!-- one field -->
<input name="project-name" data-tt-record>
<!-- every field in a form, minus one -->
<form data-tt-record>
<input name="company">
<textarea name="notes" data-tt-record="off"></textarea>
</form>
Without it, a trail says "typed into 'Name'" and the follower types their own. With it, the widget asks at the start of each recording whether to keep typed text or leave it out. Passwords, card numbers and one-time codes are never kept, opted in or not. On replay, auto-tap fills an opted-in field unless the follower has already typed in it, and never submits.
UPLOAD_SECRET
Only staff with a token from your app can save trails.
UPLOAD_SECRET="$(openssl rand -base64 48)" npm start
import crypto from 'node:crypto';
function taptrailToken(userId, ttlSeconds = 3600) {
const exp = Math.floor(Date.now() / 1000) + ttlSeconds;
const body = JSON.stringify({ sub: String(userId), exp });
const head = 'v1.' + Buffer.from(body).toString('base64url');
const sig = crypto
.createHmac('sha256', process.env.UPLOAD_SECRET)
.update(head)
.digest('base64url');
return `${head}.${sig}`;
}
<script>
window.TapTrailConfig = {
getToken: () => fetch('/api/taptrail-token').then((r) => r.text()),
};
</script>
<script type="module" src="/taptrail.js"></script>
Tokens expire, so getToken fetches a fresh one each time a trail is saved. Following a link needs no token.
Same-site steps only · typed text stays out unless a field opts in
The short version of what TapTrail does, what it keeps, and where it runs.
TapTrail records a click path through a web app and turns it into a share link. Whoever opens the link sees the same live page with numbered marks, a dotted line and a tooltip for each step, and follows along at their own pace. It is an interactive walkthrough, not a video.
Nothing is filmed. A trail is a few kilobytes of element paths, so the follower clicks the real interface in their own account, at their own window size. Steps are found again by selector and label, so small layout changes do not break a trail the way they make a video stale.
Not by default. A trail says which field you typed in, not what. A site can allow particular fields with data-tt-record; then the person recording chooses Keep or Leave out each time. Passwords, card numbers and one-time codes are never kept, and emails and long numbers are masked.
Yes. A replay opens the tab, accordion, menu, side sheet or dialog that hides the next step, including native <dialog> elements, and carries on across page loads on the same site. With auto-tap on it presses safe controls for you, but never anything that deletes, pays, sends or submits.
One hour, one day or three days, chosen when you share. Then the trail is deleted and the link says so. The person who recorded it can delete it sooner.
Yes. Load the script with ?record=0 for everyone else, and start the server with UPLOAD_SECRET so a trail is only saved with a short-lived token your app signs for signed-in staff. Anyone with a link can still follow it.
On the server you run. TapTrail is a small Node program with no runtime dependencies, no accounts and no third-party analytics. You add one script tag to your app and point it at your server.