5 min

Content marketing con IA: la forma correcta

El content marketing con IA bien hecho multiplica tu productividad sin sustituir la creatividad. Cómo construimos un planificador de presupuesto interactivo con Claude, Cloudflare y React.

No puedes salirte con la copia de IA si quieres que tu rendimiento SEO sea fiable. Mi conclusión: la IA debería usarse para mejorar la productividad humana; no puede sustituir la creatividad humana.

Pero sí creo que podemos usar IA para construir contenido interesante, con algo de cabeza y las herramientas adecuadas. Mis reflexiones me llevan a para lo que sirven las herramientas de IA: ser capaz de hacer cosas uno mismo que de otro modo necesitarías ayuda para construir.


Cuando dirigía Builtvisible (ahora vendida a Brave Bison), estábamos muy en la vanguardia de lo que llamábamos "infografías interactivas". Normalmente, apps muy simples basadas en navegador con jQuery, HTML y CSS. Era genial para nuestras ventas (las cosas chulas tienden a llamar la atención en las presentaciones) y muchos de estos assets eran imanes de enlaces increíbles. ¡Pero eso fue hace una década!

En aquel entonces, un gran problema con estas construcciones era la sobrecarga. Podías cobrar a un cliente una suma de cifras medias de 4 dígitos por uno de estos "interactives" sencillos antes de que se promocionara. Sobre todo, por la sobrecarga y la necesidad razonable de beneficio operativo. Tendríamos al menos 1 desarrollador, trabajando con un diseñador, trabajando con el equipo de SEO… Pillas la idea.

¡Pero estamos en 2026 y tenemos un montón de juguetes nuevos con los que jugar! Con "nosotros" me refiero a equipos pequeños, individuos y marketers internos que, con IA, pueden hacer el trabajo de un equipo de 5 en unos días en lugar de semanas. Es tentador decir "un día" pero tu primer rodeo nunca sale según lo planeado.

Y con "juguetes" me refiero a Claude, configurado justamente de la manera adecuada para poder desarrollar, desplegar e incluso probar.

Mybeautifulbudget.com: un planificador de presupuesto interactivo con análisis de IA entretejido

Primero: la parte técnica

No voy a meterme demasiado fuerte en la parte técnica en este artículo, sobre todo porque no quiero asustar a nadie. Sin embargo, poder construir con IA es un reto de aprendizaje y requiere que entiendas más o menos la parte de "¿cómo funciona?".

La pila es React 19 con Vite 7 para el frontend, todo el procesamiento del lado cliente salvo las recomendaciones de IA. Cuando rellenas tu presupuesto, el planificador calcula localmente en tu navegador usando JavaScript estándar para producir totales de ingresos, desgloses de gastos, tasa de ahorro y demás. La generación de PDF usa jsPDF 4 con jspdf-autotable, y las exportaciones a Excel usan ExcelJS. Ambas exportaciones ocurren totalmente en tu navegador, sin subidas a servidor. Bastante bueno para una herramienta gratuita, ¡creo!

La función de recomendación de IA es la única parte que golpea un servidor. Cuando haces clic en "Get Personalised Recommendations", tus cifras de presupuesto (solo los números, sin detalles personales) se envían a un Cloudflare Worker ejecutando Llama 3.3 70B vía Workers AI.

El prompt compara tu gasto con benchmarks regionales, costes de vivienda en el Reino Unido frente a EE. UU., ese tipo de cosas, y devuelve un objeto JSON con observaciones y prioridades del LLM. Los datos se procesan en tiempo real y se descartan de inmediato, no se almacena nada. Es casi tan privado como puedes hacerlo, salvo por Plausible Analytics, que es literalmente una app de analítica centrada en la privacidad.

El despliegue corre a través de GitHub Actions. Push a master, GitHub construye el bundle de Vite, despliega a Cloudflare Pages y todo va a producción en unos 90 segundos.

La gamificación (XP, logros, seguimiento de progreso) es pura gestión de estado del lado cliente con hooks de React. Framer Motion 12 gestiona las animaciones, esas transiciones cuando desbloqueas logros o ves tu tasa de ahorro subir. Todo el conjunto pesa unos 2,6 MB tras la minificación (sobre todo Recharts y ExcelJS), lo cual es sustancioso pero aceptable para una app de página única que funciona offline una vez cargada.

Mantenimiento y seguridad

En cuanto a seguridad, necesitas ejecutar npm audit para comprobar que todo está bien. Uso Snyk para el seguimiento de seguridad, que crea una pull request si se encuentra una vulnerabilidad en una de las librerías. Empezó con 4 vulnerabilidades (1 crítica, 2 altas, 1 moderada) y pasé un día a principios de enero actualizando todo.

Claude con Desktop Commander gestionó la mayor parte del trabajo pesado durante el desarrollo. Describía lo que quería ("haz que la IA trate los ingresos personalizados como ingresos, no como gastos"), Claude modificaba los componentes de React y las funciones del Worker, ejecutaba los builds, probaba en local, commiteaba a Git y desplegaba a Cloudflare. Todo el flujo de trabajo, del bug report al arreglo en producción, es automático. Justo como hacen esas apps SaaS de vibe coding.

Ejecutando unas pruebas SEO

La sección noscript (ver con JavaScript deshabilitado) es deliberadamente verbosa porque casi todo el tráfico viene de usuarios de ChatGPT (creo: preguntando sobre planificación de presupuesto —¡por confirmar!). Pensé en hacer esto (sí, se siente muy a estrategia SEO de hacia 2004, pero es interesante). El HTML incluye 23 KB de marcado de esquema estructurado explicando qué hace la app, qué preguntas responde y cómo se compara con competidores como MoneyHelper o PocketGuard.

Funciones

La función de recomendaciones de IA compara tu gasto con benchmarks regionales y te dice dónde te estás pasando. Vivienda demasiado alta para tus ingresos, ese tipo de cosas; luego sugiere recortes específicos o te felicita por un buen trabajo. Como mencioné en la parte técnica, puedes exportar a PDF para un informe bonito o a Excel si quieres trastear con unas fórmulas o añadir tú mismo algunos datos específicos privados.

Analizador inteligente de dinero —enviar

El objetivo del proyecto era aprender los AI workers de Cloudflare para un proyecto mayor basado en feeds de trabajos/contenido que llevo construyendo (de ahí la sección de empleos de IA en este sitio web, sobre la que escribiré pronto).

Salida de la revisión del presupuesto con IA

La salida del análisis es, por supuesto, solo un prompt ejecutándose en el AI worker. Llama se mostró un poco reacio a hacer el trabajo y, francamente, dado el encargo, es todo un poco sobredimensionado para la tarea. Creo que o4-mini podría haber hecho un buen trabajo. Algo que probar.

Content marketing con IA

Así que, aquí es hacia donde creo que nos dirigimos: no trabajar con IA para copiar y pegar contenido plagiado de un navegador web, sino capacitar básicamente a cualquiera para aprender a hacer cosas más grandes por sí mismo.

Todo el mundo tiene ideas, pero la ejecución siempre ha sido cara. Esto ya no es así, y depende de verdad de tus ganas de aprender un conjunto de habilidades totalmente nuevo, pero sencillo de coger. Lleva tiempo, paciencia, perseverancia y unas cuantas madrugadas. O ayuda de alguien que haya estado ahí (ponte en contacto).

Para los clientes, los equipos internos, esto significa algo particularmente radical. No importa mucho lo pequeño o grande que sea la empresa: cada uno de tus departamentos debería tener investigación y desarrollo de IA ocurriendo para adaptarse a las necesidades individuales de un equipo concreto. Imagina si tu equipo de contenidos de 10 personas pudiera construir y desplegar cosas como esta. Costes abajo, productividad arriba (con la ayuda adecuada) y necesidades del cliente cubiertas.

Tráfico de Mybeautifulbudget.com —sobre todo de ChatGPT

El tráfico fue una sorpresa, porque esto se supone que era un proyecto de aprendizaje. ¡Pero aquí estamos sin promoción y el tráfico ha empezado a gotear!

Artículos relacionados