japan-ux-mcp

Японские UX-конвенции в качестве MCP-сервера. Работает с Claude Code, Cursor, Windsurf, VS Code (Copilot), Claude Desktop, Cline, Zed и любым другим MCP-совместимым клиентом.

Ваш ИИ перестанет генерировать формы по западным стандартам и начнет создавать правильный японский интерфейс: корректный порядок имен, фуригана, 3-польные номера телефонов, автозаполнение почтового индекса, кэйго с нужным уровнем вежливости.

6 инструментов · 6 промптов · 4 ресурса · без API-ключей

Зачем это нужно

ИИ по умолчанию генерирует западный UX. Если вы создаете продукт для Японии, вы знаете, что происходит:

• Имя / Фамилия вместо 姓 / 名 с фуриганой

• Одно поле для телефона вместо стандартного разделения на три поля

• ДД/ММ/ГГГГ вместо 年月日 с поддержкой японских эр

• Плоские поля адреса вместо каскадного ввода по почтовому индексу 〒

• Грубые сообщения об ошибках там, где ожидается кэйго

• "John Smith" в качестве текста-заполнителя (плейсхолдера)

Вы можете исправлять это каждый раз или установить это один раз.

Related MCP server: xendit-mcp

Установка

Установка одной командой

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

Перезапустите Claude Code после выполнения этой команды.

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"]
    }
  }
}

Вы также можете добавить его в свои пользовательские настройки (settings.json) в разделе mcp.servers, чтобы сделать его доступным во всех проектах.

Откройте панель настроек MCP в Cline и добавьте:

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

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

Расположение файла конфигурации:

• macOS: ~/Library/Application Support/Claude/claude_desktop_config.json

• Windows: %APPDATA%\Claude\claude_desktop_config.json

{
  "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"]
}

Инструменты

Они вызываются автоматически, когда ИИ распознает контекст японского UX. Вам не нужно ссылаться на них по имени.

Промпты

Шаблоны промптов, которые можно вызывать из любого MCP-клиента, поддерживающего их.

Ресурсы

Справочные данные, к которым ваш ИИ может обращаться во время сессии.

До / после

Без этого MCP:

You: "Build a registration form"
AI:  <input name="firstName" placeholder="First Name" />
     <input name="phone" />
     <button>Submit</button>
You: "No, Japanese style..." → 30 min of back and forth

С этим MCP:

You: "Build a registration form for a Japanese ecommerce site"
AI:  [calls generate_jp_form]
     姓/名 + furigana, 〒 postal, 3-field phone,
     年月日 dates, "ご購入手続きへ" button

Примеры промптов

Они работают в любом MCP-клиенте. Скопируйте, вставьте и используйте.

Создать форму

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"
- Error: "Session expired"
- Button: "Submit application"
- Empty state: "No transactions yet"
- Confirmation: "Are you sure you want to delete?"

Сгенерировать тестовые данные

Generate 10 Japanese user profiles for a prototype.
Mixed gender, ages 25-45. Include full address and company.

Оценить страницу

Score this checkout page for Japan-readiness:
Single name field, email, one phone field, US-style address,
"Buy Now" button, no company info in footer, no privacy policy.

Получить рекомендации по дизайну

I'm designing a luxury ryokan booking site for Japanese domestic travelers.
What design direction should I take? Keigo level, colors, typography, trust signals.

Что входит в комплект

Все работает локально. Никаких внешних API, ключей или сетевых запросов.

Охваченные японские конвенции

Кто это использует

Разработчики за пределами Японии, которые создают продукты для японского рынка и устали вручную исправлять каждую форму, метку и сообщение об ошибке.

Японские компании, чьи ИИ-инструменты продолжают использовать западные шаблоны, даже если продукт полностью на японском языке.

Команды локализации. Перевод дает примерно 30% результата. Остальные 70% — это структура: порядок полей, разделение телефона, каскады почтовых индексов, уровни кэйго. Это именно то, что покрывает данный инструмент.

Дизайнеры, которые работают с ИИ и хотят иметь японские паттерны под рукой с самого начала, не объясняя их каждую сессию.

Работает с

Дорожная карта

• [x] 6 основных инструментов: формы, валидация, плейсхолдеры, кэйго, оценка, трансформация

• [x] MCP-промпты и ресурсы

• [ ] Сезонный контекст и культурный аудит

• [ ] Проверка типографики для смешанного японско-английского текста

• [ ] База данных справочных сайтов по бизнес-вертикалям

• [ ] Матрица дизайнерских решений

• [ ] Форматировщик адресов с API почтовых индексов

• [ ] Проверки доступности по JIS X 8341

• [ ] Паттерны, предложенные сообществом

Документация

Лицензия

MIT

Создано Marsel Bait в Токио