Cómo conectar Google Stitch con Google Antigravity: Aplicaciones atractivas sin esfuerzo

Posted on 16 marzo 2026 por Jose Antonio

Si hay algo que me ha costado siempre en el desarrollo de aplicaciones, es el diseño de interfaces. Soy de los que pueden pasar horas peleándose con CSS para que un botón quede centrado, y al final sigue sin convencerme. Seguro que a más de uno os suena.

Pero últimamente Google ha estado soltando herramientas experimentales que, combinadas, pueden cambiar completamente cómo trabajamos. Hoy os traigo la combinación de Google Stitch + Google Antigravity: una dupla que te permite generar aplicaciones funcionales y visualmente atractivas en cuestión de minutos, no días.

¿Qué son estas herramientas?

Google Stitch: diseño por «vibe designing»

Google Stitch es el laboratorio de Google para generación de interfaces. Pero no es un simple generador de imágenes: describes lo que quieres construir y Stitch te propone diseños completos, con múltiples pantallas, flujos de navegación y componentes visuales listos para usar.

Lo mejor es que no te quedas con una imagen estática. Puedes interactuar con el diseño, pedir cambios, anotar modificaciones y, cuando estés satisfecho, descargar el código en HTML/CSS o React/Tailwind.

Actualmente está en beta gratuita (sin límites, de momento), así que es momento de aprovechar.

Google Antigravity: tu compañero de código con IA

Google Antigravity es el IDE de Google con agentes de IA integrados. Piensa en VS Code, pero donde la IA no solo autocompleta: planifica, codifica, depura e itera sobre proyectos complejos con mínima supervisión.

Durante la preview gratuita tienes acceso a Gemini Pro, Deep Think y Flash sin esos molestos límites de API que nos tienen acostumbrados otros servicios.

¿Por qué conectarlas?

Separadas son útiles. Juntas, son otro nivel:

Stitch se encarga del diseño visual
Antigravity se encarga de la lógica, base de datos, autenticación y despliegue

El truco está en añadir Stitch como servidor MCP (Model Context Protocol) dentro de Antigravity. Así, el agente puede consultar diseños de Stitch directamente e integrarlos en el código que genera.

Paso a paso: la integración

Paso 1: Instalar el servidor MCP de Stitch en Antigravity

En la ventana de agente de Antigravity (la derecha), hacemos clic en los tres puntos y seleccionamos MCP Servers.

Buscamos «stitch» en la lista y lo instalamos. Es un proceso de un clic.

Paso 2: Obtener la API key de Stitch

Necesitamos una clave para que Antigravity pueda hablar con Stitch:

Vamos a stitch.withgoogle.com
En la esquina superior derecha, hacemos clic en nuestro perfil
Seleccionamos «API Keys» y generamos una nueva
Copiamos la clave (empieza por algo como sk-...)

Paso 3: Configurar la API key en Antigravity

Volvemos a Antigravity, a la configuración del MCP Server de Stitch, y pegamos la API key en el campo correspondiente.

Y listo. La integración está completa.

Creando nuestra primera aplicación

Veamos un ejemplo real. Quiero construir un gestor de hábitos con modo oscuro y diseño minimalista.

1. Generamos el diseño en Stitch

Abrimos Stitch y escribimos:

«Aplicación minimalista para llevar un registro de hábitos con modo oscuro, gráficos de progreso semanales y botones para marcar la asistencia diaria. Estética limpia y moderna con toques en color morado».

En menos de un minuto, Stitch genera:

Pantalla principal con lista de hábitos
Gráfico de progreso semanal
Modal para añadir nuevos hábitos
Diseño responsive

Podemos iterar hasta que nos guste el resultado final.

2. Pasamos a Antigravity

Ahora viene la magia. En Antigravity, abrimos el chat con el agente y escribimos algo como:

«Crea una aplicación de gestión de hábitos usando el diseño que obtengas del servidor Stitch MCP. La app debe incluir:
– Autenticación con Clerk
– Base de datos con Convex
– Las funcionalidades que propone el diseño de Stitch
– Despliegue en Vercel»

El agente consultará Stitch, obtendrá el diseño, y empezará a construir la aplicación completa.

3. Iteración automática

Aquí es donde brilla Antigravity: no solo genera código, sino que:

Abre el navegador para probar la app
Detecta errores y los corrige
Verifica que la autenticación funcione
Comprueba que la base de datos se conecte correctamente

En mi caso, construí una app funcional en 23 minutos. Y no es un prototipo: tiene auth real, base de datos persistente y está lista para producción.

Trucos y consideraciones

Lo que funciona de maravilla

Diseños complejos: Stitch maneja bien múltiples pantallas y estados
Componentes modernos: Tailwind CSS, React, layouts responsive
Iteración rápida: cambiar el diseño en Stitch y pedir a Antigravity que actualice el código funciona sorprendentemente bien

Lo que aún falla

Detalles muy específicos: a veces hay que ajustar manualmente márgenes o colores exactos
Integraciones complejas: si necesitas APIs de terceros poco comunes, puede requerir intervención
Sesiones largas: después de muchos mensajes, el contexto se pierde un poco

Consejos prácticos

Sé específico en Stitch: cuanto más detalle des en el prompt, mejor será el diseño base
Itera en el diseño primero: mejor gastar 5 minutos ajustando en Stitch que 30 cambiando código
Verifica pasos intermedios: pide a Antigravity que te muestre el diseño integrado antes de añadir complejidad

El futuro del desarrollo

Esta combinación de herramientas me hace reflexionar sobre hacia dónde vamos. No creo que vayan a reemplazar a los desarrolladores, pero sí que cambian el tipo de trabajo que hacemos:

Menos tiempo peleándose con CSS
Menos tiempo configurando boilers
Más tiempo pensando en la lógica de negocio y la experiencia de usuario

Es como pasar de ser albañil a ser arquitecto. Sigues construyendo, pero a otro nivel de abstracción.

¿Habéis probado ya esta combinación? ¿Qué experiencias tenéis con herramientas de IA para desarrollo? Me encantaría leer vuestros comentarios.

Recursos útiles:
Google Stitch
Google Antigravity
Documentación MCP

Cómo instalar OpenClaw en Linux: Tu propio agente de IA en WhatsApp y Telegram

Posted on 13 febrero 2026 por Jose Antonio

Responder

Si os habéis pasado por aquí últimamente, sabréis que estoy bastante metido en el mundo de los agentes de IA. Primero os enseñé cómo instalar opencode, y ahora os traigo otra joyita que me tiene enganchado: OpenClaw (antes conocido como ClawdBot o MoltBot, por si os suena de algo).

¿Qué es OpenClaw? Pues básicamente es un gateway que te permite tener tu propio asistente de IA conectado a WhatsApp, Telegram, Discord, iMessage y más. Imagina tener a tu disposición un agente que puede limpiar tu bandeja de entrada, enviar correos, gestionar tu calendario o incluso hacer check-in en vuelos, todo desde la app de mensajería que ya usas. Y lo mejor: self-hosted, tus datos en tu máquina, tus reglas.

Requisitos previos

Antes de meternos en harina, aseguraos de tener:

Node.js 22 o superior (imprescindible, no valen versiones antiguas)
Una API key de algún proveedor de IA (Anthropic recomendado, pero podéis usar otros)
Ganas de experimentar (esto no es plug-and-play, pero tampoco es rocket science)

Instalación paso a paso

La instalación es bastante sencilla gracias a npm. Abrimos terminal y ejecutamos:

npm install -g openclaw

Una vez instalado, toca configurar el entorno. OpenClaw guarda todo en ~/.openclaw/, así que vamos a preparar el terreno:

openclaw setup

Esto crea la estructura de carpetas y los archivos de configuración iniciales. Si queréis hacerlo desde el repositorio fuente (para los más aventureros), necesitaréis pnpm y ejecutar pnpm install seguido de pnpm build.

Configuración básica

El archivo de configuración vive en ~/.openclaw/openclaw.json. Aquí podéis ajustar qué canales queréis activar y cómo comportarse el agente. Un ejemplo básico para WhatsApp:

{
  "channels": {
    "whatsapp": {
      "allowFrom": ["+34600123456"],
      "groups": {
        "*": { "requireMention": true }
      }
    }
  }
}

Con esto, solo vuestro número podrá interactuar con el bot, y en grupos tendrá que mencionaros para responder (útil para no saturar las conversaciones).

Iniciar el Gateway

Ahora viene lo bueno. Arrancamos el gateway con:

openclaw gateway --port 18789 --verbose

Si todo va bien, veréis el mensaje de que el servidor está corriendo. Por defecto, la interfaz de control está disponible en http://127.0.0.1:18789/. Desde ahí podréis gestionar sesiones, ver logs y configurar canales.

Conectar WhatsApp

Esto es lo más chulo. Ejecutad:

openclaw channels login

Os mostrará un código QR que tenéis que escanear con WhatsApp en vuestro móvil (Ajustes ? Dispositivos vinculados ? Vincular dispositivo). Una vez hecho, vuestro número de WhatsApp estará conectado al agente de IA.

Verificar que todo funciona

Para aseguraros de que la instalación está correcta:

openclaw health

Si devuelve OK, estáis listos para empezar a chatear con vuestra IA desde WhatsApp o Telegram.

Algunos trucos que he aprendido

Workspace personalizado: Guardad vuestras skills y configuraciones en ~/.openclaw/workspace. Podéis hacer un repo git privado y así tener backups y control de versiones.
Heartbeats: OpenClaw tiene un sistema de «heartbeats» que permite al agente hacer comprobaciones periódicas (emails, calendario, etc.) y avisaros proactivamente.
Sesiones: Cada conversación es una sesión independiente. Podéis tener diferentes contextos para diferentes tareas.
Skills: La comunidad está creando skills para todo (GitHub, Notion, Slack…). Echad un vistazo al repositorio oficial.

Conclusión

OpenClaw es una de esas herramientas que, una vez que las pruebas, te preguntas cómo has vivido sin ellas. Tener un agente de IA verdaderamente personal, que corre en tu máquina y se integra con tus apps de mensajería habituales, es una experiencia que no tiene nada que ver con los asistentes en la nube.

Eso sí, requiere cierto nivel técnico y ganas de trastear. Si os gusta eso de «romper cosas para entenderlas», OpenClaw es vuestro sitio. ¿Ya lo habéis probado? Contadme vuestras experiencias en los comentarios.

Nota: Este post es una guía introductoria. Para configuraciones avanzadas y troubleshooting, consultad la documentación oficial.

Agentes de código abierto

Posted on 11 diciembre 2025 por Jose Antonio

Como hemos visto en anteriores entregas, podemos utilizar distintos modelos de IA en distintos agentes. Vimos como usar glm con claude-code, hemos visto como utilizar mcps también en claude-code o en github copilot pero lo ideal sería no depender de un agente comercial, entendiendo como tal alguno que va ligado a algún modelo o ide. Por eso me he puesto a buscar y he encontrado un par de ellos. En esta entrada vamos a intentar configurarlos para que funcionen con los modelos de IA a los que tenemos acceso e incluso añadirles acceso a mcps.

goose

El primero que encontré y que me parece perfecto en muchos aspectos se llama goose, podéis encontrarlo en https://github.com/block/goose

Instalación

nada más sencillo que seguir las instrucciones de https://block.github.io/goose/docs/getting-started/installation/ en mi caso y como uso ubuntu solo tuve que ejecutar:

wget https://github.com/block/goose/releases/download/v1.16.1/goose_1.16.1_amd64.deb
sudo dpkg -i goose_1.16.1_amd64.deb

Os recomiendo que os paseis a ver si hay una versión más nueva a esta que he usado yo.

Si todo ha ido bien solo tienes que buscar goose en el menú y ejecutarlo (o goose desde la terminal)

Configurar el LLM

Vamos a usar como ejemplo lo que vimos en la entrada sobre LLM baratos, el glm-4.6. Para ello pulsaremos en el icono de abajo con forma de robot y seleccionaremos «Change Model»

Eso permitirá acceder a un desplegable con los modelos disponibles. Como inicialmente no tendrás ninguno habrá que seleccionar la opción «Use other provider» que nos sacará una pantalla como esta:

Tal como hicimos con claude vamos a usar una configuración personalizada de anthropic. Pinchamos en configure y le ponemos la url y la api key que pusimos la otra vez:

Y eso es todo, luego cuando queramos seleccionar el modelo ya nos aparecerá la opción anthropic y podremos seleccionarla

Ahora ya podemos preguntarle lo que queramos a nuestro agente que contará con el modelo integrado.

Modos de funcionamiento

Si os fijáis en la parte de abajo a la derecha veréis que hay un marcador que indica el modo en el que está tabajando el agente, en mi caso lo tengo en «Autonomous» que es como darle carta blanca para que haga lo que hay que hacer, pero también tiene otros modos:

Y para cada uno de los modos puedes configurar los permisos para cada una de las extensiones.

Extensiones

Como ya dijimos al principio vamos a darle herramientas a nuestro nuevo agente, en este caso el mismo mcp que usamos en esta otra entrada, para ello nada más sencillo que ir a la opción Extensión en el menú principal que nos llevará a una ventana como esta:

Creamos una extensión nueva y le ponemos los datos tal que así (solo hay que poner en el comando lo que antes poníamos como un array json y rellenar las variables de entorno):

Y luego la activamos (aparecerá arriba). Con eso ya podemos volver a usar la herramienta nueva desde goose preguntando cosas como:

¿puedes recuperar un documento de outline llamado API docufactu y hacerme un resumen?

A este agente se le pueden añadir modelos locales como por ejemplo modelos de ollama que tengas corriendo en tu ordenador además de los más populares. También puede usar directamente github copilot sin entrar al VScode.

Si queréis instalar la versión para terminal también se puede, el único problema es que el ejecutable se llama exactamente igual (goose) que el que hemos usado para lanzar la UI (se guarda en otro directorio) por lo que tendréis goose UI si lo seleccionas por el menu y goose linea de comando si lo ejecutas desde una terminal (también depende del orden que tengas en tu path).

Lo siguiente que quería hacer es instalar opencode, pero creo que lo voy a dejar para una siguiente entrada. Disfrutad de goose lo que podáis.

Si te suena VeriFactu, tienes que leer esto

Posted on 1 diciembre 2025 por Jose Antonio

Desde hace unos meses hay una palabra que suena mucho por todas partes, no es una peli, no es un disco, no es un nuevo escándalo financiero y no afecta a todo el mundo… Pero es algo muy importante para pymes y autónomos, esa palabra es VeriFactu (o Veri*Factu).

Facturas alocadas por Veri*Factu a la espera de DocuFactu

¿Qué es Veri*Factu?

VERI*FACTU es el nuevo sistema de emisión de facturas “verificables” definido por la Agencia Tributaria española dentro de la Ley Antifraude, pensado para que el software de facturación genere registros inalterables y, opcionalmente, los envíe en tiempo real a Hacienda.

¿Porqué se está hablando de esto?

Se habla tanto de VERI*FACTU en estos meses porque su implementación obligatoria se acerca rápidamente, con plazos clave en 2025-2026 que generan urgencia entre pymes, autónomos y desarrolladores de software.

El 29 de julio de 2025 era la fecha límite para que los fabricantes adapten y homologuen sus programas de facturación.?
Desde el 1 de enero de 2026, las sociedades mercantiles deben usar sistemas compatibles; para autónomos y personas físicas, el 1 de julio de 2026.?

Artículos recientes destacan que solo el 8% de pymes está preparado, con un mes restante para la primera fase.?

Cómo funciona en la práctica

El programa de facturación genera, por cada factura, un registro firmado electrónicamente, con huella (hash) y datos clave (número, fecha, importe, NIF, tipo de factura, etc.), y lo encadena con los anteriores para asegurar la trazabilidad.?

En modo “VeriFactu”, el software envía estos registros automáticamente a la AEAT; en modo “no VeriFactu”, los conserva y solo los remite si se le requieren, pero cumpliendo igualmente requisitos estrictos de seguridad y conservación.?

Las facturas incluyen un código QR que permite a cliente y AEAT comprobar que la factura está registrada, así como la leyenda “VERIFACTU” o “Factura verificable en la sede electrónica de la AEAT”.?

Esa marca funciona como “sello de calidad fiscal”: indica que el emisor usa un sistema que cumple con el reglamento de facturación verificable y con los requisitos técnicos oficiales.

De hecho, según las respuestas a preguntas frecuentes de la AEAT. incluso si se elige el modo «no VeriFactu» se debería incluir el código QR siempre que se haya generado con un programa informático que tenga la opción «no VeriFactu».

¿Qué puedo hacer o como desarrollador?

En primer lugar informarte sobre todo esto, ya que tarde o temprano terminará cayendo sobre ti parte de este marrón. La información principal puedes encontrarla en la AEAT, y si no queréis cambiar de sistema de generación de facturas todavía, os recomiendo utilizar DocuFactu. DocuFactu es un sistema sencillo que permite, en base a las facturas en el formato actual generar e incrustar un QR verificable en la misma para que cumpla la normativa. Además, si deseas usar el modo VeriFactu usa inteligencia artificial para extraer los datos de la factura y enviarlos al registro de la agencia tributaria en tu nombre. Tiene una API muy sencilla (REST con API KEY) y permite cumplir con la ley sin demasiados quebraderos de cabeza. Si queréis más información, solo tenéis que visitar su web (DocuFactu – VeriFactu fácil) o enviar un correo a info@docufactu.com.

En un mes justo veremos si esto echa a andar o los múltiples problemas que nos genera tener que adaptar algo tan importante como la facturación a una norma tan restrictiva hacen que se retrase su puesta en marcha.

Conectar claude code con MCPs

Posted on 8 noviembre 2025 por Jose Antonio

Como ya contamos en una entrada anterior La IA más barata para generar código, podemos utilizar claude code con otras IAs además de las de Anthropic, y esto es muy bueno porque nos da muchas herramientas de agente inteligente como la nada despreciable posibilidad de conectar con servidores MCP.

Para este ejemplo vamos a utilizar outline, que, para el que no lo conozca, es un excelente editor de documentos al estilo notion y que yo uso, junto con mi equipo, para dejar la documentación de los proyectos y ahora vamos a ver cómo podemos integrar esta documentación con nuestra IA favorita para programar.

Lo primero que tenemos que hacer es conseguir una clave de API en outline. Eso se consigue en la ruta /settings/api-and-apps donde pediremos crear una nueva clave api

Una vez creada más vale que os la copieis rápido porque no vais a poder volver a recuperarla después.

Una vez que tenemos instalado claude code y sus prerequisitos (que podéis ver en la entrada anterior) tendremos en nuestra raíz de usuario un archivo llamado .claude.json que tiene, entre otras cosas, las definiciones de los mcp.

El fragmento que tenemos que añadir es:

       "mcpServers": {
        "outline": {
          "type": "stdio",
          "command": "docker",
          "args": [
            "run",
            "-i",
            "--rm",
            "--init",
            "-e",
            "DOCKER_CONTAINER=true",
            "-e",
            "OUTLINE_API_KEY",
            "-e",
            "OUTLINE_API_URL",
            "biblioeteca/mcp-outline"
          ],
          "env": {
            "OUTLINE_API_KEY": "ol_api_.....",
            "OUTLINE_API_URL": "https://<servidor>/api"
          }
        },

Yo lo he añadido bajo la línea «mcpContextUris»: [] dentro de uno de los proyectos donde lo quiero usar. Evidentemente para usar este mcp necesitas tener docker instalado (doy por hecho que si estás aquí eres de los míos y lo usas diariamente).

Una vez que has grabado el archivo y arrancas claude en el directorio del proyecto en cuestión le puedes preguntar por la lista de mcps:

$ claude mcp list
Checking MCP server health...

outline: docker run -i --rm --init -e DOCKER_CONTAINER=true -e OUTLINE_API_KEY -e OUTLINE_API_URL biblioeteca/mcp-outline - ? Connected

Y ya puedes hacer que la magia surja…

Y darle que si a todos los permisos que pida

Y ya podrías pedirle que te lea documentos como requisitos para programar o que, como en este caso, que nos documente el api que acabamos de construir en el proyecto

¿puedes crear un documento llamado API DocuFactu en esa colección con la documentación sobre el API (solo la parte verifactu) que incluya ejemplos de uso usando una APIKEY?

Y este es el resultado… (solo parte)

Como todo lo que hace la IA luego alguien que sepa tiene que retocarlo y corregirlo (aquí también se puede inventar cosas), pero el caso es que ya tenemos mucho trabajo adelantado.

Hay miles de mcp con los que podemos interactuar por ahí… Solo tienes que buscarlo o, sino, construir el tuyo propio que, igual, lo hacemos aquí cuando tengamos un rato.