# Flusterduck for developers: Sentry for UX friction

Canonical: https://flusterduck.com/developers

Behavioral instrumentation that catches rage clicks, dead clicks, form friction, and post-deploy regressions, turns them into ranked issues, and verifies your fixes. TypeScript-first, framework wrappers, MCP built in.

## Install

One script tag:

```html
<script src="https://flusterduck.com/d.js" data-key="fd_pub_..." data-dnt="false" async></script>
```

Or one package: `npm i flusterduck`, then `init({ key: 'fd_pub_...' })` once at startup. Framework wrappers: `@flusterduck/next`, `@flusterduck/react`, `@flusterduck/vue`, `@flusterduck/svelte`, `@flusterduck/nuxt`.

`data-dnt="false"` matters because the browser's DNT signal can drop 30-50% of visitors. We never read form values or user-typed text. Short element labels are PII-redacted before they leave the browser.

## What goes over the wire

What we capture:

- Clicks, taps, and the element selectors they land on
- Short element labels, capped and PII-redacted in the browser
- Scroll depth, hesitation, and timing patterns
- Navigation paths and back-and-forth loops
- Viewport size and browser class
- Deploy markers, so regressions get blamed correctly

What we never touch:

- Form values, passwords, or raw keystrokes
- User-typed text or arbitrary page copy
- Session replay or DOM recording
- Raw IP addresses (hashed at the edge)
- Third-party ad or cross-site cookies

## The signals

132 detectors run in the browser. These are the ones you'll meet first, each one a named, typed signal, not a blob of events:

- `rage_click`: same element hammered in rapid succession. Pure frustration.
- `dead_click`: a click on something that looks interactive and does nothing.
- `form_friction`: refills, corrections, and stalls inside a form field.
- `navigation_loop`: users bouncing between the same pages, hunting for something.
- `misclick`: taps that land just off-target, usually a tap-target problem.
- `deploy_regression`: confusion that climbed right after a deploy. We name the deploy.

## MCP: your AI tools, plugged in

`@flusterduck/mcp-server` exposes your friction data to Claude Desktop, Claude Code, or any MCP client. Ask "what's the worst issue on checkout this week?" and get the real answer. Bring your own Claude.

```json
{
  "mcpServers": {
    "flusterduck": {
      "command": "npx",
      "args": ["-y", "@flusterduck/mcp-server"],
      "env": {
        "FLUSTERDUCK_MCP_KEY": "fd_mcp_...",
        "FLUSTERDUCK_SITE_ID": "your-site-id"
      }
    }
  }
}
```

Start a 3-day trial: https://app.flusterduck.com · Docs: https://docs.flusterduck.com
