firecrawl-demo-walkthrough

Walks through a product the way a new user would — signing up, reading the pricing, poking at the dashboard — and writes down what happens at every screen.

WHEN TO USE

SCOPE

USE FOR

Document a product's signup and onboarding flow screen by screen.
Produce a UX teardown of a competitor's pricing or dashboard experience.
Prepare talking points for a demo by walking through the product's core flows first.

This is a saved copy of the skill's SKILL.md instructions. It may differ from the upstream file or the version you install.

In this document (6)

Firecrawl Demo Walkthrough

Use this to document a product experience step by step.

Onboarding Interview

Infer the product URL, flow focus, and output format from context. If the URL is clear, proceed immediately.

Ask at most 1-3 concise questions only if blocked, such as the URL, desired flow focus, or credentials/constraints for protected areas.

Firecrawl Collection Plan

Use Firecrawl browser to open the product and navigate key flows. Snapshot at each step, scrape pages when useful, and document what the user sees and can do.

Do not submit real credentials, purchases, or irreversible actions unless the user explicitly instructs and has permission.

Parallel Work

If appropriate, use sub-agents or equivalent parallel task runners:

Homepage and Marketing
Signup and Onboarding
Pricing and Plans
Docs and Developer Experience
Dashboard and Core Product
Help and Support

Each walker should return screens visited, actions taken, observations, friction, and source URLs.

Final Deliverable

# Product Walkthrough: [Product]

## Product Overview
[What the product does]

## Flow Walkthroughs
### [Flow Name]
1. [Screen/Page] - what appears and what action is available
2. [Next Screen] - what changes

## Key Findings
[First impression, standout patterns, friction points]

## Recommendations
[UX/product improvements]

## Pages Visited
[URLs]

## Rerun Inputs
workflow: firecrawl-demo-walkthrough
url: [url]
focus: [full/signup/pricing/docs/dashboard]

Quality Bar

Be specific about screens, CTAs, forms, and transitions.
Separate observation from opinion.
Preserve every page visited.

Account or credentials required

1 FOR YOU

01
Add your Firecrawl API key
Get an API key from firecrawl.dev and set it as FIRECRAWL_API_KEY so the workflow can drive the hosted Firecrawl browser session used to click through the product's flows.
You set: FIRECRAWL_API_KEY

Listed as free: Connected services may require an account or charge fees.
Setup details: Expect some account or credential setup.

This skill ships inside the Firecrawl Workflows plugin.

Needs the Firecrawl CLI or MCP server. Set that up first — this skill doesn't include it.

Install just this skill

Run this outside your AI tool, using Node.js 22.20.0 or newer. Skills CLI 1.7.2 skips skill selection; prompts cancel installation without an interactive terminal. If choosing Project when asked about installation scope, open your project's folder before running this.

Install checklist

Check selected tools if a picker appears; Claude Code may be unchecked under Additional agents. ↑/↓ moves, Space toggles selections, Enter confirms.
Without a tool picker, check Installing to: for your intended tool. Stop if it names a different tool.
If asked, choose Symlink (Recommended) for shared files or Copy to all agents for separate copies; review the summary before confirming installation.
Install the find-skills skill? defaults to Yes, adding another skill for all projects. Choose No if you don't want that extra installation.

Skills CLI 1.7.2 sends install data to skills.sh by default, including the source, skill names, target tools and file details; GitHub sources are reported only when GitHub confirms the repository is public, while other remote sources can also be reported. Confirmed-public GitHub sources also trigger a security-audit request. Before installing, set the environment variable DO_NOT_TRACK=1 or DISABLE_TELEMETRY=1 to disable both.

npx skills add firecrawl/firecrawl-workflows --skill "firecrawl-demo-walkthrough" --full-depth

After installing for Claude Code, open it in the installation project if you chose Project; Global makes the skill available across projects on this computer. Once Claude Code loads the skill, its description helps Claude decide when to use it.

If installation created a top-level skills folder that did not exist when your Claude Code session started, run /reload-skills in that session. Run it again after later changes in that folder.

Install the whole plugin

This route installs the Firecrawl Workflows plugin package selected for your AI tool.

PLUGIN MARKETPLACE

Add the marketplace, then install the plugin

Typed inside the agent's own prompt, not in a terminal. The marketplace is called firecrawl-workflows, which is the part after the @.

/plugin marketplace add firecrawl/firecrawl-workflows

/plugin install firecrawl-workflows@firecrawl-workflows

Open plugin page ↗

What's inside

Files included with this skill.

View on GitHub