Como growth marketer no solo gestiono campañas. Diseño experiencias, interpreto datos de comportamiento, coordino departamentos y ahora también construyo interfaces funcionales, a veces en el mismo día. Google Stitch es una de las herramientas que está haciendo posible ese salto.
Este artículo contiene una plantilla de prompt al final. Puedes ir directamente al apartado clicando aquí.
El problema no era la creatividad. Era la dependencia.
Si has trabajado algún tiempo en marketing digital, ya conoces la frustración.
Tienes la hipótesis y los datos que la respaldan. Tienes claro que hay que cambiar en la landing, en el flujo de registro o en la experiencia para los usuarios nuevos. Pero entre la idea y la ejecución hay infinitas reuniones, decenas de revisiones con el equipo de diseño, una cola de tickets abiertos de los developers y al menos tres semanas de calendario.
El problema nunca fue la creatividad. Fue la dependencia que tenemos de otros equipos.
El mayor cuello de botella para un growth marketer no es la falta de ideas, sino la distancia entre la idea y su ejecución.
Durante años este ha sido uno de los costes ocultos del marketing digital: la velocidad de aprendizaje está limitada por la velocidad y capacidad de iteración, y la velocidad y capacidad de iterar depende de recursos que se escapan de tu control.
Estos días he probado Google Stitch y entre esto y Claude Code, todo lo que digo hasta aquí ha cambiado.
El techo de cristal del growth marketer tradicional
Antes de ser freelance, trabajé en agencia durante un total de 7 años. El límite era evidente: estaba restringido por los servicios que el cliente había contratado. Si veía una oportunidad en la experiencia de usuario o en el diseño de una página, mi función se limitaba a documentar, recomendar e intentar apretar para conseguir vender el servicio. La ejecución era de otro equipo, con otro calendario, con otros criterios.
Cuando pasé a trabajar como freelance, conseguí más libertad. Aún así, para según qué tareas complejas, como campañas de email marketing o desarrollos web, seguía dependiendo de otros especialistas para ejecutar. Mi aportación era estratégica, pero alguien más tenía que traducirla a código.
El resultado: ciclos largos de revisión, juego del teléfono desde mi propuesta de idea y lo que se publicaba y clientes que pierden el entusiasmo inicial mientras esperaban ver algo tangible.
El salto: de operador a constructor
Hace unos meses empecé a experimentar con Claude Code y ahora con Google Stitch para prototipar productos digitales. Algo que ha empezado como una prueba interna ahora mismo ya forma parte de mis flujos de trabajo.
Ahora puedo ejecutar y entregar por mí mismo. No como sustituto de un diseñador senior, sino como alguien que puede materializar ideas con suficiente fidelidad como para validarlas, presentarlas e incluso desarrollarlas y publicarlas.
El cambio no es sólo operativo, es también conceptual. Cuando puedes pasar de datos de comportamiento a un mockup funcional en horas, el tipo de conversaciones que tienes con los clientes cambia. Ya no presento ideas, ahora también presento soluciones. Y la diferencia entre ambas es enorme en términos de confianza y velocidad de decisión, especialmente en start-ups donde el ritmo ya de por sí es alto.
Qué es Google Stitch y por qué importa ahora
Google Stitch es una herramienta de prototipado impulsada por inteligencia artificial, desarrollada por Google Labs. Permite generar mockups de interfaces, páginas web y flujos de usuario a partir de prompts, referencias visuales y archivos existentes.
Es un sistema que entiende contexto, estilo y estructura, y genera propuestas visuales que puedes iterar rápidamente, un Figma pero en esteroides.
En la práctica, esto significa que un growth marketer con buen criterio analítico, datos de comportamiento de usuario y claridad sobre lo que necesita cambiar puede generar propuestas de diseño concretas sin necesidad de dominar herramientas de diseño profesional.
Google Stitch no reemplaza el buen gusto ni el pensamiento crítico. Los amplifica. La diferencia la pone quien lo usa.
Tres casos reales, tres tipos de impacto
Caso 1: SaaS de gestión de emisiones de carbono
Evaluamos un rediseño de una landing que ayudaba al usuario a calcular las emisiones de carbono de su empresa. El briefing existía, los datos de uso de la herramienta estaban disponibles en Clarity, pero el equipo de diseño tenía la agenda ocupada durante semanas y los developers tenían proyectos en la UI del SaaS que tenían prioridad.
Con Google Stitch, generé una propuesta de landing completa dedicándole una mañana: estructura de contenido, secciones, jerarquía visual, CTA principal y flujo hacia la herramienta. Iteré tres versiones antes de presentarla al equipo. El feedback fue positivo desde la primera llamada.
Tiempo ahorrado respecto al proceso tradicional: aproximadamente el 70 por ciento del ciclo habitual.
Caso 2: Aseguradora de Riesgo Digital con IA
Para esta ciberaseguradora, el reto era diferente: no partir de cero, sino crear una plantilla de landing page replicable para sus diferentes tipologías de recursos. Cada landing tenía que mantener coherencia de marca pero adaptarse a audiencias distintas en función del recurso que queramos poner: landings de industria, landings de producto, páginas de recursos descargables…
Subí los archivos del sitio actual a la herramienta, definí las variaciones necesarias y generé el esqueleto de la plantilla. El resultado fue un sistema modular que el equipo interno pudo adoptar directamente, sin necesidad de empezar desde cero en cada nuevo activo. Sin embargo, es importante recalcar que no es un se genera mock-up y se traduce directamente en desarrollo. Google Stitch normalmente no generará una landing completamente fidedigna a la marca de la empresa y se tienen que hacer varias revisiones así como tener en cuenta cambios.
Caso 3: Proptech de Compra y Venta de Nuda Propiedad
El cliente opera en el sector de real estate con un producto especializado: la compra y venta de la Nuda Propiedad. Un producto financiero complejo que necesita ser explicado con claridad antes de que el usuario tome ninguna decisión.
El reto era diseñar un flujo de simulación que guiara al usuario paso a paso, redujera la fricción cognitiva y generara suficiente confianza como para solicitar una llamada. Ya teníamos una calculadora hecha con Outgrow que estaba generando muy buenos resultados pero, aprovechando que pasamos todas las landings al site propio, generamos el nuevo prototipo de flujo basándonos en datos de comportamiento de Clarity y prompts específicos en Google Stitch. El cliente pudo ver la lógica del recorrido de usuario de forma clara antes de que se escribiera una sola línea de código. Otra vez, importante remarcar que la landing ideada en Stitch no es un resultado 100% preciso de lo que luego se traslada al desarrollo.
El flujo de trabajo: de los datos al mockup en nada
Este es el flujo que he estandarizado y que replica resultados consistentes:
- Subir los archivos del sitio web actual a Claude Web. Esto le da contexto estructural, de estilo y de contenido. El modelo entiende de dónde parte el diseño, no trabaja en el vacío.
- Cargar los datos de Microsoft Clarity. Grabaciones de sesión, mapas de calor, zonas de abandono, clicks fallidos. Con esto consigo la intuición en hipótesis basadas en comportamiento real.
- Analizar el comportamiento. Con datos de las dos fuentes, la IA puede identificar fricciones concretas: dónde se pierde atención, dónde hay confusión visual, dónde el CTA no convierte.
- Generar los prompts para Google Stitch. Un prompt vago produce resultados vagos. Un prompt con contexto de marca, audiencia, objetivo de conversión y referencia de estilo produce propuestas útiles. La propia IA, con todos los resultados, puede generar un prompt para Stitch mucho más preciso y de valor que el que podría producir yo.
- Crear los mockups e iterar. Google Stitch genera opciones visuales que puedes refinar en tiempo real. Tres o cuatro iteraciones en una o dos horas son perfectamente viables.
- Validar con el cliente antes de desarrollarlo. Esta es la ventaja más infravalorada: el cliente ve algo tangible antes de que haya una sola línea de código. El feedback en esta fase es mucho más útil y preciso.
- Pasar a desarrollo o a Claude Code. Una vez validado el prototipo, el traspaso a desarrollo es mucho más limpio. Si trabajas con Claude Code, traducir el mockup directamente a código funcional es mucho más sencillo porque puedes descargar el prototipo en HTML.
Esto cambia las reglas, no solamente las herramientas
Velocidad
El ciclo de diseño tradicional tiene costes ocultos enormes: reunión de briefing, propuesta, revisión, ajustes, segunda revisión, aprobación. Con este flujo, ese ciclo se comprime en horas. Tres semanas pueden convertirse en tres días si le sumas las reuniones. Y en growth, la velocidad de iteración es directamente proporcional a la velocidad de aprendizaje. Siempre pensando en que cuantos más datos tengas mejor podrás conocer a tu público.
Independencia
La autonomía operativa cambia la naturaleza del trabajo. Puedo presentar soluciones completas, no solo recomendaciones. Eso tiene un impacto directo en cómo el cliente percibe el valor que aporto, y en la velocidad con la que se toman decisiones.
Alineación entre datos y UX
La ventaja más profunda no es la velocidad: es la calidad de la conexión entre el insight analítico y la propuesta de diseño. Cuando quien analiza el comportamiento del usuario y quien define la experiencia son la misma persona, se pierde menos en la traducción. El diseño no interpreta los datos, los incorpora directamente.
Para mí, la mayor pérdida en growth no es el tráfico, sino el tener que jugar al juego del teléfono con el resto de equipos.
Implicaciones estratégicas: para fundadores y para marketers
Para fundadores y equipos de producto
Si tu startup está en fase de crecimiento y tu growth marketer necesita un ciclo de tres semanas para probar cambios en la web creo, que después de esto, es un proceso que puede mejorarse bastante: las herramientas existen para acortar ese ciclo. El perfil que buscas no es solo alguien que optimice campañas o que coordine: pienso que ahora también es alguien que pueda cerrar el loop entre el dato de usuario y la experiencia que recibe ese usuario con herramientas que le hagan estar al pie del cañón.
Para growth marketers
La pregunta no es si aprender herramientas de prototipado. La pregunta es cuánto tiempo más podrás diferenciarte solo trabajando con campañas. El mercado está premiando a los perfiles que amplían su rango de ejecución. Dominar el espacio entre los datos y la interfaz es una ventaja competitiva real, y cada vez más accesible.
El growth marketer del próximo ciclo no será solo mejor analista. Será también mejor constructor.
Limitaciones: lo que Google Stitch no hace (y dónde falla)
Esta sección existe porque la honestidad es parte del criterio. Google Stitch es una herramienta potente, pero tiene límites reales que conviene conocer antes de sobreestimar sus capacidades.
- No sustituye a un sistema de diseño maduro. Si tu empresa tiene una guía de estilos consolidada, componentes definidos y un equipo de diseño con criterio propio, Google Stitch no va a replicar ese nivel de coherencia sin trabajo adicional significativo. Desde mi experiencia, es difícil que alguien que no tiene el mismo criterio que un diseñador sea capaz de replicar los diseños que consigue uno de verdad.
- Requiere inputs estructurados y criterio. Un prompt vago produce un resultado genérico. La calidad del output depende directamente de la calidad del input: contexto de marca, objetivo de conversión, referencia visual, restricciones de diseño. Si no tienes criterio sobre lo que buscas, la herramienta no lo tiene por ti. Hace falta un buen contexto para generar buenos resultados.
- El sello de IA es detectable. Las webs generadas con IA tienen un patrón reconocible. Los usuarios lo perciben cuando falta contenido personalizado: imágenes reales, datos propios, casos específicos, secciones construidas sobre experiencia genuina. Un prototipo generado con Stitch que llega a producción sin personalización profunda se nota. Esa personalización sigue siendo trabajo humano. Mi página web, por más bonita que parezca, tiene secciones claramente atribuibles a la IA.
- No es el punto final del proceso. Es el punto de partida del traspaso a desarrollo. El código resultante necesita revisión, el diseño necesita adaptación a sistemas existentes y la experiencia final sigue requiriendo iteración real con los datos que los usuarios producen durante la navegación.
El futuro: producto y marketing más juntos que nunca
La separación entre quien diseña el crecimiento y quien construye la experiencia siempre ha sido artificial. El producto es marketing. La experiencia del usuario es la campaña más importante que tienes.
Lo que está cambiando es que las herramientas están eliminando las barreras de ejecución que mantuvieron esa separación durante años. Un growth marketer que sabe dónde pierde el usuario, por qué no convierte y qué hipótesis quiere probar tiene ahora la capacidad de materializar esa hipótesis sin esperar a nadie.
Eso no significa que los diseñadores o los desarrolladores sean prescindibles. Significa que el loop de aprendizaje puede acortarse de forma sustancial, y que el perfil que cierra ese loop tiene una ventaja competitiva creciente.
Aunque considero que Google Stitch aún está muy verde para poder considerarse la "herramienta que deja a los diseñadores web sin trabajo", definitivamente abre debates sobre las capacidades de una sola persona al ejecutar diferentes áreas del marketing digital.
El growth marketer que puede pasar del dato al prototipo en el mismo día ya no es un outlier. Empieza a ser el estándar.
Prompt Ready para Google Stitch
Si has leído hasta aquí, mereces una recompensa, es por esto que aquí debajo encontrarás la estructura de prompt que estoy usando ahora para producir mock-ups de valor con Google Stitch.
Diseña un mockup de landing page altamente orientado a conversión para una plataforma B2B SaaS.
Sigue estrictamente la estructura, estilo y requisitos definidos a continuación.
---
[1. OBJETIVO]
Crear una landing page que maximice la conversión (demo, registro o contacto),
comunicando claramente el valor del producto.
---
[2. DESCRIPCIÓN DEL PRODUCTO]
Nombre del producto:
[INSERTAR NOMBRE]
Descripción breve:
[DESCRIBE EN 1–2 FRASES QUÉ HACE]
Qué permite hacer al usuario:
- [FUNCIONALIDAD PRINCIPAL 1]
- [FUNCIONALIDAD PRINCIPAL 2]
- [FUNCIONALIDAD PRINCIPAL 3]
- [FUNCIONALIDAD PRINCIPAL 4]
- [PROBLEMA QUE ELIMINA]
---
[3. PÚBLICO OBJETIVO]
Perfiles:
- [PERFIL 1]
- [PERFIL 2]
- [PERFIL 3]
- [PERFIL 4]
Características del público:
- Nivel técnico: [BAJO / MEDIO / ALTO]
- Herramientas actuales: [HERRAMIENTAS]
- Frustraciones: [PAINS CLAVE]
- Qué buscan: [BENEFICIOS]
- Nivel de escepticismo: [BAJO / MEDIO / ALTO]
---
[4. PROPUESTA DE VALOR]
Propuesta principal:
"[PROPUESTA CLARA Y ORIENTADA A RESULTADO]"
Ángulos alternativos:
- "[ÁNGULO 1]"
- "[ÁNGULO 2]"
- "[ÁNGULO 3]"
---
[5. ESTRUCTURA DE LA LANDING]
5.1 Hero Section
- Titular centrado en resultado (velocidad, claridad, ROI, etc.)
- Subtítulo explicando el producto de forma simple
- CTA principal: [EJ. "Solicitar demo"]
- CTA secundario: [EJ. "Ver cómo funciona"]
- Visual: [DESCRIBIR IDEA VISUAL]
---
5.2 Sección Problema
Mostrar claramente:
- [PROBLEMA 1]
- [PROBLEMA 2]
- [PROBLEMA 3]
- [PROBLEMA 4]
Usar contraste visual: caos vs claridad
---
5.3 Sección Solución
Explicar el funcionamiento:
1. [PASO 1]
2. [PASO 2]
3. [PASO 3]
4. [PASO 4]
Representar como flujo visual simple
---
5.4 Features / Funcionalidades
Presentar en tarjetas:
- [FEATURE 1]
- [FEATURE 2]
- [FEATURE 3]
- [FEATURE 4]
- [FEATURE 5]
- [FEATURE 6]
---
5.5 Casos de Uso
Formato:
Input (pregunta del usuario) → Output (respuesta/insight)
Ejemplos:
- "[PREGUNTA 1]"
- "[PREGUNTA 2]"
- "[PREGUNTA 3]"
- "[PREGUNTA 4]"
---
5.6 Prueba Social
- Logos: [EMPRESAS]
- Testimonios: [TIPO DE PERFIL]
---
5.7 Cómo Funciona (técnico, simplificado)
- [CAPA PRINCIPAL]
- [APIs / INTEGRACIONES]
- [INTERFAZ]
- [OUTPUTS]
Mantener credibilidad sin complejidad excesiva
---
5.8 CTA Final
- Reforzar propuesta de valor
- CTA principal: [CTA]
- CTA secundario: [OPCIONAL]
---
[6. ESTILO DE DISEÑO]
- Moderno, minimalista, limpio
- Inspiración: Stripe, Linear, Vercel (u otros similares)
- Profesional (evitar estilo genérico)
- Explorar modo claro u oscuro
- Usar:
- Gradientes sutiles
- Grids
- Visualizaciones de datos
- Incluir mockups reales de producto
---
[7. TONO]
- Claro y directo
- Seguro y técnico pero accesible
- Sin buzzwords innecesarios
- Enfocado en resultados
---
[8. REQUISITOS DE OUTPUT]
- Mockup completo de landing
- Desktop-first (responsive opcional)
- Incluir:
- Gráficos
- Tablas
- Interfaces tipo query
- Usar placeholders solo si es necesario
---
[9. DIRECCIÓN ESTRATÉGICA]
- Evitar plantillas SaaS genéricas
- Posicionar el producto como:
[EJ. "Infraestructura de datos", "Capa de inteligencia", etc.]
El diseño debe transmitir:
- Precisión
- Potencia
- Confianza
---
Genera la landing completa siguiendo esta estructura.Si trabajas en un proyecto de SaaS, insurtech, proptech o cualquier sector donde la experiencia de usuario es parte del funnel de adquisición, y quieres explorar cómo acortar el ciclo entre el insight y la ejecución, puedes reservar una llamada conmigo en el formulario.