japan-ux

japan-ux-mcp

Japan Design — AI コーディングエージェント向けの UI + UX の正確性。 フロントエンドの強制チェッカーです。実際の CSS／マークアップを渡すと、日本の標準に照らして UI を評価します。タイポグラフィ（禁則処理、行の高さ、フォント）、色の象徴性、フォントのパフォーマンスを、W3C JLReq／JIS X 4051 の引用と修正案とともに確認します。さらに、フォーム（姓名／ふりがな）、敬語、信頼性を高める要素、法務、季節のデザインを含む UX の全領域にも対応します。

主要ツール：review_jp_ui — フロントエンドの正確性を強制的にチェックします（日本向けに公開する前に、西洋の設計で作られたものも含め、あらゆる UI に対して実行できます）。

11 個のツール、10 個のプロンプト、9 個のリソースを提供します。ローカルで動作し、API キーは不要です。検出結果は仕様（JLReq／JIS）と慣例（文書化された日本のウェブ慣行）に分類されるため、根拠の権威性を誇張しません。

インストール

claude mcp add japan-ux -- npx -y japan-ux-mcp

JSON 設定

サーバー設定はすべてのクライアントで共通で、ファイルパスのみが異なります。

{
  "mcpServers": {
    "japan-ux": { "command": "npx", "args": ["-y", "japan-ux-mcp"] }
  }
}

{
  "mcpServers": {
    "japan-ux": { "command": "npx", "args": ["-y", "japan-ux-mcp"] }
  }
}

{
  "mcpServers": {
    "japan-ux": { "command": "npx", "args": ["-y", "japan-ux-mcp"] }
  }
}

{
  "servers": {
    "japan-ux": { "type": "stdio", "command": "npx", "args": ["-y", "japan-ux-mcp"] }
  }
}

{
  "mcpServers": {
    "japan-ux": { "command": "npx", "args": ["-y", "japan-ux-mcp"] }
  }
}

{
  "mcpServers": {
    "japan-ux": { "command": "npx", "args": ["-y", "japan-ux-mcp"] }
  }
}

{
  "context_servers": {
    "japan-ux": { "command": { "path": "npx", "args": ["-y", "japan-ux-mcp"] } }
  }
}

ソースからインストール

git clone https://github.com/mrslbt/japan-ux-mcp.git
cd japan-ux-mcp
npm install && npm run build

クライアント設定で、ビルド済みのエントリを指定します。

{ "command": "node", "args": ["/absolute/path/to/japan-ux-mcp/dist/index.js"] }

ツール

プロンプト

リソース

プロンプトの例

Build a registration form for a Japanese B2B SaaS product. Include name,
email, phone, company, and address. Use TSX with Tailwind.

Audit this form for Japanese conventions:
<form>
  <input name="firstName" placeholder="First Name" />
  <input name="lastName" placeholder="Last Name" />
  <input name="email" />
  <input name="phone" />
  <button>Submit</button>
</form>

Transform this form for the Japanese market (fintech context):
<form>
  <label>First Name <input name="firstName" /></label>
  <label>Last Name <input name="lastName" /></label>
  <label>Phone <input name="phone" /></label>
  <label>Address <input name="address" /></label>
  <button type="submit">Submit</button>
</form>

I need Japanese UI copy for a banking app:
- Error: "Invalid email address"
- Button: "Submit application"
- Empty state: "No transactions yet"
- Confirmation: "Are you sure you want to delete?"

Check this CSS for Japanese typography issues:
body { font-family: Arial; font-size: 14px; line-height: 1.4; font-style: italic; }

Run a Japanese UX audit on this B2B SaaS landing page. Hero with English
tagline, feature grid, pricing table, no phone number in header, no
company info page, single-column layout.

同梱データ

すべてのデータはパッケージに含まれています。外部 API、キー、ネットワーク呼び出しは不要です。

対応する慣習

フォームと入力

Typography

Layout and structure

Trust and legal

Visual and color

Seasonal

Client support

日本語

日本のWeb UX慣習のためのMCPサーバーです。姓名順、フリガナ、3分割電話番号、〒住所フロー、敬語レベル、タイポグラフィ、信頼シグナル、特定商取引法などの法要件、季節デザインをツール・プロンプト・リソースとして提供します。

Claude Code、Cursor、Windsurf など MCP 対応クライアントで動作します。ローカル動作、APIキー不要。

Disclaimer

This server returns guidance, style rules, and cultural context for building Japanese-facing products. It does not call any brand's API or act on a brand's behalf. Company and service names that appear in examples or recommendations (banks, mobile carriers, payment services, delivery companies, etc.) are referenced as cultural context for users in Japan, not as endorsements or affiliations. All trademarks belong to their respective owners.

License

MIT

More MCPs

Built by Marsel Bait in Tokyo