El formulario de comentarios de nuestro blog ha cambiado de aspecto. Para definir el rediseño partimos de una captura de pantalla, pedimos a ChatGPT una propuesta visual y utilizamos esa imagen como referencia para que un agente de programación la trasladara al código.
Antes: los elementos estaban, faltaba ordenar su presentación
El bloque «¿Tienes alguna consulta?» reunía nombre, email, comentario, ayuda de formato, CAPTCHA y botón de publicación. La captura original mostraba campos con dimensiones dispares, texto auxiliar poco diferenciado y un botón que quedaba desconectado del estilo de la página.
Después: una referencia visual para trabajar sobre el código
Compartimos la captura y el enlace del artículo con ChatGPT para pedir un diseño integrado en la web. La propuesta colocó Nombre y Email en dos columnas, reorganizó el espacio del comentario, agrupó la ayuda de BBCode en un recuadro e integró visualmente el CAPTCHA. Los iconos, los bordes suaves y el botón azul completaban el conjunto.
El siguiente paso fue entregar esa imagen a un agente de programación con acceso al código fuente. El agente modificó el formulario y, tras revisar su aspecto, confirmamos que respondía al diseño solicitado. El resultado ya puede verse en el blog.
La imagen como especificación
Este caso muestra una forma práctica de concretar una mejora: acordar primero cómo debe verse y después trasladar esa referencia a la interfaz. El aprendizaje puede servir para otras zonas de una tienda online, como formularios o fichas de producto. El resultado documentado es visual; aún no contamos con mediciones sobre su efecto en la participación.
Puedes ver el formulario al final del artículo sobre fichas y plantillas para eBay .
