How it works
- Record. Open the extension, press Record, and use the web app as you normally would. Showsteps notes each click, each typed field, each selection, each key like Enter and each page change, across tabs. A visible indicator shows while it is recording, and you can pause.
- Edit. The side panel lists every step with its screenshot. The click target is outlined. Titles are written for you (Click Save, Type in Email, Go to Settings) and you can rewrite any of them. Reorder, delete, skip or merge steps, and add a note where a click is not enough.
- Export. Pick the format that fits where the guide is going.
What the generated steps look like
Titles come from the element you touched, using its accessible name, so they read like instructions rather than coordinates. There is no AI service involved; the wording follows fixed rules, which means the same recording always gives the same text.
| What you did | Title Showsteps writes |
|---|---|
| Clicked a button labelled Save | Click Save |
| Typed an email address into the Email field | Type “jane@example.com” in Email |
| Chose Monthly in a Billing period menu | Select Monthly in Billing period |
| Pressed the Enter key | Press Enter |
| Opened a new page | Go to Settings – Acme |
Text typed into a password or card field never appears in a title, and neither does the value you typed into any field the extension marked as sensitive. Typing is grouped: a whole email address is one step, not one step per key.
Which format to export
| Format | Use it when |
|---|---|
| You are attaching the guide to an email or a ticket, or printing it. | |
| HTML | You want one self-contained file, images included, that opens in any browser. |
| Markdown | The guide is going into a wiki, a README or a docs repo. You get a folder with guide.md and an images directory. |
| DOCX | Someone will edit it in Word or Google Docs. |
| Agent skill | A coding agent or a test runner should follow or replay the steps. |
| .showsteps project | You want to keep editing later, or hand the recording to a teammate or an agent. |
You can also copy the whole guide to the clipboard as Markdown and paste it straight into a chat, an issue or a document.
Sensitive fields are masked for you
Password fields, card numbers and other fields that look sensitive are marked while you record, and their values are never stored in the step text. The screenshot for that step gets a blur over the field. You can turn it off for a step, or draw your own blur or crop over anything else, such as a customer name in a table. Redactions are stored as regions and applied when you export, so you can change your mind before sending.
Tips for a guide people actually follow
- Start from a clean state. Sign out of extra accounts and close unrelated tabs so the screenshots show only what matters.
- Go slowly and do one thing at a time. If you fumble, delete the step afterwards rather than starting over.
- Use note steps for decisions, warnings and expected results: You should now see a green Saved banner.
- Rename the guide to the outcome, not the tool: Refund a customer, not Using the billing dashboard.
- Open the exported file yourself before sending it. Read it as someone who has never seen the screen.
What it does not do
Showsteps records Chrome tabs only. It cannot capture native desktop or mobile apps, and it cannot record pages Chrome does not let extensions touch, such as chrome:// pages and the Chrome Web Store. It does not produce video or GIFs, and it does not host share links. It is a document maker, not a screen recorder.