Skip to main content
Steps are the building blocks of a demo. Content steps show captured product moments, while cover steps add screens for intros, transitions, forms, embeds, and calls to action. Use the step strip to shape the story. You can reorder, duplicate, delete, rename, add media, add covers, or record more steps with the Chrome extension.

Image

Use screenshots for stable product walkthroughs that are easy to polish.

Video

Use video when motion, loading states, or animation matters.

HTML

Use HTML captures when you need a pixel-perfect, code-backed snapshot.

​
Add or record steps

Click the add control between steps to insert a new moment. Choose Add image or video, Record more steps, or a cover step type. When you record more steps, choose where the new steps should go: before the first step, after a specific step, or at the end of the demo.

​
Replace media

Select a content step and use Type to work with its media. Replace image and video steps from the asset library or by uploading a new file. HTML steps are created by HTML capture. In the editor, HTML remains an HTML step; use the Chrome extension when you need to capture a new HTML product screen.

​
Edit image and video steps

For image steps, use Edit to crop the screenshot or align it inside the player. Cropping creates a new image asset from the selected region. For image and video steps, use alignment to decide how the media sits inside the stage: visible, filled, or positioned around the part that matters.