Prompts para diseñar una web con IA sin que se vea genérica.
La IA diseña genérico cuando le das adjetivos. Diseña mejor cuando le das decisiones: qué tipografía, qué no hacer, qué mostrar y con qué referencia.
«Hazla más moderna», «que se vea profesional», «más limpia». Son los pedidos más comunes y los que peor funcionan, porque el modelo los traduce a lo más promedio que conoce: justo lo que querías evitar.
Estos prompts sirven en Lovable, v0, Bolt, Cursor, Claude o ChatGPT. Cámbiales lo que está entre corchetes y pégalos uno por uno: un cambio a la vez rinde más que una lista de diez.
El brief, antes de todo
Pega esto al empezar un proyecto o antes de pedir cualquier cambio de diseño. Le da al modelo las decisiones que si no toma solo.
Vas a diseñar la web de [qué es tu negocio], para [quién es tu cliente].
Decisiones que ya están tomadas:
- Tipografía: [nombre] para títulos y [nombre] para texto. No uses Inter ni la fuente del sistema.
- Color: fondo [color], texto [color] y un solo acento: [color en hex]. Sin degradés.
- Referencias: [dos o tres webs que te gusten]. Toma de ellas la escala de los títulos y el aire entre secciones, no los colores.
No hagas:
- Secciones de tres tarjetas con un ícono arriba.
- Testimonios, cifras o logos de clientes inventados.
- Etiquetas pequeñas en mayúsculas arriba de cada título.
- Animaciones al hacer scroll o tarjetas que se levantan al pasar el mouse.
- Textos como "desbloquea", "potencia" o "lleva al siguiente nivel".
Antes de escribir código, dime en tres líneas qué estructura de página propones y por qué.Para el título
Reescribe el título del hero. Tiene que decir qué gana la persona y para quién es, en menos de diez palabras, sin promesas genéricas. Dame cinco opciones distintas entre sí y no cambies nada más de la página.Elige tú. El modelo tiende a proponer la más segura primero.
Para la tipografía y la escala
Cambia la tipografía de los títulos a [nombre] y del texto a [nombre]. El título del hero tiene que ser mucho más grande que ahora (alrededor de [tamaño] en escritorio), con interlineado de 0.95 y espaciado de letras de -0.03em. No uses los tamaños por defecto de Tailwind para los títulos: define los tuyos.Para sacar las tres tarjetas
La sección [nombre] tiene tres tarjetas iguales con ícono. Reemplázala por [una lista con una frase por ítem / un ejemplo concreto con una captura / una comparación de antes y después]. Sin íconos decorativos y sin fondo de tarjeta.Para lo inventado
Busca en toda la página testimonios, cifras, logos de clientes, sellos de seguridad, cuentas regresivas o reseñas que no te haya dado yo. Hazme una lista y bórralos. Donde quede un hueco, dime qué contenido real haría falta en su lugar.Para el movimiento
Saca las animaciones de aparición al hacer scroll y los efectos de hover en elementos que no son clicables. Deja transiciones solo en botones y enlaces, de 150 a 200 ms, y agrega una regla prefers-reduced-motion que las desactive.Guarda las reglas en el proyecto
Si cada vez que pides algo vuelve el violeta, es porque el modelo no recuerda lo que decidiste. Guarda el brief donde la herramienta lo lea siempre: el archivo AGENTS.md o CLAUDE.md en la raíz del proyecto, las reglas de Cursor, o la sección de conocimiento del proyecto en Lovable.
Escríbelo como reglas cortas y verificables («nunca tres tarjetas con ícono») y no como deseos («que se vea elegante»).
Referencias en lugar de adjetivos
Una captura de una web que te gusta le dice al modelo más que cualquier adjetivo. Pásale dos o tres, y dile qué tomar de cada una: la escala de los títulos de una, el uso del espacio de otra. Si le pides que copie una entera, te va a devolver un clon mal hecho.
Después de cada cambio, revisa el resultado en el teléfono además de en la computadora. Y si quieres saber qué quedó, pasa la web por el Slop Score.
Preguntas frecuentes
¿Qué prompt uso para que la IA no diseñe genérico?
Uno que le dé decisiones en lugar de adjetivos: qué tipografía usar, qué color, qué referencias mirar y una lista de cosas que no debe hacer, como tres tarjetas con ícono o testimonios inventados. Pídele que proponga la estructura antes de escribir código.
¿Por qué la IA vuelve a poner el violeta aunque le diga que no?
Porque no recuerda lo que decidiste en mensajes anteriores. Guarda las reglas en un archivo que la herramienta lea siempre, como AGENTS.md, las reglas de Cursor o el conocimiento del proyecto en Lovable.
¿Sirven los mismos prompts en Lovable, v0 y Cursor?
Sí. Cambia dónde guardas las reglas, pero lo que funciona es lo mismo: decisiones concretas, una lista de lo que no hacer, referencias y un cambio a la vez.
¿Conviene pedirle que copie una web que me gusta?
No entera. Dile qué tomar de cada referencia, como la escala de los títulos o el aire entre secciones. Si le pides un clon, te devuelve una copia peor y sin nada tuyo.