Anotaciones personalizadas con ChatGPT y WebMCP: la nueva frontera del desarrollo web agéntico
Las anotaciones personalizadas con ChatGPT son controles definidos por el desarrollador directamente en el código de un sitio web que permiten a los agentes de IA entender qué acciones están disponibles en cada elemento de la página y ejecutarlas desde el navegador integrado de ChatGPT. En términos prácticos, esto significa que un usuario puede hacer clic en cualquier componente de tu aplicación web y ver opciones inteligentes —como cambiar un color, buscar un similar o agregar metadata— sin salir de la interfaz ni navegar por menús complejos.
OpenAI anunció en octubre de 2026 la extensión de las anotaciones dentro del ecosistema WebMCP, una tecnología que permite a los sitios web exponer acciones específicas para que los agentes de IA las descubran y ejecuten. Para los equipos de desarrollo en Perú y América Latina, esto no es solo una actualización técnica: es un cambio en la forma en que debemos pensar el diseño de nuestras aplicaciones web de cara a los próximos años.
En este artículo exploramos qué son exactamente las anotaciones personalizadas, cómo funciona WebMCP, y qué significa todo esto para los desarrolladores y empresas que quieren construir productos digitales preparados para la era de los agentes de IA.
¿Qué son las anotaciones personalizadas de ChatGPT y cómo funcionan técnicamente?
Las anotaciones en ChatGPT ya existían como una función básica: permitían al usuario señalar un elemento en la página y pedirle a ChatGPT que lo modificara. Lo nuevo es la extensibilidad de anotaciones, que le da al desarrollador control total sobre qué controles aparecen cuando el usuario hace clic en cada elemento.
La implementación es directa: el desarrollador define los controles usando atributos HTML o JavaScript en el código del sitio. No se requiere una infraestructura adicional compleja. Por ejemplo, si tienes un catálogo de productos, puedes definir que al hacer clic en un ítem aparezca un selector de color o un botón para buscar productos similares. Todo esto queda expuesto al agente de ChatGPT que opera desde el navegador integrado de la app.
El resultado es que el agente tiene contexto adicional sobre qué está mirando el usuario y qué puede hacer con eso. Ya no es solo un chat que responde preguntas: es un copiloto que entiende la estructura semántica de tu aplicación y actúa sobre ella. Esto es lo que OpenAI llama hacer tu app más agent-friendly.
¿Qué es WebMCP y por qué los desarrolladores deben conocerlo ya?
WebMCP es el protocolo que permite a los sitios web exponer herramientas y acciones para que los agentes de IA las consuman. Piénsalo como una API, pero diseñada específicamente para que un agente inteligente la entienda y use de forma autónoma, no solo para que otro sistema la llame de forma programática.
Con WebMCP, puedes exponer acciones como buscar en un catálogo, filtrar resultados, actualizar datos en la página o agregar metadata a un registro. El agente de ChatGPT, al operar dentro del navegador integrado, puede llamar a estas herramientas en nombre del usuario, combinando su conocimiento sobre las preferencias del usuario con las capacidades que tú como desarrollador has definido en el sitio.
Lo que hace poderoso a WebMCP no es solo la ejecución de acciones, sino el contexto. El agente sabe quién es el usuario, qué ha hecho antes, qué prefiere. Tu sitio solo necesita decirle qué puede hacer. El agente se encarga del resto: interpreta la intención, selecciona la herramienta correcta y ejecuta la acción. Esto reduce la fricción para el usuario final de manera significativa.
Un ejemplo concreto del anuncio de OpenAI: en una aplicación de gastos, el usuario hace clic en un registro y ChatGPT sugiere un prompt para buscar contexto adicional sobre ese gasto en fuentes externas que la propia app no maneja. El agente agrega la metadata correcta usando la herramienta WebMCP disponible. El usuario no tuvo que escribir nada complejo ni navegar a otra pantalla.
¿Cómo impacta esto en el desarrollo de aplicaciones web en Perú y América Latina?
Para los equipos de desarrollo en la región, esta evolución plantea una pregunta concreta: ¿estamos diseñando nuestras aplicaciones pensando en que el usuario puede tener un agente de IA como copiloto? La mayoría de las apps web actuales en el mercado latinoamericano no están preparadas para esto. Y eso es tanto un riesgo como una oportunidad.
El riesgo es claro: si tus competidores adoptan WebMCP y tú no, sus usuarios tendrán una experiencia significativamente más fluida. Podrán hacer en segundos lo que en tu app toma varios pasos. En mercados como el peruano, donde la adopción de herramientas digitales en pymes está acelerándose, la diferencia en experiencia de usuario puede ser determinante para la retención.
La oportunidad es igual de clara: los desarrolladores .NET, Flutter, TypeScript y Java de la región tienen hoy la posibilidad de posicionarse como expertos en desarrollo agéntico antes de que sea mainstream. Implementar anotaciones personalizadas con ChatGPT y exponer herramientas WebMCP en proyectos actuales es una ventaja competitiva real, no solo una novedad técnica.
Además, para las empresas que trabajan con sistemas ERP, CRM o plataformas de gestión, la integración de WebMCP puede transformar la experiencia de sus usuarios internos. Imagina que un colaborador puede hacer clic en una orden de compra dentro de su ERP y ChatGPT le sugiere acciones como comparar con órdenes similares, detectar anomalías o actualizar el estado, todo sin salir de la pantalla.
¿Cómo aplica esto en tu empresa o proyecto de desarrollo?
Si estás desarrollando o manteniendo una aplicación web, aquí hay pasos concretos para empezar a explorar esta tecnología de forma pragmática:
- Audita las acciones más repetitivas de tus usuarios. Identifica qué hacen tus usuarios con más frecuencia en tu app: filtrar, buscar, actualizar campos, agregar notas. Esas son las primeras candidatas para convertirse en herramientas WebMCP.
- Empieza con anotaciones simples. Define controles básicos en HTML para los elementos más interactuados de tu interfaz. No necesitas reescribir tu app: puedes agregar los atributos necesarios de forma incremental.
- Define prompts sugeridos para tus usuarios. La extensibilidad de anotaciones permite sugerir prompts específicos. Piensa en qué le preguntaría un usuario inteligente a ChatGPT sobre cada sección de tu app y define esos prompts como punto de partida.
- Prueba en el navegador integrado de ChatGPT. Una vez implementado, verifica cómo el agente interpreta tus herramientas y controles. Ajusta los nombres y descripciones de las herramientas para que sean semánticamente claros para el agente.
- Itera con feedback real. Como cualquier feature de UX, las anotaciones y herramientas WebMCP mejoran con uso real. Recopila datos sobre qué controles usa más tu audiencia y optimiza.
El objetivo no es implementar todo de golpe, sino empezar a pensar en tu aplicación web como un entorno donde el usuario puede operar con o sin un agente de IA, y en ambos casos tiene una experiencia fluida.
Preguntas Frecuentes
¿Qué necesito saber como desarrollador para implementar WebMCP en mi sitio web?
Para implementar WebMCP necesitas exponer las acciones de tu sitio como herramientas que el agente pueda descubrir. Esto se hace definiendo endpoints o funciones con descripciones semánticas claras usando JavaScript o atributos HTML. No es necesario un framework específico: funciona con stacks modernos como TypeScript, React, Vue o incluso HTML puro. La documentación oficial de OpenAI para WebMCP es el punto de partida, y la curva de aprendizaje es relativamente baja si ya tienes experiencia con APIs REST o integraciones de terceros.
¿Las anotaciones personalizadas de ChatGPT funcionan con cualquier aplicación web o solo con apps específicas?
Las anotaciones personalizadas funcionan con cualquier aplicación web que sea accesible desde el navegador integrado de la app de ChatGPT. No hay restricciones de framework o tecnología: si tu app carga en un navegador estándar, puedes agregar los atributos HTML o el JavaScript necesario para definir controles personalizados. La condición principal es que el usuario esté accediendo a tu sitio desde el navegador integrado de ChatGPT, donde el agente tiene la capacidad de leer el contexto de la página y ejecutar las herramientas disponibles.
¿Cómo puedo integrar WebMCP con un sistema ERP o plataforma de gestión empresarial existente?
La integración de WebMCP con un ERP o plataforma de gestión requiere exponer como herramientas las acciones más relevantes del sistema: consultar registros, actualizar estados, generar reportes o agregar notas. Si tu ERP tiene una capa web (como Odoo, que tiene interfaz web nativa), puedes agregar las herramientas WebMCP directamente en esa capa sin modificar el backend. Para sistemas más cerrados, la integración puede hacerse a través de una capa intermedia que actúe como bridge entre WebMCP y las APIs internas del ERP. En Consultoría-Ti hemos trabajado con este tipo de integraciones y podemos orientarte en la arquitectura más adecuada para tu caso.
Conclusión: ¿Estás construyendo apps preparadas para la era de los agentes?
Las anotaciones personalizadas con ChatGPT y el protocolo WebMCP representan un cambio de paradigma en el desarrollo web: el usuario ya no navega solo, navega con un agente que lo conoce mejor que tu propia aplicación. Para los desarrolladores y empresas en Perú y América Latina, esto es una señal clara de hacia dónde va el diseño de productos digitales.
No se trata de reemplazar tu app ni de depender completamente de ChatGPT. Se trata de hacer que tu aplicación sea lo suficientemente inteligente para trabajar bien con los agentes que tus usuarios ya están usando. Las empresas que entiendan esto primero tendrán una ventaja real en experiencia de usuario y eficiencia operativa.
En Consultoría-Ti trabajamos con equipos de desarrollo y empresas en la región para implementar estas tecnologías de forma práctica y alineada a los objetivos del negocio. Si quieres explorar cómo WebMCP o las integraciones de IA pueden mejorar tu producto o sistema actual, conversemos.
👉 Contáctanos en Consultoría-Ti y cuéntanos en qué estás trabajando.
Fuentes y Referencias
OpenAI YouTube — Build custom site annotations with ChatGPT
✨ Contenido generado con ContentFlow — Consultoría-Ti