heytappr.book a demo

free tool

screenshots in, step-by-step guide out

drop in your screenshots, spotlight the button that matters, number the steps, blur anything private, and export. it all runs in your browser, so nothing gets uploaded.

paste with ⌘V / ctrl+V, drop images anywhere on this box, or pick files. nothing is uploaded: your screenshots stay in this browser tab.

what makes a screenshot guide easy to follow

a good guide answers one question per step: where do i click next. everything on the screenshot that doesn't help answer that is noise, and a full screenshot is mostly noise. that's why the spotlight is the first tool. it dims the whole screen except the one control you mean, so a reader's eye lands in the right place before they read a word.

captions work best short and in the same words the interface uses. if the button says "export as csv", the caption should say that too, not "download your data". people match words to labels faster than they read sentences. numbers help when a single screen has two actions, and arrows help when the target is small and far from where the eye starts.

blur is there because real screenshots are full of real data. customer emails, names, invoice totals. pixelate them before the guide goes into a help center where anyone can read it.

the problem with every screenshot guide

screenshots are a picture of your product on the day you took them. the next redesign moves a menu, renames a button, or changes a color, and every guide that shows the old version quietly becomes wrong. teams either spend a day retaking screenshots after each release or live with guides that confuse the people they were meant to help.

that's the gap heytapprcloses. instead of a picture of the button, it spotlights the real button on the live page and talks the user through each step, so there's no screenshot to go stale. when a release moves something, the step is flagged for your team instead of silently pointing at the wrong thing. keep this tool for help articles and docs; use heytappr for the questions people ask while they're inside your product. if your guides point at css selectors, the selector checker will tell you which ones are likely to break.

questions

How do I make a step-by-step guide with screenshots?

Paste or drop your screenshots in order, then on each one spotlight the control to click, add a number or arrow, blur anything private, and write a one-line caption. Export the whole guide as one long image, a PDF, an HTML page, or Markdown with PNGs.

Are my screenshots uploaded anywhere?

No. Everything happens in your browser tab. The current guide is saved in your browser's own storage so a reload doesn't lose it, and you can clear it with start fresh.

How do I blur sensitive information in a screenshot?

Pick the blur tool and drag over the area. It pixelates that region in every export, so emails, names, and account numbers aren't readable.

Can I turn the guide into a PDF?

Yes. Save as pdf opens a clean print layout of all steps; choose Save as PDF in your browser's print dialog.

Is it really free?

Yes. No account, no watermark, no limits beyond what your browser can hold in memory.