interactive-demo

Create and execute interactive web app demos with persona-based walkthroughs.

Updated Aug 23, 2026
One-click install
npx skills add https://github.com/adamway/thoughts-cli --skill interactive-demo
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: interactive-demo
Source: https://github.com/adamway/thoughts-cli/tree/main/.claude/skills/interactive-demo
Command: npx skills add https://github.com/adamway/thoughts-cli --skill interactive-demo

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) and assets/demo-profile.example.json (resource) components.

What problem does it solve?

This Skill enables users to create detailed, step-by-step demonstrations of web features in a real browser, allowing manual inspection and validation.

Core Features & Use Cases

  • Guided UI walkthroughs: Automatically build storyboards based on artifact inputs and execute browser actions with user-interactive prompts.
  • Scenario exploration: Walk through features anchored to PRDs, plans, research, or gaps, with persona-aware context.
  • Verification & debugging: Pause after each step for user confirmation, enabling precise validation of web app behavior in development.
  • Use Case: A developer validating a new login flow can generate a demo that logs in as multiple personas, exercises UI steps, and records the outcomes for review.

Quick Start

Provide a draft artifact path, then run /interactive-demo in Claude to initiate the guided browser demo, optionally specifying input paths as arguments.

Frequently Asked Questions about interactive-demo

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I automate interactive UI walkthroughs for web app validation?

You can automate interactive UI walkthroughs by providing artifact paths to generate persona-based storyboards, executing browser actions with stepwise user prompts for manual inspection. This allows precise validation of web app behavior during development.

Do I need Playwright MCP setup to run guided browser demos?

Yes, you need Playwright MCP setup and local dev server access to run guided browser demos. These prerequisites provide the real browser environment required to execute interactive web app feature demonstrations and stepwise validations.

Can I use artifact inputs like PRDs to generate scenario exploration demos?

Yes, you can use artifact inputs like PRDs, plans, research, or gaps to generate scenario exploration demos. The walkthroughs are anchored to these artifacts and support persona-aware context for development, review, and training purposes.

What is the best way to verify a new web app login flow across multiple personas?

The best way to verify a new login flow is to generate a demo that logs in as multiple personas, exercises UI steps, and records outcomes for review. The Skill pauses after each step for your confirmation during validation.

How do I step through web app features interactively in a real browser environment?

You step through web app features by running the demo command in Claude with a draft artifact path. The Skill guides you through persona-based walkthroughs within a real browser environment, pausing after each step for user confirmation.

Are there limitations when using interactive demos for dev validation?

A key limitation is the dependency on a running local dev server and Playwright MCP setup. Without local dev server access, the Skill cannot execute the real browser environment required for interactive web app feature verification.