Product screenshots in drafts
Connect your product to Workover and AI drafts arrive with screenshots of it, instead of a note saying a picture should go here. You connect the app once for the workspace. After that, every draft in a project that uses the connection can include screenshots, framed and marked up automatically.
Before you start:
- Your workspace needs an AI provider chosen under Settings > AI, either Workover AI (included with a paid plan) or Your own key. See Choose who provides Workover AI. Screenshots are planned by the AI, so without a provider no draft runs.
- You need to be a workspace member. Guests cannot manage app connections.
- If your app needs a sign-in, have a login ready for it. If the app sits behind Cloudflare Access, you also need a Cloudflare Access service token.
Connect your app
Warning: Workover signs in with the account you give it, unattended, whenever it takes screenshots or rescans your app. Anything that account can do in your product, a session signed in as it can do. Use a dedicated demo or test account with only the access needed to reach the screens you document, never your own login or an admin account.
- Go to Settings > Integrations and scroll to the Screenshots section.
- Select Connect an app (or Connect another app if one is already connected).
- Fill in the form. Only Name and App URL are needed for a public app; the fields are described below.
- Select Save connection.
The saved connection shows its name and URL, Login saved with the username (or No login (public pages only)), and Workspace-wide or the project it is used for. To change it, select the pencil icon. To remove it, select the trash icon.
Once an app is connected, the prompt box on your workspace home shows a camera icon next to your other connected tools. It appears only when at least one other tool is connected too.
Connection fields
| Field | What to enter |
|---|---|
| Name | What this app is, for example “Production dashboard”. |
| App URL | The base URL Workover screenshots, for example https://app.yourproduct.com. |
| Product lives under | Optional. A path such as /app, when your product shares a domain with your marketing site or docs. Leave it empty to scan everything reachable from the App URL. |
| Start pages | Optional. One path per line, such as /app/acme/settings/members. Workover opens these first when it scans your app, which helps it find screens that menus do not reach through plain links. Changing the start pages scans your app again. |
| Use for | Which project’s documents use this app: All projects (workspace-wide) or one project. A workspace-wide connection is the fallback for any project without its own. Shown only when the workspace has projects. |
| Login page URL | Optional. Where the sign-in form is, if it is not at the App URL. |
| Email or username | The account Workover signs in with. Leave the login fields empty for an app that needs no sign-in. |
| Password | The account’s password. When editing, leave it blank to keep the saved one. If you change the App URL or Login page URL, enter the password again: changing either clears the saved password and the Access client secret. |
| Access client ID and Access client secret | Only if Cloudflare Access (Zero Trust) sits in front of the app. Without a service token the browser stops at Cloudflare’s sign-in page and never reaches your app, so the account above cannot help. |
Passwords and the Access client secret are stored encrypted, used only to take screenshots, and never shown again. Connections belong to one workspace and are not available to any other.
How screenshots are taken
When you draft a document in a project that has a connection, Workover AI decides whether the article needs screenshots and plans up to four, only where it judges one helps. A browser then signs in to your app, opens each screen and captures it, and the images are placed in the document at the steps they illustrate. If no app is connected, a draft that would have benefited shows a banner: “This guide would be clearer with screenshots.”
Framing is automatic. A sequence starts wide and narrows: the first picture shows the whole screen so the reader can find the area, later ones show one panel, then the single control a step acts on. You do not choose the crop or the width.
Highlights and redaction. Each screenshot can mark the control a step talks about with a red box, plus an arrow when the control is small. Sensitive details the plan names, such as a real email address, a person’s name or a billing amount, are blurred before the picture is taken.
Capture is built to look, not act. Apart from signing in, the browser opens screens and, when a picture is of a dialog or menu, clicks the control that opens it. It is not asked to change settings, type into fields or save anything. It still acts as a real signed-in user, which is why the account you give it matters.
Only your app. Workover captures only the app URL you configured, with the login you supplied. It is not a general web scraper.
Keep screenshots current
- Background rescans. Workover rescans connected apps that have a saved login in the background, so its list of your screens does not go stale. Changing a connection’s start pages or Product lives under path starts a rescan straight away.
- Sign-in alerts. If Workover detects that it can no longer sign in, for example after the password changes, the workspace owner gets one email linking to the Screenshots section. Update the login there. After the next successful sign-in, a later failure can send a new alert.
- Retake a document’s screenshots. There is no button for this in the app. Use the Workover CLI:
workover doc reshoot <docId>
Workover AI retakes the screenshots from the document’s current text, using the stored connection. Add --replace to drop the old screenshots. The result is added as suggestions to accept or reject; add --write to apply it directly instead. Sign in to the CLI with workover login --draft, or workover login --draft --write to use --write. The CLI never sees your app’s password. See CLI commands and MCP tools.
Captured images are stored with the document like any other image. See Images and media.
Related
Still need help?
Can’t find what you’re looking for? Our team is here to help.