Mismo botón, a mano y con Claude Code: medí el tiempo y la calidad

Cómo va todo?

Te cuento qué hice en el último vídeo…

Monté un componente botón en Figma. Uno completo: label, icono izquierdo, icono derecho, tres tamaños (sm, md y lg) y tres estados (default, over, disabled). Y lo hice dos veces. A mano, como en 2020. Y con Claude Code.

La idea era medir dos cosas: el tiempo y la calidad.

Los números:

• A mano: 15 minutos 12 segundos.

• Con Claude Code: 5:33 de redactar el prompt y 6:41 de ejecución.

Y aquí viene lo que no te esperas.

Visto en frío, parece empate. Incluso ventaja para el trabajo manual, porque a mano monté además las microinteracciones entre estados y las leyendas del componente. Claude Code no hizo ninguna de las dos.

Pero ojito, porque varios de esos “fallos” fueron míos al pedir, no suyos al ejecutar. No montó las microinteracciones porque no se las pedí. No ordenó las propiedades a mi gusto porque no se lo indiqué. La anatomía, en cambio, la clavó: padding, gap, radius, font size, icon size, todo con sus tokens.

Y lo más importante: esto lo hice desde cero. Cuando Claude Code ya tiene referencias del sistema, lo hace muchísimo más rápido. Además, en mi día a día yo no lanzo una petición, lanzo varias a la vez. Mientras un agente monta un component set, yo estoy en otra cosa.

Esa es la ganancia real. No ganar el cronómetro de una tarea aislada, sino poder paralelizar el trabajo.

En el vídeo lo enseño todo paso a paso: cómo monto el botón a mano, cómo redacto el prompt, qué genera Claude Code y mi valoración honesta de cada lado, sin maquillar.

Tienes el vídeo completo aquí mismo, en el reproductor de abajo. Y en la descripción del vídeo en YouTube te dejo acceso al prompt mejorado para crear el componente button con todas sus variantes y propiedades, por si quieres reutilizarlo en tu propio sistema.

En el próximo monto las variantes primary, secondary, outline y ghost con colores tokenizados, y vas a ver a Claude Code ir mucho más rápido.

Si construyes tu propio sistema de diseño, este te va a servir.

Seguimos 🙌

PD: todo esto lo hago para empujar a usar más la IA. Porque noto que todavía hay mucha gente que no sale del canvas de Figma, y se está perdiendo una forma de trabajar que ya está aquí.