プロトタイプ · プレビュー版：公式レジストリのすべてのサーバーを掲載し、30分ごとに同期しています。レビューとアカウント機能は今後のステップで始まります。
PopNx MCPAIを使う人のためのMCPサーバー · やさしい言葉で解説
初心者モード オン
配色システムに合わせるライトダーク
言語ไทยEnglish中文日本語한국어EspañolDeutsch
☰ メニュー設定
初心者モード オン
配色システムに合わせるライトダーク
言語ไทยEnglish中文日本語한국어EspañolDeutsch

MotionLint

作者：bobaba99バージョン 0.2.1i★ –iパソコンで動く
レジストリ名io.github.bobaba99/motionlint

インストール

概要

作者による説明（英語の原文）

Catch bad animations before they ship. Deterministic motion audit + vision-LLM design review.

PopNx MCPの3つの柱

この3つを1つのスコアにまとめることはしません。意見、測定、人気はそれぞれ別のものだからです。

できること

このサーバーのやさしい解説はまだ書いていません。以下はレジストリから読み取った事実です。

  • 接続方法: パソコンで動く
  • トランスポート: stdio
  • カテゴリ: デザイン・画像・音声
  • 入力が必要なもの：ANTHROPIC_API_KEY, OPENAI_API_KEY, GOOGLE_API_KEY

インストール

使っているAIアプリを選んで、設定をコピーしてください。

インストールの前に

  • 基本チェック：1項目中1項目に合格
  • あなたのパソコンで、あなたのユーザーと同じ権限（ファイル、ネットワーク、アプリ）で動きます。
  • 自分で入力するもの： ANTHROPIC_API_KEY, OPENAI_API_KEY, GOOGLE_API_KEY, OPENAI_BASE_URL

「秘密」と表示された値は、あなたのアカウントの鍵です。絶対に人に教えたり、チャットに貼り付けたりしないでください。

必要なもの

  • npmNode.jsのインストール（npxコマンドに必要）

どのアプリを使っていますか？

上でアプリを選んでください。選んだアプリを覚えておくので、次からはボタンに「…にインストール」と表示されます。

Claude Desktop → Settings → Developer → Edit Config を開き、claude_desktop_config.json にこれを貼り付けます

{
  "mcpServers": {
    "motionlint": {
      "command": "npx",
      "args": [
        "-y",
        "motionlint",
        "mcp"
      ],
      "env": {
        "ANTHROPIC_API_KEY": "your-value",
        "OPENAI_API_KEY": "your-value",
        "GOOGLE_API_KEY": "your-value",
        "OPENAI_BASE_URL": "your-value"
      }
    }
  }
}

ターミナルでこれを実行します

claude mcp add motionlint --env ANTHROPIC_API_KEY=your-value --env OPENAI_API_KEY=your-value --env GOOGLE_API_KEY=your-value --env OPENAI_BASE_URL=your-value -- npx -y motionlint mcp

動かす前に、空欄の値を入力してください。

Cursorで開く

または、設定を自分でコピーする

プロジェクトの .cursor/mcp.json、または ~/.cursor/mcp.json に貼り付けます

{
  "mcpServers": {
    "motionlint": {
      "command": "npx",
      "args": [
        "-y",
        "motionlint",
        "mcp"
      ],
      "env": {
        "ANTHROPIC_API_KEY": "your-value",
        "OPENAI_API_KEY": "your-value",
        "GOOGLE_API_KEY": "your-value",
        "OPENAI_BASE_URL": "your-value"
      }
    }
  }
}

ブラウザがアプリを開いてよいか確認し、そのあとアプリが設定を表示して確認を求めます。キーの値は空欄のままなので、自分で入力してください。

VS Codeで開く

または、設定を自分でコピーする

プロジェクトの .vscode/mcp.json に貼り付けます

{
  "servers": {
    "motionlint": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "motionlint",
        "mcp"
      ],
      "env": {
        "ANTHROPIC_API_KEY": "your-value",
        "OPENAI_API_KEY": "your-value",
        "GOOGLE_API_KEY": "your-value",
        "OPENAI_BASE_URL": "your-value"
      }
    }
  }
}

ブラウザがアプリを開いてよいか確認し、そのあとアプリが設定を表示して確認を求めます。キーの値は空欄のままなので、自分で入力してください。

これはパソコンで動くサーバーですが、ChatGPTがつなげるのはインターネット上のサーバーだけです。ほかのアプリを選んでください。

選んだアプリは、この端末のCookieに保存されます。アカウントは不要です。

自分で入力する値

  • ANTHROPIC_API_KEY 秘密 env
    Anthropic API key for vision-LLM review. Optional — the deterministic audit needs no key, and Ollama, OpenAI or Google can be used instead.
  • OPENAI_API_KEY 秘密 env
    OpenAI API key for vision-LLM review. Optional.
  • GOOGLE_API_KEY 秘密 env
    Google API key for vision-LLM review. Optional.
  • OPENAI_BASE_URL env
    Override the OpenAI base URL to target an OpenAI-compatible endpoint. Optional.

この設定は、作者のレジストリ登録情報から作成しています。READMEと違う場合は、READMEに従ってください。

できること

パソコンで動くサーバーです。インストールすると、ツール一覧がAIアプリに表示されます。

基本チェックi

誰でも見られる情報をチェックしており、コードは読んでいません。当てはまらない項目は数に入れていません。 · 2026年11月7日にチェック

  • ✓ 合格

    作者とリポジトリが一致

    レジストリ名は、リポジトリを所有するGitHubアカウント bobaba99 で確認済みです

  • … 未チェック

    今もメンテナンスされている

    このリポジトリはまだGitHubから読み取っていません

  • … 未チェック

    ライセンスがある

    このリポジトリはまだGitHubから読み取っていません

  • – 対象外

    エンドポイントが応答する

    これはパソコンで動くため、インターネット上のエンドポイントはありません

  • – 対象外

    OAuthでサインイン

    パソコンで動き、代わりにローカルの設定を使います

  • … 未チェック

    ツールの説明に隠れた指示がない

    パソコンで動くサーバーです。ツール一覧を読み取れるのは、インターネット上のエンドポイントがある場合だけです

デザイン・画像・音声のほかのサーバーとの比較i

  • このカテゴリのほかの2187件のうち0%よりスターが多い
  • このカテゴリのほかの2187件のうち18%より最近レジストリに公開
  • 基本チェックの結果が、このカテゴリのほかの2187件のうち100%と同じかそれ以上

レジストリでこのカテゴリにある有効なすべてのサーバーと比較しています。スターは、公開者がリポジトリの所有者である場合だけ数えます。

よくある質問

MotionLintは安全ですか？

当てはまる基本チェック1項目のうち1項目に合格しました。コードは読んでいません。キーやトークンを追加する前に、サーバーがどんなアクセスを求めているかを確認し、必要な権限だけを持つキーを使ってください。

どんなキーやコードが必要ですか？

入力が必要なもの：ANTHROPIC_API_KEY, OPENAI_API_KEY, GOOGLE_API_KEY

パソコンで動きますか、それともクラウドですか？

あなたのパソコンで動きます。必要なときにAIアプリが起動し、データは作者のサーバーを通りません（サーバー自体がオンラインサービスを呼び出す場合を除きます）。

今もメンテナンスされていますか？

GitHubリポジトリの最終更新は–、最新バージョン（0.2.1）がレジストリに届いたのは3 か月前です。

どのアプリで使えますか？

Claude Desktop、Claude Code、Cursor、VS CodeなどのMCP対応アプリで使えます。パソコンにNode.jsも必要です。

代わりに使えるものは？

同じカテゴリには：Figma Context MCP, Claude Real Video, Figma MCP Server

代わりの候補

同じカテゴリで、ほかの作者が作ったサーバー。スターの多い順。

カードの見方：★ GitHubスターi3つの柱：レビュー · チェック · 利用状況i更新＝最新バージョンをレジストリに公開した日i

Figma Context MCP

作者：GLips

Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.

パソコンで動く★ 16,165MIT5 か月前更新
インストール

Claude Real Video

作者：HUANGCHIHHUNGLeo

Let any LLM watch a video locally — and search everything it has ever watched.

パソコンで動く★ 2,284MIT2 か月前更新
インストール

Figma MCP Server

作者：figma

The Figma MCP server brings Figma design context directly into your AI workflow.

クラウドで動く★ 2,15213 か月前更新
インストール

作者のREADME

READMEを開く

作者のリポジトリから書かれたとおりにコピーしたものです。PopNx MCPは内容を確認・推奨していません。HTML、画像、スクリプトは取り除いています。リンクはこのサイトの外へ移動します。

MotionLint

Score any page's animation quality in one command. No API key, no config.

npx motionlint audit http://localhost:3000 --open

Deterministic — measured from the live page, no LLM involved. One-time prerequisite: npx playwright install chromium .

MotionLint measures the motion your app actually ships — durations, easing curves, stagger intervals, exit timing, reduced-motion support — and scores it against a published set of animation standards. Ease-in on a dropdown, a 600ms modal, a card that scales from 0, hover motion that fires on touch: all caught, all with the measured value and a concrete fix.

The audit is free and offline. Add an API key and MotionLint also does vision-LLM design review — multi-viewport screenshots and 50ms frame bursts of real user journeys, judged by a model and handed back to your coding agent as ranked findings. It runs as an MCP server inside Claude Code and Cursor.

Why this exists

AI coding agents read JSX, HTML, and CSS — they're blind to what the user actually sees, clicks, and watches animate. Rules in a prompt tell the agent what *should* happen; nothing checks what *did*. Modals that should slide in just pop; loading states get omitted; focus rings disappear. Code review can't catch any of this before merge, because none of it is visible in the diff.

MotionLint closes that loop: it measures the running app and feeds the verdict back.

How it's different

MotionLintVisual regression tools (Percy, Chromatic, Playwright snapshots)AI design generators (v0, Galileo, Claude Design, Stitch)
Deterministic motion audit13 checks, measured from the live page — no API key, $0✗✗
Multi-viewport UX reviewranked findings across 12 dimensionspixel diffs onlygenerates new layouts from prompts
Animation review50ms frame bursts via CDP screencast → contact sheet → LLM✗✗
Live animation tuningShadow-DOM previews + sliders + Claude Code export✗generates new motion, doesn't tune what's there
Native MCP server✓ stdio MCP for Claude Code / Cursor✗varies
CI gate✓ SARIF + exit codes for code scanning✓ image diff thresholds✗
Validated quality100% recall on a 24-fixture stress test, across 5 frontier modelsn/an/a

The conceptual gap MotionLint closes: visual-regression tools catch what *changed* but not whether the new pixels are *good*; AI design tools generate from scratch but don't review what's already running. MotionLint reviews live behavior with a vision LLM and feeds the verdict back into the coding loop.

Start here — no API key needed

npx playwright install chromium          # one-time per machine (~300MB)

npx motionlint audit http://localhost:3000 --open

That's the whole setup for the audit. It's deterministic, runs offline, costs nothing, and works on any URL you can load — your dev server, a staging deploy, or someone else's site. Requires Node 18+.

The rules it checks are published in docs/STANDARDS.md — read them before you install anything.

Then: LLM design review

Set one API key (ANTHROPIC_API_KEY, OPENAI_API_KEY, or GOOGLE_API_KEY — or run Ollama locally for free) and three more commands unlock:

npm install -g motionlint

Multi-viewport UX review of a page → ranked findings across 12 dimensions.

motionlint review http://localhost:3000

Animation review of a scripted user journey → frame contact sheet + report.

motionlint flow --spec flows/signup.json

Interactive HTML tuner — every animation on the page, with live sliders.

motionlint tune http://localhost:3000

Inside Claude Code / Cursor
claude mcp add motionlint -- npx -y motionlint mcp

Full flag surface — CI gates, route discovery, Storybook, dark mode, baselines

# CI mode — non-zero exit on critical issues, SARIF output for code scanning.

motionlint review https://staging.acme.dev --ci --threshold critical --format sarif -o ux.sarif

Polished, shareable HTML review with embedded screenshots + before/after fixes.

motionlint review http://localhost:3000 --format html -o review.html

Review every route the site knows about (sitemap.xml + Next.js app/ directory).

motionlint review http://localhost:3000 --discover-routes

Storybook mode — discover stories from /index.json, review each story iframe as its own route.

motionlint review http://localhost:6006 --storybook

Color-scheme sweep — light and dark modes, plus Windows High Contrast.

motionlint review http://localhost:3000 --schemes --forced-colors --format html -o review.html

Interaction affordances — grid each element's default/hover/focus/active states.

motionlint review http://localhost:3000 --state-grid

Agent focus — keep only the top 5 findings, and only ones not seen in prior runs.

motionlint review http://localhost:3000 --max-findings 5 --new-only

Before/after comparison — PR preview vs. production baseline.

motionlint review https://pr-123.preview.example.com --against https://prod.example.com

Reviewer focus — cap the SARIF upload at 10 annotations per report.

motionlint review https://staging.acme.dev --format sarif -o ux.sarif --max-pr-annotations 10

Pick a provider explicitly (auto-detect picks the first reachable one).

motionlint review http://localhost:3000 --provider anthropic --model claude-sonnet-5

Track provider quality across runs + teach the reviewer from eval misses.

motionlint eval --provider anthropic --evolve

Package on npm: motionlint.

Sample terminal output for a flow review:

$ motionlint flow --spec flows/signup.json --provider anthropic

→ Running flow "signup-happy-path" against http://localhost:3000/signup (11 steps, 50ms intervals × 750ms window) provider: anthropic (claude-sonnet-5) capturing flow… ✓ step 1: 16 frames ✓ step 2: 16 frames ✓ step 3: 16 frames … captured 176 frames in 31s contact sheet → .motionlint/flows/signup-happy-path-…png analyzing flow… report → .motionlint/flows/signup-happy-path.md

Score: 4/10 · 3 critical findings [critical] interaction — input focus rings missing across steps 2/4/6 [critical] interaction — submit button has no pressed state [critical] loading_state — 1.4s wait with no spinner during submit

Try the demo

A multi-route TS animation showcase ships in demo/ — covering Motion One, GSAP, anime.js, @formkit/auto-animate, and lottie-web — including a cat-themed one-pager that exercises every MotionLint capability in a single URL:

node demo/server.mjs                                # http://localhost:4173

motionlint review http://localhost:4173/cat --record --embed motionlint flow --spec flows/signup.json motionlint tune http://localhost:4173/dashboard

Routes available: /, /pricing, /signup, /dashboard, /loading, /cat. Reports go to .motionlint/reports/, screenshots to .motionlint/screenshots/, videos to .motionlint/videos/.

Setup

API keys

MotionLint auto-loads a .env file from the working directory at startup:

# .env (gitignored)

ANTHROPIC_API_KEY=sk-ant-...

or

OPENAI_API_KEY=sk-...

or

GOOGLE_API_KEY=...

or run a local Ollama (no key needed) — auto-detected on http://localhost:11434

Real environment variables take precedence over .env. With no key set and no Ollama running, MotionLint falls back to a deterministic mock provider so the full pipeline (capture → analysis → report) still runs end-to-end for smoke tests.

Provider auto-detect

MotionLint auto-detects in this order: Ollama (local) → Anthropic → OpenAI → Google. The first one with a working API key (or running service) wins. Override with --provider and --model . See Providers in depth for the per-provider quality scorecard and how to pick.

*Everything below is for readers who want to understand how MotionLint works under the hood, pick the right provider for their workflow, or wire it into CI.*

Validated quality across providers

The flow-review pipeline was stress-tested across 12 popular web-app animation patterns × 2 variants (24 fixtures total) — staggered entrances, hover/press/focus, modal entrances, loading skeletons, form errors, toasts, counter ramps, multi-animation dashboards, modal-with-content stagger, rich form feedback (focus + press + spinner + success), and scroll-driven animations (progress bar + IntersectionObserver reveal + parallax).

Run on 2026-07-27 against the current flagship from each major provider:

Provider · modelRecall (broken caught)FPR (clean flagged)Score gapWall time
OpenAI · gpt-5.6-sol100% (12/12)0% (0/12)+3.310.9 min
OpenAI · gpt-5.5100% (12/12)0% (0/12)+3.311.5 min
Anthropic · claude-opus-5100% (12/12)8% (1/12)+4.121.0 min
Google · gemini-3.6-flash100% (12/12)17% (2/12)+5.14.9 min
Anthropic · claude-sonnet-5100% (12/12)33% (4/12)+3.110.8 min

Read this as: recall is no longer a differentiator. Every current flagship catches all 12 seeded faults. That is the finding — a year ago it wasn't true, and it means the model choice no longer decides whether MotionLint works. Pick on cost and latency.

Do not rank these models on the FPR column. A single 24-fixture run cannot resolve it. Across two clean runs of the identical suite, with nothing changed but sampling, FPR moved by 1–2 fixtures per model — gpt-5.5 1/12 → 0/12, gpt-5.6-sol 2/12 → 0/12, gemini-3.6-flash 3/12 → 2/12. One fixture is 8 percentage points, so the entire spread between "0%" and "17%" sits inside the noise floor. Treat the column as *"all of these occasionally flag something clean"*, not as a ranking.

Why the older numbers in this table's history were wrong

The first 2026-07-27 run of this suite put claude-opus-5 at 83% recall — last among all five models — and the 2026-04-29 edition of this table reported several models at 0% FPR. Both were artifacts of a MotionLint bug, not model behaviour.

Anthropic's max_tokens defaulted to 4096. Verbose responses hit the ceiling mid-JSON, and the unparseable result was scored as 0/10, no issues found — indistinguishable from a clean review. Two of Opus 5's three truncations landed on broken fixtures, which produced the entire 83% figure.

The same bug deflated FPR everywhere: a truncated review reports *nothing*, so it cannot raise a false positive. Any historical "0% FPR" was partly measuring broken parsing rather than model precision. Fixed 2026-07-27, along with the sibling paths that turned truncated, refused, and safety-blocked responses into clean-looking results.

Full per-provider scorecards in .motionlint/stress/ after running scripts/run-all-benchmarks.mjs. Use --only : to re-run a single model.

Providers in depth

ProviderModelSetupQuality (24 fixtures)Cost per review¹

| google | gemini-3.6-flash | `GOOGLE_API

冒頭だけを表示しています。続きはリポジトリで読めます

PopNxに聞く