GuideGen

Record a workflow in your browser and GuideGen auto-generates a step-by-step guide — an annotated screenshot for every click, with editable step text — then hands it over: as text an AI can act on, or as HTML, Markdown, PDF, PowerPoint or a narrated video.

The lead is the AI handoff. Explaining something you just did in a browser to an assistant means screenshotting it and typing the steps out by hand; that is the chore this removes. The same recording is also the document a person reads.

Capture, editing, rendering and every export run on your device. Two things leave it, both deliberate: signing in, and the single guide you press Publish on. Everything else lives in chrome.storage.local.

Install (Load unpacked)

1. Open Chrome (or any Chromium browser: Edge, Brave, Arc).
2. Go to chrome://extensions.
3. Turn on Developer mode (top-right).
4. Click Load unpacked and select this GuideGen folder.
5. Pin the GuideGen icon from the puzzle-piece menu.

Record a guide

1. Open the page/app you want to document. (If a tab was already open before you installed GuideGen, reload it once.)
2. Click the GuideGen icon → Start recording.
3. Do your workflow normally. Each click and each form entry becomes a step with a screenshot, the clicked element highlighted, and an auto-written description ("Click the ... button", "Type ... into ...").
4. A red Recording pill sits in the bottom-right and counts steps. Click Stop & edit when finished — the editor opens automatically.

When you stop, GuideGen tidies the guide up:

• It names it after what you did (e.g. How to view Journey Tracking in uEngage) — editable, and only when you haven't titled it yourself.
• It folds "click the field" + "type into that field" into a single step.
• It drops a "Go to …" step that only restates where the click before it already went. A page load still gets its own step when nothing else explains it: it opened in another tab, you typed the address yourself, or it's where the guide ends.

Typing is one step per burst, not per keystroke — "Type "Demo"" settles after you stop typing and the screenshot is taken then, with the value and its results on screen.

Edit

• Every step is a card: edit the description inline, reorder with ↑/↓, or Delete it.
• Blur sensitive information: press the droplet on a step, then drag a box over anything sensitive (passwords, emails, account numbers). The region is pixelated in every export, permanently. Password fields are auto-masked at capture time.
• Add a step of your own: hover between any two steps and press +. Write the line you want the reader to see, and add a picture if you have one — a diagram, a photo, a screenshot from somewhere else. Without a picture the text becomes a section slide styled like the rest of the guide: a divider in the slide deck, a tinted card in the document and the web page. The + is there before the first step and after the last, so a guide can be written by hand from nothing.
• The title (top bar) and all edits save automatically. Guides persist across browser restarts.

Export

Open the Export ▾ menu:

Every format crops each screenshot toward the thing you clicked, so the UI is readable instead of lost in the browser window's empty margins.

Format	Notes
Web page (.html)	Single self-contained file, images embedded.
Markdown (.md)	Images embedded as data URIs.
PDF (.pdf)	Title page + paginated steps.
PowerPoint (.pptx)	Title slide + one slide per step.
Narrated video (.webm)	Slideshow of your steps, narrated by a built-in offline voice.
Copy for AI	The workflow as text on your clipboard: every step, the action it was, the URL and page title it happened on, grouped by page — plus the API log. Text only, no screenshots.

About the narrated video

The video is rendered on a canvas and captured to .webm. With narration on, GuideGen synthesizes the speech itself — a neural voice (Piper) bundled in lib/ and run in your browser — then mixes it into the recording. Nothing is uploaded and no voice service is called.

Pace — Very fast through Very slow — sets how quickly the voice reads. There's no seconds-per-step setting: each step stays on screen as long as its own text takes to say, so short steps go by quickly and wordy ones get room. The dialog shows the estimated video length as you change pace.

Video is 1080p. Like the other exports, each slide zooms toward the thing you clicked rather than showing the whole browser window — a full desktop viewport is mostly empty margin, and fitting all of it on screen shrinks the actual UI until the text can't be read.

The first narrated export takes a little longer while the voice model loads. The video is rendered by the extension in an offscreen document, so you can leave the dashboard tab — you no longer have to keep it focused. If the voice files are missing from lib/, GuideGen falls back to a silent captioned video (every step still shows its text on screen).

Publish and share a link

For a reader who'd rather not be sent a file: press Share → Publish and you get a link at /g/{id}. Only that guide is uploaded, on that press.

What the recipient opens:

• The title, your name, how long the recording was and the app it happened in, then the numbered steps.
• Any screenshot opens full-screen and zooms — a dashboard shrunk into a column is a picture nobody can read.
• A link to any single step, so "look at step 7" is a link.
• Page loads link to the page they loaded.
• A table of contents once there are more than three steps, and a print stylesheet.
• Pasted into Slack or WhatsApp, the preview shows the guide's own title — never a step and never a screenshot. Shared guides are noindex.

Owner-side:

• Update re-publishes in place: the link you already sent is never stale, and the superseded images are deleted.
• Unpublish kills the link and deletes the images.
• Annotations and redactions are baked into the images before upload — no unredacted original ever leaves your machine.
• Let readers export is optional, and it is not an access control: it decides whether a button appears. Anyone who can open the page can already print or screenshot it.
• A description you write in the editor appears above the steps. It is the only part of the page not derived from the recording.

Capture the last 2 minutes

The pain arrives after the fact: you finish something, then someone asks how. Switch catch-up capture on for a site and GuideGen holds what you do there — the last 240 actions, for up to 7 days — so you can turn recent work into a guide afterwards.

• Armed per site, off by default. There is no always-on-everywhere mode in the UI.
• On an armed page a small dot sits in the corner for as long as it is on. It is disclosure, not a button.
• Redeem from the popup: Capture last 2 minutes, or capture the whole session. Measured back from the session's end, so an older capture offers its own last two minutes.
• Pending captures are listed in the dashboard beside your guides, with how long each has left.
• Never in incognito. On a screen with a password field focused it keeps the written step and takes no screenshot.
• None of it is uploaded. Promoting one makes an ordinary local guide; publishing that is the same deliberate act it always was.

The API log

Each step also records the requests the page made and what came back — POST /api/orders → 500. Switch on the opt-in and every request is copyable as a curl, with its response:

curl -X POST 'https://api.uengage.in/v2/orders?store=…' \
  -H 'content-type: application/json' \
  -H 'authorization: …GuideGen-masked…' \
  --data-raw '{"store_id":4412,"items":[{"sku":"BRG-1","qty":2}]}'
# credential header values are masked — paste your own to replay; cookies are not captured

That turns "I clicked Save and it didn't work" into a bug report a developer or a model can start on without asking you to reproduce it.

• Credential header values are never stored. A header whose name looks like a credential (authorization, cookie, x-api-key, …) keeps its name and loses its value; the same goes for query-string values and obvious secrets in a sent body. So a cURL documents a call — it can't replay it.
• The full exchange is a separate opt-in, off by default — headers, the body sent and the body returned, for every request including the ones that succeeded. Be deliberate with it: a successful response is often real data, and it is the one thing here you can't eyeball before you share it. Bodies are trimmed, credential-looking keys are masked inside them too, and nothing is ever uploaded.
• A step where everything succeeded shows one muted line. A step where something failed shows the failures. Everything, in full, is in the API log panel in the editor toolbar — with a failed-only filter and a copy button.
• Only the AI handoff carries it. HTML, Markdown, PDF, PowerPoint, video and published links all leave it out, and any step's log can be deleted on its own.

How it works (for tinkering)

• manifest.json — MV3 config and permissions.
• background.js — recording state, captureVisibleTab screenshots, storage.
• recorder.js / recorder.css — content script: listens for clicks/inputs, builds step descriptions, shows the recording pill or the catch-up dot.
• netpatch.js — the only code that runs in the page's own world. Reports the body of a failed response, which chrome.webRequest cannot read. Opt-in.
• render.js — draws annotations (scrim + spotlight, accent ring, numbered badge, redaction pixelation) onto a canvas.
• popup.html / popup.js — the toolbar popup: sign in, start/stop, open the library.
• sync.js — the account session, shared with the dashboard over the bridge.
• offscreen.html / offscreen.js — invisible page that renders the narrated video, because a service worker has no canvas, audio engine or recorder.
• editor.html / redirect.js — a redirect. The editor itself is now the dashboard at /app; see web/assets/app.js.
• exporters.js — HTML / Markdown / PDF / PPTX / video generators, plus the AI handoff and the API log text.
• tts.js — offline speech synthesis for the narrated video.
• web/ — the website: landing page, the guide editor at /app, the public viewer at /g/{id}, and one serverless function for deleting images. render.js and exporters.js are mirrored into web/assets/ by tools/sync-web-assets.mjs; edit the root copies, never the mirrors.
• lib/ — bundled jsPDF (PDF), PptxGenJS (PowerPoint), and the narration engine: onnxruntime-web, piper-phonemize (espeak-ng), and a Piper voice. The voice model and its pronunciation dictionary account for nearly all of the folder's ~90MB.

Data lives in chrome.storage.local (unlimited storage). To wipe everything, remove the extension or clear its storage.

Known limits vs. paid Scribe

• Captures web pages only (browser clicks/inputs), not native desktop apps.
• No team workspaces or AI workflow-analysis features.
• Screenshots are of the visible viewport at click time.
• Guides you haven't published stay on the machine that recorded them — nothing syncs until you publish, so there is nothing to open elsewhere. Published guides you can edit and export from any browser.

Built as a personal, local alternative. Bundled libraries retain their own MIT licenses (see lib/).