• RUTAS
  • DISEÑO
  • JERARQUÍA
  • MANUAL

Cómo inspeccionar la estructura de un sitio con tu IA

Conecta Plasmic con tu cliente de IA para que audite tus árboles de páginas y diseños. Analiza el código y la estructura real para encontrar errores.

Pregunta a la IA sobre esta página

Respuesta rápida

¿Puede mi IA revisar la estructura de mi sitio en Plasmic?

Sí. Tu IA utiliza el MCP de Plasmic para extraer los modelos de página y los renders HTML. Luego, compara el árbol de elementos con tu diseño o lógica de rutas para detectar errores. Obtendrás una lista clara de fallos estructurales y enlaces rotos.

Resultados de la auditoría

Dónde se clasifican tus hallazgos.

La IA categoriza los problemas según el esfuerzo necesario para solucionarlos.

RUTAS

Rutas de página rotas

La IA compara tu lista de páginas con los renders reales. Identifica enlaces muertos o rutas faltantes en tu proyecto.

DISEÑO

Errores visuales

Al analizar el HTML, la IA detecta elementos que no están donde deberían o que faltan en el árbol de componentes.

JERARQUÍA

Estructura de elementos

La IA analiza el anidamiento de componentes e identifica problemas de profundidad o relaciones padre-hijo incorrectas.

MANUAL

Correcciones manuales

La IA identifica lógicas de diseño complejas que no puede resolver. Recibirás estos casos específicos para gestionarlos en el editor de Plasmic.

El flujo

Lo que hace tu IA al recibir la solicitud.

La IA transforma los datos brutos en una auditoría estructurada de tu proyecto.

  1. Obtener datos del proyecto

    La IA extrae la jerarquía completa de componentes y la lista de páginas de tu proyecto de Plasmic.

    get_model

  2. Renderizar la vista

    Genera el HTML de páginas específicas para ver cómo se posicionan realmente los elementos en el DOM.

    render_html

  3. Comparar estructuras

    La IA contrasta los datos del modelo con el resultado renderizado para hallar discrepancias.

    get_modelrender_html

  4. Reportar errores

    Resume las rutas rotas y los problemas de diseño en una lista fácil de leer.

    render_html

Pruébalo

Copia estos ejemplos para empezar.

Usa estos prompts para iniciar una inspección.

Puntos de partida

Estos son ejemplos iniciales. Cambia los nombres de las páginas o tipos de componentes para adaptarlos a tu proyecto.

Plasmic Connector

Todo listo. Elige tu cliente MCP y sigue las instrucciones de configuración.

Enlace del conectorhttps://edge.vinkius.com/vk_preview_3sKdf5JGlcT8ZlPYWT5zfXjfJKOMYRYhuIjG3Rng/mcp

Claude Desktop

Sigue los pasos siguientes para conectarte en segundos.

  1. 1In Claude Desktop, open Settings → Connectors.
  2. 2Click “Add custom connector” and paste the connector link above as the remote MCP server URL.
  3. 3Click Add and start a new chat — Plasmic capabilities are ready to use.
Configuración · claude_desktop_config.jsonCopiar
{
  "mcpServers": {
    "plasmic-visual-headless-page-builder-mcp": {
      "url": "https://edge.vinkius.com/vk_preview_3sKdf5JGlcT8ZlPYWT5zfXjfJKOMYRYhuIjG3Rng/mcp"
    }
  }
}
Copia en el chat04

  • Revisa la lista de páginas en mi proyecto de Plasmic y dime si alguna ruta parece rota.

  • Analiza el árbol de elementos de la página Home y busca contenedores faltantes.

  • Compara el render HTML de la página Product con el modelo para verificar si el diseño es correcto.

  • Audita la estructura de mi proyecto y enumera todas las páginas que no tienen un render HTML correspondiente.

  • Claude
  • ChatGPT
  • Cursor
  • VS Code
  • Windsurf
  • Claude Code
  • JetBrains
  • Cline

Empieza aquí

Conecta Plasmic una vez y luego pregunta.

Solo tienes que vincular tu cuenta de Plasmic. Tus credenciales permanecen cifradas y podrás empezar a consultar la estructura de tu sitio de inmediato.

Conecta Plasmic con tu IA

FAQ

Dudas comunes

  • 01

    ¿Puede la IA cambiar mis diseños de Plasmic?

    No. La IA solo puede leer el modelo y el HTML. Debes realizar todos los cambios visuales tú mismo en Plasmic.

  • 02

    ¿La IA tiene acceso a mis datos privados del proyecto?

    La IA solo accede a los datos que solicita explícitamente mediante las herramientas para responder a tus preguntas.

  • 03

    ¿Puede arreglar errores de CSS?

    No. Puede identificar que un diseño es incorrecto comparando el HTML con el modelo, pero no puede escribir ni aplicar cambios de CSS.

  • 04

    ¿Cómo sabe si una ruta está rota?

    Compara la lista de páginas de tu modelo con los renders HTML disponibles para encontrar vacíos.

  • 05

    ¿Puede eliminar páginas por mí?

    No. No existen herramientas para eliminar o modificar tu proyecto de Plasmic.

  • ¿Más preguntas sobre Plasmic? Ver todas las funciones del conector de Plasmic

Conecta Plasmic a Claude, Cursor, ChatGPT y más