DemoFast tutorials

From first capture to useful evidence.

Practical guides checked against the current DemoFast app and browser extension. Generated interface visuals are labeled illustrative; instructions follow available product behavior.

Illustrative DemoFast browser extension popup showing a connected recording state
Tutorial01

Install and connect the DemoFast Chrome extension

Install the current Chrome extension, connect your DemoFast account, and select the workspace where new recordings should be saved.

Follow tutorial ↗
Illustrative DemoFast browser extension popup showing a connected recording state
Tutorial02

Record your first interactive product demo

Capture a short browser workflow with automatic steps, pause when needed, and save the finished recording to your workspace.

Follow tutorial ↗
Illustrative DemoFast editor with step thumbnails and editing controls
Tutorial03

Capture and organize demo steps

Review a captured sequence, reorder useful steps, remove mistakes, duplicate a screen, or add a missing image step.

Follow tutorial ↗
Illustrative DemoFast dashboard with draft and published demos
Tutorial04

Edit a demo title and its step descriptions

Rename a demo from the dashboard and replace an automatically generated step description from the owner preview.

Follow tutorial ↗
Illustrative DemoFast annotation tools with a click marker and highlighted area
Tutorial05

Add click markers and text annotations

Place one click marker and one textbox on a captured step, then adjust their position and appearance in the editor.

Follow tutorial ↗
Illustrative DemoFast annotation tools with a click marker and highlighted area
Tutorial06

Add zoom and custom highlight areas

Direct attention to a dense interface with a resizable custom area or a single zoom area on the selected step.

Follow tutorial ↗
Illustrative DemoFast preview player showing step navigation and progress
Tutorial07

Preview and publish a demo

Save the current sequence, inspect it in the authenticated preview, make it public, and copy a viewer link.

Follow tutorial ↗
Illustrative DemoFast sharing panel with public link and embed code
Tutorial08

Embed a DemoFast demo on a website

Publish a demo, copy the current iframe code, and place it in a responsive page container with accessible context.

Follow tutorial ↗
Illustrative DemoFast export panel with GIF and video choices
Tutorial09

Export a demo as GIF or video

Render a finished walkthrough in the browser as a GIF or WebM video, adjust the available settings, and download the completed file.

Follow tutorial ↗
Illustrative DemoFast analytics view with views, completion, and step progress
Tutorial10

Review demo engagement analytics

Choose a demo, set a date range, and interpret views, visitors, completions, and step-level progression without overreading a small sample.

Follow tutorial ↗