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

## Veille

MCP-UI rivoluziona le interfacce degli agenti IA, componenti web interattivi, iframe sandboxed, accessibilità, generative UI - 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, interfacce agentiche, componenti web interattivi ricchi, interfacce IA visive, risorse UI incorporate, integrazione IA cross-platform, accessibilità, generative UI, integrazione Shopify, Monday.com, Goose, iframe sandboxed, remote DOM, esperienze multimodali

## Authors

Ebony Louis (Developer Advocate - Block/Goose)

## Ton

**Profilo:** Conversazionale-Professionale | Sviluppatore advocate entusiasta | Educativo-Promozionale | Intermedio

Louis adotta una voce da developer advocate che bilancia entusiasmo per il prodotto ed educazione tecnica. L'apertura basata sull'inquadramento del problema ("muri di testo", "copia-incolla di URL") stabilisce punti di frustrazione riconoscibili. La struttura problema → soluzione → architettura → vantaggi → esempi guida una comprensione progressiva. Un linguaggio tecnico accessibile (iframe sandboxed, remote DOM, post message) evita di intimidire. Esempi concreti (Shopify, viaggi, ristoranti) radicano il protocollo astratto nella realtà. L'enfasi su accessibilità e standardizzazione cross-platform mostra un approccio guidato dai valori. Tono ottimistico senza hype ingenuo (riconoscendo la sfida dell'adozione). Tipico dell'advocacy per sviluppatori di Block/Goose, che unisce profondità tecnica, utilità pratica e visione trasformativa.

## Pense-betes

- **Problema risolto**: muri di testo nelle conversazioni con agenti IA, copia-incolla di URL, schede multiple
- **MCP-UI = protocollo + SDK** per componenti web interattivi nelle conversazioni con agenti
- **Tre tipi di contenuto**: URL esterni, HTML grezzo, remote DOM (worker separati)
- **Sicurezza**: iframe sandboxed, comunicazione solo tramite post message
- **Stakeholder dell'ecosistema**: sviluppatori di agenti, sviluppatori di server MCP, fornitori di servizi, utenti finali
- **Esempi concreti**: Shopify (cataloghi visivi), viaggi (selezione posti a sedere in aereo), ristoranti (schede fotografiche + ordinazione)
- **Shopify**: supporto MCP distribuito su tutti i loro store
- **Accessibilità**: gli agenti costruiscono interfacce personalizzate in base alle preferenze dell'utente
- **Standardizzazione cross-platform**: un'unica implementazione funziona ovunque
- **Sfida attuale**: adozione, non fattibilità tecnica
- **Effetto rete**: i componenti UI funzionano universalmente una volta implementati
- **Preserva la competenza web**: decenni di UI/UX + identità di marca
- **Per iniziare**: semplice HTML `createUIResource({ type: 'html', content: '<h1>Hello World</h1>' })`

## RésuméDe400mots

**Il problema delle interfacce puramente testuali**

Le interfacce tradizionali per agenti IA presentano una limitazione fondamentale: costringono gli utenti a fruire di tutte le informazioni tramite risposte testuali. Nelle richieste di raccomandazioni di prodotti, pianificazione di viaggi o ricerca di ristoranti, gli utenti ricevono muri di testo travolgenti con descrizioni, link e dati che richiedono copia-incolla manuale e passaggi continui tra schede. Ciò vanifica lo scopo di disporre di un assistente intelligente e genera un'esperienza utente scadente, in particolare per gli utenti non tecnici. L'approccio solo testuale funziona per gli early adopter ma crea ostacoli all'adozione mainstream, limitando l'utilità degli agenti per le attività quotidiane.

**Architettura tecnica di MCP-UI**

MCP-UI (Model Context Protocol User Interface) è al contempo un protocollo e un SDK che consente l'integrazione di componenti web interattivi ricchi direttamente nelle conversazioni con agenti IA. Il sistema sfrutta le risorse incorporate della specifica MCP, permettendo ai server MCP di restituire componenti UI interattivi anziché testo semplice. Questi componenti vengono renderizzati in **iframe sandboxed** che comunicano con l'applicazione host esclusivamente tramite post message sicuri, garantendo che il codice di terze parti non possa accedere o manipolare l'applicazione principale.

L'implementazione supporta **tre tipi di contenuto**: URL esterni (applicazioni web esistenti in iframe), HTML grezzo (HTML personalizzato con CSS e JavaScript) e remote DOM (UI renderizzata in worker separati per una maggiore sicurezza). Gli sviluppatori possono iniziare con semplici risorse HTML e arricchirle progressivamente con funzionalità interattive.

**Vantaggi chiave e casi d'uso**

MCP-UI preserva decenni di competenza in UI/UX web arricchendola con capacità IA. Mantiene l'identità di marca per aziende come Shopify, garantisce una compatibilità cross-platform fluida tra i diversi agenti IA e crea un **effetto rete** per cui i componenti UI funzionano universalmente una volta implementati. La tecnologia affronta il tema dell'accessibilità consentendo agli agenti di costruire interfacce adattate alle preferenze ed esigenze individuali. Crea inoltre standardizzazione, eliminando la necessità di integrazioni separate per ciascuna piattaforma IA.

**Dimostrazioni concrete**

Tre esempi significativi: **(1) Shopping visivo** - cataloghi Shopify con immagini, prezzi ed elementi interattivi in cui il clic aggiunge articoli al carrello; **(2) Pianificazione di viaggi** - mappe visive di selezione dei posti a sedere in aereo con ricerca automatica delle condizioni meteo per le destinazioni; **(3) Scoperta di ristoranti** - navigazione tra ristoranti locali con schede fotografiche, valutazioni, menu e possibilità di ordinazione diretta, tutto all'interno del flusso conversazionale.

**Implicazioni future**

MCP-UI indica una **rivoluzione dell'accessibilità** in cui gli agenti costruiscono interfacce personalizzate, una **generative UI** che crea esperienze su misura per singoli utenti, **esperienze multimodali** che si estendono oltre il visivo verso la voce e i componenti mobile nativi, e una **standardizzazione cross-platform**. La sfida attuale riguarda l'adozione più che la fattibilità tecnica, con attori principali come Shopify che già implementano il supporto MCP su tutti i loro store.

**Dettagli di implementazione tecnica**

L'ecosistema degli stakeholder coinvolge quattro gruppi: sviluppatori di agenti che implementano il supporto MCP-UI, sviluppatori di server MCP che costruiscono componenti UI, fornitori di servizi che creano interfacce ricche, e utenti finali che beneficiano di interazioni intuitive. L'avvio richiede codice minimo - gli sviluppatori possono iniziare con risorse HTML di base come `createUIResource({ type: 'html', content: '<h1>Hello World</h1>' })` ed espandersi da lì. La tecnologia è già supportata in Goose ed è disponibile tramite una documentazione completa e una comunità Discord attiva.

MCP-UI rappresenta un cambiamento fondamentale dalle interazioni IA dense di testo verso esperienze ricche, visive e intuitive che collegano il web come lo conosciamo al futuro agentico in costruzione.

## 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/it/fiches/mcp-ui-future-agentic-interfaces-goose-2025-08-25/
