With a sitemap you can create a visual overview of your online service, by taking screenshots of any page.

A sitemaps consists of:

Cliperado can refresh the screenshots automatically. When you click refresh screenshots, you'll see Cliperado update the screenshots live.

Cliperado uses a browser to walk through your site. You can instruct Cliperado how to do this step-by-step with actions. These action from the path by which Cliperado goes through your site. It can login to forms, open links, take screenshots etc etc. Cliperado does this super fast and can refresh hundreds of screenshots in minutes. It can actually be quite entertaining watching Cliperado go over your site and inmagine how much time it would take you to do this manually. Anyway, back to how this sitemap works:

Cliperado walks though your site as instructed by the actions. These are the types actions:

Open link: This makes Cliperado go to a page and load all images, css etc.
Assign a value to a form field: Select a field and set the value
Submit a form: Triggers the submit action on a form
Click on: Clicks on a button, link or any other element on the page
Hover over: Hovers over any element visible on the page
Press a key: Press the enter, up or down key.
Wait: This makes Cliperado wait. You might have a load animation that you want to finish before you take the next action.
Screenshot: Take a screenshot of the current page.

With variants you can reuse one sitemap for different versions of the screenshots. For instance; different languages, live and development environment, desktop & mobile sized screenshots. This allows you to maintain one sitemap, for all variants combined.

You can create these variants by using dynamic actions. Dynamic actions use different values for the action per variant, instead of static values. To make the action dynamic, you use variables. See the assign value to the login form below.

In this example, the service allows the user to set their language. So all Cliperado has to do is login with a different user. An English user for screenshots in English one for French,  Spanish etc.

{{user_name}} is replaced by the real user name when Cliperado scrapes your site.

Per variant you can set the value of a variable. Variables can be used to replace static values in any fields in an action. The action url, action selector and action value.