SketchXFlow MCP

Diseña sitios web, aplicaciones, logotipos, correos electrónicos y creativos publicitarios desde Claude Code, Cursor o Codex — diseños coherentes con la marca y código exportable — y contacta al equipo de desarrollo de SketchXFlow desde tu agente. Instalación: npx @sketchxflow/mcp install

Documentación

Instalación en tres pasos.

Hazlo en este orden. El instalador maneja todas las aplicaciones a la vez, así que solo lo haces una vez por computadora.

  1. 1

    Obtén tu clave de API

    Tu clave conecta la aplicación a tu cuenta, para que los diseños lleguen a tus proyectos. Abre Cuenta → Claves de API y haz clic en Generar clave. Genera una clave de API Solo se muestra una vez: cópiala en un lugar seguro.
  2. 2

    Ejecuta el instalador

    Abre una terminal (cualquier carpeta está bien), pega este comando y presiona Enter.
    $ npx @sketchxflow/mcp install
    
    Qué pregunta el instalador
    1. a Encuentra tus aplicaciones Enumera las aplicaciones de IA que encontró en esta computadora.
    2. b Tú eliges Selecciona cuáles conectar.
    3. c Pega tu clave Del paso 1. Escribe la configuración de cada aplicación por ti.
  3. 3

    Reinicia tu aplicación y pruébala

    Cierra y vuelve a abrir por completo las aplicaciones que conectaste. Luego pide a tu agente un diseño, por ejemplo: “Usa SketchXFlow para diseñar una página de precios para mi aplicación y luego dame el código.” Estás listo cuando tu agente comience a llamar a las herramientas de sketchxflow_….

Opcional

¿Prefieres configurarlo a mano?

Omite esto si el instalador funcionó. De lo contrario, elige tu aplicación a continuación y sigue sus tres pasos.

Claude Code agrega servidores desde la terminal. Ejecuta esto, reemplazando sk_live_… con tu clave:

$ claude mcp add sketchxflow -s user -e SKETCHXFLOW_API_KEY=sk_live_… -- npx -y @sketchxflow/mcp

Luego inicia una nueva sesión de Claude Code.

Lo que obtienes

Qué puede hacer tu agente.

Una vez conectado, tu agente obtiene estas herramientas. Un flujo típico es preguntar → diseñar → obtener el código → editar. Cada diseño es un proyecto normal de SketchXFlow, así que también puedes abrirlo en la web.

Hace preguntasGratis

Te entrevista para armar el brief y luego te devuelve un prompt de diseño listo.

sketchxflow_clarify

Diseña una página

Un proyecto nuevo, o una página coherente con la marca añadida a uno existente.

sketchxflow_design_page

Edita una sección

Cambia una sección por frase, con bloqueo de marca, para que nada más se desvíe.

sketchxflow_edit

Te entrega el código

El HTML completo + Tailwind de una página, para que tu agente lo implemente en tu stack.

sketchxflow_get_code

Revisa un proyecto

Estado, enlace de vista previa y lista de páginas de un proyecto.

sketchxflow_get_project

Enumera tus proyectos

Todo lo que hay en tu cuenta de SketchXFlow.

sketchxflow_list_projects

Servicios de desarrollo — SketchXFlow lo construye por ti

El mismo paquete también se comunica con nuestro equipo de desarrollo: tu agente realiza la entrevista de requisitos, obtiene la propuesta a precio fijo y los enlaces para aceptar y pagar. Todo gratis de llamar.

Inicia un proyecto con nuestro equipoGratis

Abre la entrevista de requisitos con el consultor de IA y devuelve su primera pregunta.

sketchxflow_services_start

Habla con el consultorGratis

Un turno a la vez: responde, siguiente pregunta con opciones y el presupuesto en vivo de la lista de precios pública.

sketchxflow_services_say

Lee los requisitosGratis

El documento de requisitos tal como está y si está listo para finalizar.

sketchxflow_services_requirements

Finaliza y lo cotizaGratis

Congela los requisitos y devuelve el enlace de la propuesta. Aceptar y pagar ocurren en el sitio web, con sesión iniciada.

sketchxflow_services_finalise

Enumera tus facturasGratis

Cada factura de un proyecto con su estado y la página para pagarla: UPI, tarjetas, EMI, banca neta, transferencia bancaria.

sketchxflow_services_invoices

Enumera tus proyectos de servicioGratis

Tus proyectos de servicios de desarrollo y sus enlaces.

sketchxflow_services_projects