FlowScope UX Flow Analyser

io.github.DavidNgugiv0.1.1Updated Oct 7, 2026

Turn YouTube product demos into structured UX flow reports, and compare demos side by side.

Overview

AI-generated overview

Turns YouTube product-demo videos into structured UX flow reports and lets an assistant compare several demos screen by screen.

What it does
Exposes the FlowScope UX-analysis pipeline as MCP tools. It downloads a YouTube demo, transcribes it, extracts and de-duplicates screenshots, describes each screen with a vision model, and synthesises a step-by-step UX flow. Tools cover health checks, listing stored videos, job status, fetching a finished report, retrieving a screen's screenshot, comparing videos, and starting, retrying, re-analysing or deleting analyses.
When to use it
Useful when you want an assistant to tear down a recorded onboarding, signup or checkout flow, answer specific questions about a demo's screens and states, or compare how two or three products handle the same flow. It is aimed at UX review work rather than general video handling.
Requirements
Runs locally over stdio via uvx (uv is the only prerequisite) and is a client of a separately running FlowScope backend, which needs ffmpeg, yt-dlp, a Python environment and an LLM provider key. Configure FLOWSCOPE_API_URL (default and optionally FLOWSCOPE_API_TOKEN, FLOWSCOPE_MAX_WAIT, FLOWSCOPE_HTTP_TIMEOUT and FLOWSCOPE_POLL_INTERVAL in the client's server configuration. A streamable-HTTP mode is also available.
Before you install
Analysis costs real money and takes minutes: each distinct screen triggers a vision call plus a synthesis call. FLOWSCOPE_API_TOKEN is a bearer secret, only needed behind an authenticating proxy. Some tools are destructive: flowscope_reanalyze_video discards derived results and flowscope_delete_video can delete media from disk. Re-submitting a URL while a job is running starts duplicate work; poll flowscope_job_status instead.

Installation

In SourceWeft

  1. Open FlowScope UX Flow Analyser in the dashboard and add it to a workspace.
  2. Enable the server for the chats that should use its tools.

Desktop only via STDIO. STDIO servers start a local process, so they need the SourceWeft desktop host.

Other MCP clients

Follow the launch instructions in the repository.

README

flowscope-mcp

[PyPI] [Python] [License: MIT] [CI] [release] [tag] [MCP Registry]

An MCP server that exposes the FlowScope UX-analysis pipeline to any LLM client. Speaks MCP protocol 2026-07-28 and ships two spec-portable Agent Skills.

bash
uvx flowscope-mcp        # stdio server; needs a local FlowScope backend

FlowScope takes a YouTube product-demo URL, downloads the video, transcribes it, extracts and de-duplicates screenshots of each distinct screen, describes every screen with a vision model, and synthesises a step-by-step UX flow. This package turns that pipeline into tools an agent can call.

Ask your agent something like:

Compare the onboarding flows in these two videos: <url> and <url>

Tear down the checkout UX in this demo: <url>

Requirements

This server is a client of a running FlowScope backend; it does not run the pipeline itself. Start the backend first:

bash
cd backenduvicorn app.main:app --port 8000

The backend needs ffmpeg, a Python environment with backend/requirements.txt, and one LLM provider key in backend/.env. The server's flowscope_health_check tool reports exactly which of these is missing, so you can ask your agent to check rather than guessing.

Install

As a Claude Code plugin

One step, and it brings the skills, the prompts, and the server registration:

bash
/plugin marketplace add DavidNgugi/flowscope/plugin install flowscope@flowscope

From PyPI

Nothing needs a permanent install — uvx runs it in a throwaway environment. uv is the only prerequisite (brew install uv):

bash
uvx flowscope-mcp                 # starts a stdio serveruvx flowscope-mcp --version       # confirm the published versionuvx [email protected]           # pin, when reproducibility matters

From a git URL or a local checkout

bash
uvx --from /absolute/path/to/flowscope/mcp flowscope-mcpuvx --from "git+https://github.com/DavidNgugi/flowscope.git@main#subdirectory=mcp" flowscope-mcp

Environment

VariableDefaultPurpose
FLOWSCOPE_API_URLhttp://127.0.0.1:8000Backend base URL. /api is appended if absent, so either form works.
FLOWSCOPE_API_TOKEN(empty)Sent as Authorization: Bearer …. Only needed behind an authenticating proxy.
FLOWSCOPE_HTTP_TIMEOUT30Seconds for ordinary requests.
FLOWSCOPE_MAX_WAIT900Default wait budget for flowscope_analyze_video.
FLOWSCOPE_POLL_INTERVAL5Seconds between job-status polls.

These are read from the process environment on each call. The MCP Python SDK v2 deliberately stopped reading MCP_* variables and .env files, so set them in your client's server configuration instead.

Point a harness at it

The config shapes genuinely differ — VS Code's own file uses servers where every other client uses mcpServers, Codex is TOML, and Claude Desktop does not expand ${VAR} placeholders — so generating the file is more reliable than copying a snippet:

bash
uvx --from flowscope-mcp flowscope-mcp-install --help   # every client + its pathuvx --from flowscope-mcp flowscope-mcp-install print    # portable JSON, writes nothing
uvx --from flowscope-mcp flowscope-mcp-install claude-codeuvx --from flowscope-mcp flowscope-mcp-install cursoruvx --from flowscope-mcp flowscope-mcp-install vscodeuvx --from flowscope-mcp flowscope-mcp-install codexuvx --from flowscope-mcp flowscope-mcp-install geminiuvx --from flowscope-mcp flowscope-mcp-install claude-desktop

It merges into an existing config file and leaves other servers alone.

HarnessFileKeySyntax
Claude Code.mcp.json, ~/.claude.jsonmcpServersJSON
Claude Desktopclaude_desktop_config.jsonmcpServersJSON
Cursor.cursor/mcp.json, ~/.cursor/mcp.jsonmcpServersJSON
VS Code.vscode/mcp.jsonserversJSON
Codex CLI~/.codex/config.toml[mcp_servers.flowscope]TOML
Gemini CLI~/.gemini/settings.jsonmcpServersJSON

VS Code additionally reads the portable <project>/.mcp.json shape (key mcpServers), which flowscope-mcp-install vscode-portable writes when you want one config shared with Claude Code and Cursor.

Remote / shared deployment

Run one server for several clients, or for a harness that cannot spawn a process:

bash
flowscope-mcp --transport streamable-http --host 127.0.0.1 --port 8765

Clients connect to POST http://127.0.0.1:8765/mcp:

bash
claude mcp add --transport http flowscope http://127.0.0.1:8765/mcp

docs/install.md has the full per-harness reference, the placeholder syntax each one accepts, and the two traps that most often break an install.

Use it

Restart your client, open a new chat, and check the install first:

Check whether FlowScope is ready to use.

That runs flowscope_health_check and names anything missing — usually ffmpeg or an LLM provider key on the backend host. Then ask for what you want.

Example prompts

One video, fully analysed

Tear down the onboarding UX in this demo: <youtube-url>

What does this product actually do, based on this demo? Walk me through the flow screen by screen: <youtube-url>

Analyse <youtube-url> and tell me where a first-time user would get stuck.

A specific question about a flow

In this demo, how many steps does signup take, and what does each one ask for? <youtube-url>

Does this demo show any error or empty states? <youtube-url>

What's above the fold on the first screen, and what's the primary call to action? <youtube-url>

Several videos, compared

Compare the onboarding flows in these two demos. Where do they diverge, and what's the trade-off each one makes?

  • <youtube-url-1>
  • <youtube-url-2>

I'm designing a checkout flow. What do these two demos do differently, and what should I borrow? <url1> <url2>

Which of these three gets a new user to first value fastest, judging by the demos? <url1> <url2> <url3>

Working with what already exists

What videos has FlowScope already analysed?

Show me the screenshot of the pricing screen from that report.

You do not need to phrase these carefully. Analyses are cached by YouTube video id, so a vague prompt costs a lookup rather than a re-analysis — the agent checks the cache before spending anything.

What happens after you press enter

Analysing a video downloads it, transcribes it, extracts and de-duplicates screenshots, then makes one vision call per distinct screen plus a synthesis call. A five-minute demo typically yields 15–40 screens. Expect 2–10 minutes and real money per video.

flowscope_analyze_video waits by default and usually returns the finished report directly, so one prompt is normally enough. If the video needs longer than the budget it returns status: "running" with a video_id, and the agent should poll flowscope_job_status. If it resubmits the URL instead, stop it — that starts duplicate work.

Answers are grounded, or should be

Reports have three layers: ux_insights (the synthesis), flow_steps (the ordered user path), and frames (the evidence — one entry per screen, with its purpose, UI elements, and aligned narration). A good answer leads with the insights and cites the screen behind each claim. The bundled skills enforce this, including saying "the demo does not show this" rather than inferring.

docs/usage.md has the full walkthrough, prompt patterns that produce better answers, and a troubleshooting table.

Tools

Ten tools, split between read-only inspection and actions that cost money.

ToolAnnotationsWhat it does
flowscope_health_checkread-onlyBackend up? ffmpeg, yt-dlp, provider key present?
flowscope_list_videosread-onlyEvery stored video with its latest job status.
flowscope_job_statusread-onlyProgress of one analysis job.
flowscope_get_reportread-onlyThe finished UX report: flow, insights, per-screen findings.
flowscope_frame_imageread-onlyThe actual screenshot for one screen, as an image.
flowscope_compare_videosopen-worldCross-video common patterns, divergences, stage matrix.
flowscope_analyze_videoopen-worldDownload and analyse one or more URLs. Costs money.
flowscope_retry_videoidempotentRe-queue a failed job; completed stages are reused.
flowscope_reanalyze_videodestructiveDiscard derived results and redo analysis.
flowscope_delete_videodestructiveRemove a video; optionally delete media from disk.

Plus two prompts (flowscope_ux_teardown, flowscope_compare_flows) and two resources (flowscope://videos, flowscope://videos/{video_id}/report).

Cost and time

Analysing a video downloads it, transcribes it, and makes one vision call per distinct screen plus a synthesis call. That is minutes and real money per video. Two things protect against waste:

  • Results are cached by YouTube video id. flowscope_list_videos reveals existing analyses, and resubmitting a finished video is free and instant.
  • flowscope_analyze_video checks the cache before starting work and only submits what is actually new.

The bundled skill teaches an agent to check the cache first.

Transports

bash
flowscope-mcp                                  # stdio (default)flowscope-mcp --transport streamable-http --port 8765

Streamable HTTP serves POST /mcp. The SDK serves the 2026-07-28 protocol revision and the older handshake era from the same endpoint, so legacy clients work without extra configuration. Legacy clients create server-side sessions, which are stored in-process — if you run more than one worker behind a load balancer, enable sticky routing.

Skills

Two Agent Skills ship alongside the server, written to the open specification so they install into any compatible client:

SkillUse it when
analyzing-product-demo-uxYou want a teardown of one recorded flow — how onboarding, signup, or checkout works, screen by screen.
comparing-product-demo-uxYou want several products compared: shared conventions, real divergences, and what is worth borrowing.

They carry the operational knowledge the tool descriptions cannot: check the health and the cache before spending money, read the synthesis rather than re-deriving it from the raw transcript, say "the demo does not show this" rather than inferring, and treat an auto-caption's product names with suspicion.

The skills and the server are independent — the skills are useful on a report you already have, and the server works without them.

Install them

With the plugin (Claude Code) — skills and server in one step:

bash
/plugin marketplace add DavidNgugi/flowscope/plugin install flowscope@flowscope

The portable directory, which most clients scan. .agents/skills/ is the cross-client project convention, so several harnesses pick it up from one copy:

bash
mkdir -p .agents/skills && cp -r skills/* .agents/skills/    # this projectmkdir -p ~/.agents/skills && cp -r skills/* ~/.agents/skills/ # every project

A client's own directory, when you want it only there:

bash
cp -r skills/* ~/.claude/skills/     # Claude Code, personal scopecp -r skills/* ~/.codex/skills/      # Codex CLIcp -r skills/* ~/.cursor/skills/     # Cursorcp -r skills/* .github/skills/       # VS Code / Copilotcp -r skills/* ~/.gemini/skills/     # Gemini CLI

With the skills CLI, for a team or one of ~80 agent targets:

bash
npx skills add DavidNgugi/flowscope
ClientProjectPersonal
Claude Code.claude/skills/~/.claude/skills/
Codex CLI.agents/skills/~/.codex/skills/
Cursor.agents/skills/, .cursor/skills/~/.cursor/skills/
VS Code / Copilot.github/skills/, .claude/skills/, .agents/skills/~/.copilot/skills/
Gemini CLI.gemini/skills/ or .agents/skills/~/.gemini/skills/
Zed, Cline.agents/skills/~/.agents/skills/

Verify a skill is portable with the official validator:

bash
pip install "git+https://github.com/agentskills/agentskills.git#subdirectory=skills-ref"skills-ref validate .agents/skills/analyzing-product-demo-ux# -> Valid skill: .agents/skills/analyzing-product-demo-ux

Both skills declare only the six fields the open specification defines, so they work unmodified in Claude Code, Claude Desktop, ChatGPT and Codex, Cursor, VS Code, Gemini CLI, Zed, Goose, OpenCode and the rest. A test enforces that.

docs/skills.md covers every route, the compatibility aliases each client reads, and how to use the skills without the MCP server at all.

Documentation

DocumentContents
docs/install.mdInstalling into each harness: config shapes, placeholder syntax, remote/HTTP setup, verification
docs/usage.mdExample prompts, what happens on each call, troubleshooting, getting better answers
docs/skills.mdInstalling the skills into each client, the directory matrix, and using them without the server
docs/server-internals.mdDesign rationale: annotations, error handling, protocol era, output shapes
docs/publishing.mdReleasing: tag or manual, versioning rules, one-time setup, recovery
docs/security.mdTool poisoning, data flow, and what a non-sandboxed server means

Releasing

Releases are automated and driven by version tags. .github/workflows/release.yml verifies everything, publishes to PyPI with trusted publishing, publishes to the MCP Registry, and creates a GitHub release with the wheel and sdist attached.

bash
cd mcp./.venv/bin/python scripts/version.py bump 0.2.0   # rewrites all five filescd ..git commit -am "release: v0.2.0" && git tag -a v0.2.0 -m "v0.2.0"git push && git push --tags

Publishing also runs on demand — Actions → Release MCP server — with a publish input that defaults to off, so the default manual run verifies and builds without publishing anything.

Six version declarations in five files must agree, and the MCP Registry requires the server and its package version to match. scripts/version.py is what keeps them in sync, because editing them by hand is how a release fails during publishing — and PyPI permanently refuses to reuse a version number, so a half-published release cannot be retried:

bash
python scripts/version.py show         # what every file currently sayspython scripts/version.py check        # fail if any disagree, including the tag

See docs/publishing.md for the full release process, version-numbering rules, the one-time PyPI configuration, and what to do when a release goes wrong.

Development

bash
cd mcppython3 -m venv .venv && ./.venv/bin/pip install -e ".[dev]"./.venv/bin/ruff check src tests scripts./.venv/bin/pytest -q

The suite is offline: tool behaviour runs against an in-memory MCP client and a mocked HTTP transport, so it needs neither a network nor a running backend. Separate tests spawn the real process to verify the stdio contract — that stdout carries only protocol frames — and validate the registry, plugin, and version metadata. The release workflow's triggers are pinned by tests too, so a future edit cannot make publishing automatic on a branch push.

Validate the skills and manifests against the official tooling:

bash
skills-ref validate skills/analyzing-product-demo-ux    # agentskills.io reference validatorclaude plugin validate .                                # marketplace manifestclaude plugin validate ./mcp --strict                   # plugin manifestpython scripts/validate_metadata.py                     # server.json + wheel contents

Licence

MIT

Source: mcp/README.md at commit 9273ea0

Tools

0
Tool metadata has not been indexed yet.

Version history

1
  1. v0.1.1LatestOct 7, 2026