# mcp-ui-future-agentic-interfaces-goose-2025-08-25

## Veille

MCP-UI revoluciona las interfaces de agentes de IA, componentes web interactivos, iframes en sandbox, accesibilidad, UI generativa - Goose/Block

## Titre Article

MCP-UI: The Future of Agentic Interfaces

## Date

2025-08-25

## URL

https://block.github.io/goose/blog/2025/08/25/mcp-ui-future-agentic-interfaces/

## Keywords

MCP-UI, Model Context Protocol UI, interfaces agénticas, componentes web interactivos ricos, interfaces visuales de IA, recursos de UI embebidos, integración multiplataforma de IA, accesibilidad, UI generativa, integración con Shopify, Monday.com, Goose, iframes en sandbox, remote DOM, experiencias multimodales

## Authors

Ebony Louis (Developer Advocate - Block/Goose)

## Ton

**Perfil:** Conversacional-Profesional | Desarrollador defensor entusiasta | Educativo-Promocional | Intermedio

Louis adopta una voz de developer advocate que equilibra el entusiasmo por el producto con la educación técnica. La apertura enmarcando el problema ("muros de texto", "copiar y pegar URLs") establece puntos de dolor identificables. La estructura problema → solución → arquitectura → beneficios → ejemplos guía una comprensión progresiva. Un lenguaje técnico accesible (iframes en sandbox, remote DOM, post messages) evita intimidar. Los ejemplos concretos (Shopify, viajes, restaurantes) anclan el protocolo abstracto. El énfasis en la accesibilidad y la estandarización multiplataforma muestra un enfoque orientado a valores. Tono optimista sin exageración ingenua (reconociendo el desafío de la adopción). Típico de la promoción de desarrolladores de Block/Goose, que combina profundidad técnica, utilidad práctica y visión transformadora.

## Pense-betes

- **Problema resuelto**: muros de texto en las conversaciones con agentes de IA, copiar y pegar URLs, múltiples pestañas
- **MCP-UI = protocolo + SDK** para componentes web interactivos en conversaciones con agentes
- **Tres tipos de contenido**: URLs externas, HTML en bruto, remote DOM (workers separados)
- **Seguridad**: iframes en sandbox, comunicación únicamente mediante post messages
- **Partes interesadas del ecosistema**: desarrolladores de agentes, desarrolladores de servidores MCP, proveedores de servicios, usuarios finales
- **Ejemplos concretos**: Shopify (catálogos visuales), viajes (selección de asiento de avión), restaurantes (tarjetas de fotos + pedidos)
- **Shopify**: soporte MCP desplegado en todas sus tiendas
- **Accesibilidad**: los agentes construyen interfaces personalizadas según las preferencias del usuario
- **Estandarización multiplataforma**: una implementación funciona en todas partes
- **Desafío actual**: la adopción, no la viabilidad técnica
- **Efecto de red**: los componentes de UI funcionan universalmente una vez implementados
- **Preserva la experiencia web**: décadas de UI/UX + identidad de marca
- **Primeros pasos**: HTML simple `createUIResource({ type: 'html', content: '<h1>Hello World</h1>' })`

## RésuméDe400mots

**El problema de las interfaces puramente textuales**

Las interfaces tradicionales de agentes de IA sufren una limitación fundamental: obligan a los usuarios a consumir toda la información mediante respuestas de texto. Al solicitar recomendaciones de productos, planificación de viajes o búsquedas de restaurantes, los usuarios reciben abrumadores muros de texto con descripciones, enlaces y datos que requieren copiar y pegar manualmente y alternar entre pestañas. Esto anula el propósito de contar con un asistente inteligente y genera una experiencia de usuario deficiente, especialmente para usuarios no técnicos. El enfoque exclusivamente textual funciona para los primeros adoptantes pero crea barreras para la adopción masiva, limitando la utilidad de los agentes para tareas cotidianas.

**Arquitectura técnica de MCP-UI**

MCP-UI (Model Context Protocol User Interface) es a la vez un protocolo y un SDK que permite integrar componentes web interactivos ricos directamente en las conversaciones con agentes de IA. El sistema aprovecha los recursos embebidos de la especificación MCP, permitiendo que los servidores MCP devuelvan componentes de UI interactivos en lugar de texto plano. Estos componentes se renderizan en **iframes en sandbox** que se comunican con la aplicación anfitriona únicamente mediante post messages seguros, garantizando que el código de terceros no pueda acceder ni manipular la aplicación principal.

La implementación soporta **tres tipos de contenido**: URLs externas (aplicaciones web existentes en iframes), HTML en bruto (HTML personalizado con CSS y JavaScript) y remote DOM (UI renderizada en workers separados para mayor seguridad). Los desarrolladores pueden comenzar con recursos HTML simples y enriquecerlos progresivamente con funciones interactivas.

**Beneficios clave y casos de uso**

MCP-UI preserva décadas de experiencia en UI/UX web al tiempo que la aumenta con capacidades de IA. Mantiene la identidad de marca de empresas como Shopify, ofrece una compatibilidad multiplataforma fluida entre diferentes agentes de IA y crea un **efecto de red** en el que los componentes de UI funcionan universalmente una vez implementados. La tecnología aborda la accesibilidad al permitir que los agentes construyan interfaces adaptadas a las preferencias y necesidades individuales. También genera estandarización, eliminando la necesidad de integraciones separadas para cada plataforma de IA.

**Demostraciones concretas**

Tres ejemplos convincentes: **(1) Compras visuales** - catálogos de Shopify con imágenes, precios y elementos interactivos donde hacer clic añade artículos al carrito; **(2) Planificación de viajes** - mapas visuales de selección de asiento de avión con consulta automática del clima para los destinos; **(3) Descubrimiento de restaurantes** - navegación por restaurantes locales con tarjetas de fotos, calificaciones, menús y capacidades de pedido directo, todo dentro del flujo conversacional.

**Implicaciones futuras**

MCP-UI apunta hacia una **revolución de la accesibilidad** en la que los agentes construyen interfaces personalizadas, una **UI generativa** que crea experiencias a medida para cada usuario, **experiencias multimodales** que se extienden más allá de lo visual hacia la voz y los componentes móviles nativos, y una **estandarización multiplataforma**. El desafío actual es la adopción, no la viabilidad técnica, con actores importantes como Shopify ya implementando soporte MCP en todas sus tiendas.

**Detalles de implementación técnica**

El ecosistema de partes interesadas involucra a cuatro grupos: desarrolladores de agentes que implementan el soporte de MCP-UI, desarrolladores de servidores MCP que construyen componentes de UI, proveedores de servicios que crean interfaces ricas, y usuarios finales que se benefician de interacciones intuitivas. Empezar requiere muy poco código: los desarrolladores pueden comenzar con recursos HTML básicos como `createUIResource({ type: 'html', content: '<h1>Hello World</h1>' })` y expandirse a partir de ahí. La tecnología ya está soportada en Goose y disponible mediante documentación completa y una comunidad activa en Discord.

MCP-UI representa un cambio fundamental de las interacciones de IA centradas en texto hacia experiencias ricas, visuales e intuitivas que tienden un puente entre la web tal como la conocemos y el futuro agéntico en construcción.

## GrapheDeConnaissance

- MCP-UI —est_basé_sur→ Model Context Protocol (TECHNOLOGIE, 0.98)
- Ido Salomon —a_créé→ MCP-UI (TECHNOLOGIE, 0.95)
- Liad Yosef —a_créé→ MCP-UI (TECHNOLOGIE, 0.95)
- Ido Salomon —travaille_chez→ Monday.com (ORGANISATION, 0.97)
- Liad Yosef —travaille_chez→ Monday.com (ORGANISATION, 0.97)
- MCP-UI —utilise→ sandboxed iframes (CONCEPT, 0.97)
- MCP-UI —remplace→ interfaces textuelles (CONCEPT, 0.92)
- Goose —utilise→ MCP-UI (TECHNOLOGIE, 0.97)
- Shopify —utilise→ MCP-UI (TECHNOLOGIE, 0.93)
- MCP-UI —permet→ préservation de l'identité de marque (CONCEPT, 0.88)
- Andrew Harvard —améliore→ MCP-UI (TECHNOLOGIE, 0.85)
- MCP-UI —permet→ générative UI (CONCEPT, 0.82)
- Block —a_créé→ Goose (TECHNOLOGIE, 0.98)
- MCP-UI —améliore→ accessibilité agents IA (CONCEPT, 0.87)

---
Canonical: https://www.thekb.eu/es/fiches/mcp-ui-future-agentic-interfaces-goose-2025-08-25/
