Lliben Logo Lliben

Nota: las herramientas de IA avanzan muy rápido. Esta guía refleja lo que me funcionó cuando la escribí, y partes pueden quedar desactualizadas en unos meses. La actualizaré cuando el flujo cambie de forma relevante.

En breve

  • Soy analista de datos, sin experiencia en desarrollo, y construí una extensión de capturas para Chrome + la web usando IA.
  • Usé sobre todo Gemini para implementar y ChatGPT como “segunda opinión” para depurar y traducir.
  • La mayor lección: arquitectura + limpieza por hitos importan más que prompts gigantes.

Analista de datos, sin experiencia dev — construí una extensión completa con IA (experiencia)

Soy analista de datos de profesión y no entiendo nada de programación. Aun así, puedo aumentar o disminuir el radio y el tamaño de fuente en CSS, añadir una comilla de cierre en HTML… y poco más. No tengo ni idea de qué es JavaScript ni por qué funciona.

El proceso puede parecer trivial para un desarrollador. Pero para alguien sin experiencia en software, es interesante mirar atrás. Me llevó casi un año llegar aquí.

Todo lo que hay en la extensión, la web o lo que lees abajo ha sido desarrollado o revisado por una IA. Seguro que aún hay fallos de estilo, pero sin IA habría muchos más.

¿De qué va esto?

Construí una extensión de capturas para Chrome. Soporta: parte visible, página completa (captura larga), área seleccionada y selector de elementos, con padding y temporizador. Hay una página de edición (Lliben Capture) donde puedes recortar, anotar y exportar (Copiar, PDF, PNG, JPG) o imprimir.

Tiene cuatro componentes principales:

  1. Popup
  2. Ajustes
  3. Página visor/editor (Lliben Capture — se abre después de capturar)
  4. Sitio web

Aquí van algunas capturas del proyecto:

Popup de Lliben con modos de captura y acciones rápidas

Página de ajustes de Lliben con configuración de captura y exportación

Editor Lliben Capture con herramientas de anotación y exportación

Stack técnico

  1. Google AI Studio
  2. ChatGPT
  3. Visual Studio Code
  4. GitHub (los cambios de la web se hacen vía GitHub)
  5. Cloudflare Workers & Pages (GitHub despliega y compila la versión final)
  6. Resend (formularios de contacto y comentarios)
  7. Apple Email (almacenamiento barato + dominio propio, pero requiere ecosistema Apple)
  8. Stripe (pagos)

Email y pagos no eran estrictamente necesarios. Podría haber usado Gmail o Outlook. Pero quería una estructura “de empresa”: todo en su sitio, incluyendo monetización.

No creo que esto me haga independiente financieramente de la noche a la mañana. Pero sí quiero llevarlo lo más lejos posible hasta poder mirarlo y decir: “Ahora sí, está perfecto.”

Cómo empezó

Empecé el proyecto a principios de año. Lo intenté desde cero unas 200 veces (ojalá exagerara) y lo dejé. Con perspectiva, no conocer las herramientas de desarrollo influyó muchísimo. Recuerdo googlear cómo cambiar el tema y el tamaño de fuente en VS Code.

En junio/julio lo retomé. Ya tenía una base y no tuve que volver a pelearme con herramientas, carpetas o cómo compilar.

Gemini

Escribí aproximadamente el 90% con Gemini y el 10% con ChatGPT. La web y sus features están hechas con Gemini, y usé ChatGPT para traducir del inglés a otros idiomas.

Gemini funciona muy bien, pero es casi imposible hacer que “pare de programar”. Incluso cuando digo “estamos brainstormeando, no cambies código”, lo hace. Probé muchas variantes y reglas, pero seguía pasando. Fue mi mayor frustración con Gemini.

ChatGPT

Cuando me atascaba con Gemini, pasaba a ChatGPT para entender la causa y brainstormear. Sus recomendaciones eran muy buenas. Si nada funcionaba, pegaba el código de la feature y pedía una review o un rewrite manteniendo mis variables, y luego probaba varias versiones.

A veces llevaba el código de ChatGPT de vuelta a Gemini para preguntar qué estrategia estaba usando y si era mejor. Me quedé atascado semanas en algunos problemas, pero pude resolver todos los bugs con este enfoque.

El mayor punto débil que he visto en ChatGPT hasta ahora es SVG. No funciona bien y no se acerca a Gemini cuando se trata de generar iconos SVG correctos.

Claude

No llegué a testearlo a fondo. Las veces que lo probé generó demasiado código y complicó cosas. Vuelvo a él cuando nada funciona — pero muchas veces entro con un problema y salgo con 100.

Lo más importante para mí

  1. La “context awareness” o límites enormes de tokens no son tan importantes como parecen: es la cantidad máxima de texto que el modelo maneja (input + contexto + output). Gemini 2.5 Pro (más de 1M tokens) fue suficiente. Me funcionó mejor avanzar feature por feature que hacer 2–3 a la vez.
  2. La arquitectura es lo más importante: si no entiendes la arquitectura, algunos bugs serán casi imposibles de arreglar. Y aunque los arregles, volverán con cambios pequeños.
  3. Escribe tú mismo al menos en un idioma: yo escribí todo en inglés y luego traduje con IA. La IA suele escribir demasiado “marketing”.
  4. Empieza con máximo 2 idiomas: cada cambio hace que se actualicen más cosas. Con muchas traducciones, cada iteración se vuelve lenta.
  5. Usa varios modelos.
  6. Limpia el código una y otra vez: tras un hito, elimina dead code, comentarios y archivos vacíos.
  7. Define casos de uso y comportamiento: ayuda a detectar problemas de lógica. Por ejemplo, la captura completa era lenta porque el “ensamblado” ocurría durante la captura. Moví esa parte a Lliben Capture y fue mucho más rápido.
  8. Aprovecha librerías públicas: para PDF e impresión A4 utilicé jsPDF. Funcionó muy bien.

Un último punto

Muchas plataformas “AI coding” son básicamente VS Code con otra piel. ¿Por qué no usar VS Code directamente y evitar lock‑in?

Lo que aún no he probado

Lo único que no he probado en serio es si el sistema de pago funciona en producción. Stripe va bien en sandbox, pero se siente raro pedir a amigos/familia que donen.

Si eres desarrollador

Si tienes experiencia, me encantaría recibir comentarios sobre la extensión, sus funciones o el diseño de la web. Es mi primer proyecto completo en producción. Cualquier crítica me sirve.

Extensión: Chrome Web Store – Lliben

Web: https://lliben.com/

Conclusión

El espacio entre idea e implementación se ha vuelto muy pequeño.

Como analista de datos, es una locura ver lo rápido que avanza la IA en programación.

Por un lado, cualquiera con una idea puede construir algo real. Por otro: ¿qué pasa con los desarrolladores con experiencia cuyo trabajo es escribir código?

No sé si es bueno o malo.

Sin IA, no me habría atrevido ni a intentarlo.

Entonces… ¿puedo llamarme desarrollador?