Si has abierto el chat que vive en esta misma página, ya has probado nuestro último proyecto: un asistente de IA que conoce Agüita por dentro. No es un chatbot de respuestas enlatadas ni un widget de terceros pegado con celo: lo hemos construido nosotros, sobre nuestra propia web, y no solo escribe texto, también dibuja interfaces. Pídele un resumen de un proyecto o un presupuesto orientativo y verás aparecer una tarjeta que se rellena delante de ti.

Te contamos cómo lo hemos hecho, qué aporta y hasta dónde puede llegar.

Qué hace el asistente

Tiene tres capas de utilidad, de menos a más ambiciosa:

Sabe de qué habla. Conoce nuestros servicios, los proyectos publicados en este blog, los talleres presenciales y Agüita Blue. Responde con datos reales del sitio, no con invenciones.
Ayuda de verdad. Explica qué tecnologías usamos en cada proyecto, aconseja un stack razonable si le describes lo que quieres construir y hace soporte técnico de primer nivel.
Genera interfaces. Aquí está lo interesante: en vez de soltar un párrafo, monta una tarjeta interactiva en un panel lateral —un resumen esquemático de un artículo, un borrador de presupuesto, la organización de un taller o tu mensaje de contacto ya redactado— y espera a que tú confirmes antes de hacer nada.

Ese último punto tiene nombre propio: interfaz generativa (generative UI). Es la diferencia entre que la IA te cuente algo y que te lo construya.

Las cuatro fases de la integración

No lo hicimos de una sentada. Lo dividimos en fases, cada una con un objetivo cerrado y verificable.

Fase 0 — Los cimientos

Conectar la web con el modelo. Instalamos CopilotKit, montamos el panel de chat y creamos un pequeño punto de entrada en el servidor que hace de puente con Claude. Detalle nada menor: la clave de la API vive solo en el servidor, nunca viaja al navegador.

Por qué importa: es la fontanería. Sin esto no hay nada, pero por sí sola no aporta valor: un asistente que no sabe nada de ti no sirve para gran cosa.

Fase 1 — Darle conocimiento

Le pasamos el contexto del sitio: servicios, resúmenes y contenido de los artículos del blog, datos del negocio y el detalle de Agüita Blue. A partir de ahí puede responder "¿qué stack usasteis en el Surf Tracker?" o "¿cuánto cuesta el taller de Arduino?" con información correcta.

Por qué importa: es lo que separa un asistente útil de uno que alucina. Y le pusimos una regla clara: si no lo sabe, lo dice y sugiere escribirnos.

Fase 2 — Que pueda actuar

Hasta aquí solo hablaba. En esta fase le dimos manos: un envío de correo real para que las solicitudes lleguen a nuestro buzón. De paso jubilamos el viejo formulario de contacto, que se limitaba a abrir el programa de correo del visitante y confiar en su suerte.

Por qué importa: una conversación que no termina en nada es una oportunidad perdida. Aquí el asistente empieza a generar contactos reales.

Fase 3 — Interfaces generativas

La fase más vistosa. Cuando el asistente prepara algo, no lo aprieta dentro de una burbuja de chat: lo publica en un panel aparte, a tamaño cómodo, que se va rellenando en vivo mientras el modelo escribe. Ahí están los botones de confirmar o editar.

Por qué importa: leer un presupuesto en un párrafo es incómodo; verlo como una ficha con su alcance, su rango de precio y su plazo es otra cosa. Y al separar la acción de la charla, el usuario siempre tiene el control.

Lo que se rompió por el camino

Sería deshonesto contar esto como un camino recto. Tres piedras, y lo que aprendimos de cada una:

Cliente y servidor hablando idiomas distintos. La librería está en plena transición entre dos generaciones y habíamos conectado el chat nuevo con el motor antiguo. Resultado: un críptico "Not Found" en cada mensaje.
Un punto en vez de un guion. El identificador del modelo llevaba 4.5 donde la API esperaba 4-5. Un carácter, un error 404 y un buen rato de investigación.
Listas que el modelo no sabía escribir. Al pedirle parámetros en forma de lista, el modelo devolvía algo que no era JSON válido y todo se caía. Solución: simplificar el esquema y aceptar texto plano, troceándolo nosotros.

La lección de fondo: cuando una librería avanza rápido, leer los tipos del paquete que tienes instalado vale más que la documentación publicada. Casi todas las respuestas estaban ahí.

Por qué merece la pena

Más allá del gusto por lo nuevo, el balance es concreto:

De folleto a conversación. La web deja de ser un texto que se lee y pasa a responder preguntas a cualquier hora.
Cualifica los contactos. Cuando alguien nos escribe a través del asistente, el mensaje llega con el contexto ya recogido: qué quiere, para cuándo y con qué alcance. Menos idas y venidas.
Menos fricción. Un presupuesto orientativo al instante o un formulario que se rellena solo eliminan justo los pasos donde la gente abandona.
Costes bajo control. Usamos un modelo económico para el día a día y reservamos el más potente para las tareas complejas.
Con el usuario al mando. El asistente propone, pero no envía nada sin una confirmación explícita.

Lo que viene después

Lo construido es una base, no un techo. Lo que ya está al alcance:

El mismo asistente en otros canales: WhatsApp, Slack o Teams, sin rehacerlo.
Más acciones: reservar plaza en un taller, consultar disponibilidad, hacer seguimiento de una solicitud.
Memoria: que recuerde conversaciones anteriores y retome donde lo dejasteis.
Datos en vivo: conectar el asistente a información que cambia —el estado del mar, por ejemplo— es el puente natural con Agüita Blue, nuestro servicio de digitalización para el turismo costero.

Y lo más importante para quien nos lee desde fuera: todo esto es replicable. Lo que hemos montado en nuestra casa se puede montar en la tuya, y encaja especialmente bien en alojamientos, surf camps y operadores de turismo activo, donde la mayoría de las preguntas se repiten y cada respuesta rápida es una reserva que no se pierde.

Lo que nos llevamos

Integrar IA en un producto ya no consiste en "añadir un chat". Consiste en decidir qué sabe, qué puede hacer y qué te enseña por pantalla — y en dejar siempre la última palabra a la persona. Las fases nos sirvieron justo para eso: cada una respondía a una de esas preguntas, y ninguna se dio por buena hasta verla funcionar.

El asistente está aquí mismo, en la esquina de esta página: pruébalo y pídele un resumen de este artículo. Si quieres uno parecido en tu web o en tu negocio, hablemos — o echa un vistazo a nuestros servicios.