Curso Kilo Code: Agente AI de Programación.

Prompt usado:

Crea un generador de URLs con UTM bellamente diseñado, con una interfaz intuitiva que combine una estética profesional con una funcionalidad potente. La aplicación debe incluir:

Gestión de URLs:

Campo de entrada de URL inteligente con validación y formato en tiempo real

Indicadores visuales para estructuras de URL válidas/incorrectas

Reconocimiento de dominio con visualización del favicon para confirmación visual

Sistema de Parámetros UTM:

Campos de parámetros dinámicos con sugerencias contextuales basadas en estándares de la industria

Bibliotecas de valores preestablecidos personalizables para campañas, fuentes, medios y términos

Validación inteligente de parámetros con sugerencias útiles de corrección

Inteligencia en la relación entre parámetros (sugiere medios apropiados para las fuentes seleccionadas)

Experiencia de Usuario:

Vista previa en tiempo real de la URL con resaltado de sintaxis para los distintos parámetros

Funcionalidad de copia instantánea con múltiples formatos disponibles (URL sin formato, HTML, markdown)

Integración con acortadores de URL y seguimiento analítico

Historial de parámetros con analítica de uso para mejorar futuras sugerencias

Atajos de teclado para usuarios avanzados

Elementos de Diseño:

Interfaz minimalista inspirada en Apple, con mucho espacio en blanco y sombras sutiles

Sistema de colores que utiliza el azul (#1e66f5) como color principal, con colores de acento complementarios y proporciones de contraste adecuadas

Microinteracciones y animaciones sutiles al interactuar con campos de formulario y botones

Funcionalidad de autocompletado/predictivo con animaciones elegantes en los menús desplegables

Secciones claramente separadas para la URL base y los parámetros UTM

Transiciones suaves al copiar o guardar URLs

Diseño responsivo que se adapta de forma fluida a móviles, tablets y pantallas de escritorio