Skip to main content
Glama

japan-ux-mcp

Convenciones de UX japonesa como un servidor MCP. Funciona con Claude Code, Cursor, Windsurf, VS Code (Copilot), Claude Desktop, Cline, Zed y cualquier otro cliente compatible con MCP.

Tu IA deja de generar formularios con valores predeterminados occidentales y comienza a producir una interfaz de usuario japonesa correcta: orden de nombres adecuado, furigana, números de teléfono de 3 campos, autorrelleno de código postal, keigo en el nivel de cortesía correcto.

6 herramientas · 6 prompts · 4 recursos · sin claves API


Por qué existe esto

La IA genera UX occidental por defecto. Si estás creando para Japón, sabes lo que sucede:

  • Nombre / Apellido en lugar de 姓 / 名 con furigana

  • Una entrada de teléfono en lugar de la división estándar de tres campos

  • MM/DD/AAAA en lugar de 年月日 con soporte para eras

  • Campos de dirección planos en lugar de la cascada de código postal

  • Mensajes de error bruscos donde se espera keigo

  • "John Smith" como texto de marcador de posición

Puedes corregirlo cada vez, o instalar esto una vez.


Related MCP server: xendit-mcp

Instalación

Instalación en una línea

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

Reinicia Claude Code después de ejecutar esto.

Configuración JSON

Elige tu cliente. La configuración del servidor es la misma en todas partes.

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

También puedes añadirlo a tus Ajustes de Usuario (settings.json) bajo mcp.servers para que esté disponible en todos los proyectos.

Abre el panel de ajustes de MCP de Cline y añade:

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

Ubicación del archivo de configuración:

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

Desde el código fuente

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

Luego apunta la configuración de tu cliente al archivo compilado:

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

Herramientas

Estas se llaman automáticamente cuando la IA reconoce un contexto de UX japonesa. No necesitas hacer referencia a ellas por su nombre.

Herramienta

Qué hace

generate_jp_form

Genera marcado de formulario japonés: orden de nombres 姓/名, furigana, autorrelleno de código postal 〒, teléfono de 3 campos, fechas 年月日

validate_jp_form

Comprueba formularios existentes frente a las convenciones japonesas. Devuelve una puntuación de 0-100 con problemas, gravedad y correcciones de código

generate_jp_placeholder

Crea datos de prueba: nombres en kanji/katakana/romaji, códigos postales reales, números de teléfono formateados, fechas de era

suggest_keigo_level

Toma texto de interfaz en inglés y devuelve japonés en el nivel de cortesía adecuado para el contexto empresarial

score_japan_readiness

Evalúa una página en 5 categorías: formularios, textos, señales de confianza, tipografía, ajuste cultural

transform_for_japan

Reescribe el marcado occidental para que esté listo para Japón. Muestra la puntuación antes/después, explica cada cambio


Prompts

Plantillas de prompts que puedes llamar desde cualquier cliente MCP que las soporte.

Prompt

Qué hace

japan_form

Guía a través de la creación de un formulario japonés

japan_audit

Audita el marcado pegado en busca de problemas de UX japonesa

japan_transform

Transforma el marcado occidental con puntuación antes/después

japan_testdata

Genera datos de prueba japoneses para prototipos

japan_keigo

Obtén el nivel de cortesía adecuado para el texto de la interfaz

japan_score

Puntúa una descripción de página por su preparación para Japón


Recursos

Datos de referencia a los que tu IA puede acceder durante una sesión.

Recurso

Contenido

keigo-guide

4 niveles de cortesía en 8 contextos empresariales, más de 30 patrones de texto de interfaz

form-checklist

Lista de verificación de convenciones de formularios japoneses para revisión antes del lanzamiento

phone-formats

Patrones de móvil, fijo, gratuito, teléfono IP con reglas de división de campos

era-calendar

令和 hasta 明治 con rangos de fechas y fórmulas de conversión


Antes / después

Sin este 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

Con este MCP:

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

Ejemplos de prompts

Estos funcionan en cualquier cliente MCP. Copia, pega y listo.

Crear un formulario

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

Auditar un formulario existente

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>

Transformar de occidental a japonés

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>

Keigo para texto de interfaz

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?"

Generar datos de prueba

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

Puntuar una página

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.

Obtener dirección de diseño

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

Qué incluye

Todo se ejecuta localmente. Sin APIs externas, sin claves, sin llamadas de red.

Datos

Cantidad

Detalles

Prefecturas

47

Código, nombre, kana, romaji, región

Nombres

100

50 apellidos + 50 nombres propios en kanji/kana/romaji

Direcciones

12

Códigos postales reales en ciudades principales

Formatos de teléfono

6

Móvil, fijo, gratuito, IP, Navi Dial

Eras

5

令和 hasta 明治 con fechas de inicio/fin

Patrones de Keigo

30

Cadenas de interfaz en 4 niveles de cortesía en 9 tipos de elementos

Reglas de ancho

6

Validación de ancho completo/medio por tipo de campo

Utilidades de conversión

4

012→012, @→@, Gregoriano→era, era→Gregoriano


Convenciones japonesas cubiertas

Convención

Qué significa en la práctica

Orden de nombres

Apellido (姓) primero, nombre (名) segundo

Furigana

Campos de lectura en katakana (セイ/メイ) debajo de cada entrada de nombre

Teléfono

3 campos separados. Patrón: XXX-XXXX-XXXX

Dirección

El código postal 〒 autorrellena prefectura + ciudad. Orden de mayor a menor

Fechas

Entradas separadas de 年/月/日 con visualización opcional de era (令和6年 = 2024)

Keigo

4 niveles de cortesía mapeados a 8 contextos empresariales

Ancho de carácter

Conversión automática de dígitos y símbolos de ancho completo a medio al ingresar

Señales de confianza

Página de divulgación de la Ley de Transacciones Comerciales Especificadas, información de la empresa, número de teléfono en el encabezado

Etiquetas de campo

必須 (obligatorio, insignia roja) y 任意 (opcional)

Confirmación

Pantalla de revisión de confirmación antes del envío final


Quién usa esto

Desarrolladores fuera de Japón que están creando productos orientados al mercado japonés y están cansados de corregir manualmente cada formulario, etiqueta y mensaje de error.

Empresas japonesas cuyas herramientas de IA siguen usando patrones occidentales por defecto, aunque el producto esté completamente en japonés.

Equipos de localización. La traducción te lleva quizás al 30% del camino. El otro 70% es estructural: orden de campos, división de teléfonos, cascadas postales, niveles de keigo. Eso es lo que esto cubre.

Diseñadores que construyen con IA y quieren patrones japoneses disponibles desde el principio sin tener que explicarlos en cada sesión.


Funciona con

Cliente

Soporte

Claude Code

Completo (herramientas, prompts, recursos)

Cursor

Completo

Windsurf

Completo

VS Code (GitHub Copilot)

Completo

Cline

Completo

Claude Desktop

Completo

Zed

Herramientas y recursos

Cualquier cliente MCP stdio

Completo


Hoja de ruta

  • [x] 6 herramientas principales: formularios, validación, marcadores de posición, keigo, puntuación, transformación

  • [x] Prompts y recursos MCP

  • [ ] Contexto estacional y auditoría cultural

  • [ ] Comprobador de tipografía para texto mixto JP/EN

  • [ ] Base de datos de sitios de referencia por sector empresarial

  • [ ] Matriz de dirección de diseño

  • [ ] Formateador de direcciones con API de código postal

  • [ ] Comprobaciones de accesibilidad JIS X 8341

  • [ ] Patrones aportados por la comunidad


Documentación

Archivo

Qué contiene

TOOLS.md

Especificaciones de entrada/salida con ejemplos para cada herramienta

PROMPTS.md

10 plantillas de flujo de trabajo y un guion de demostración de entrevista

DATA.md

Todos los datos incluidos: prefecturas, nombres, teléfonos, eras, keigo

COMPETITORS.md

Panorama competitivo y cómo encaja esto

PRD.md

Requisitos del producto y decisiones de diseño

ROADMAP.md

Plan de construcción por fases


Licencia

MIT


Creado por Marsel Bait en Tokio

Install Server
A
security – no known vulnerabilities
A
license - permissive license
A
quality - A tier

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/mrslbt/japan-ux-mcp'

If you have feedback or need assistance with the MCP directory API, please join our Discord server