Skip to content

Cómo escribir un buen prompt para una web paso a paso

Un buen prompt nombra seis cosas: qué es el proyecto, para quién, qué secciones lleva, qué acción debe hacer el visitante, el tono y una restricción. Con eso Zugo entrega una primera versión utilizable en cerca de un minuto. Lo demás se corrige editando, y cada edición cuesta 3 créditos.

La diferencia entre una primera versión que sirve y una que hay que tirar casi nunca está en el modelo. Está en cuánta información concreta le diste antes de pulsar el botón. Abajo va la estructura, con ejemplos y con el coste real de equivocarse.

¿Qué hace que un prompt funcione?

Un prompt útil es una especificación corta, no un deseo. Describe qué tiene que hacer la página y para quién, con sustantivos y números, en lugar de pedir que quede moderna, limpia y profesional. Esos tres adjetivos no contienen ninguna decisión aprovechable.

Los adjetivos no son inútiles, solo llegan tarde. Sirven para afinar una versión que ya existe, cuando puedes mirar la pantalla y señalar qué sobra. Al principio no tienen nada a lo que agarrarse, así que la generación rellena el hueco con lo más previsible que existe.

La prueba rápida es esta. Si otra persona pudiera leer tu prompt y construir la página a mano sin preguntarte nada, el prompt está terminado. Si tendría que hacerte tres preguntas, esas tres respuestas son exactamente lo que falta por escribir.

Escribir en tu idioma no empeora el resultado, así que no traduzcas el prompt al inglés esperando magia. Lo que cambia el resultado es el nivel de detalle, y detallar siempre sale mejor en la lengua en la que piensas el negocio.

¿Qué seis partes lleva un prompt de web?

Seis, y ninguna necesita más de una frase. Un prompt que las tiene todas cabe en un párrafo y ya contiene más información concreta que la mayoría de los encargos que recibe un diseñador humano.

Parte Qué responde Ejemplo de frase
Objeto Qué es esto "Web de una clínica dental con dos consultas"
Público Quién entra "Pacientes del barrio que buscan cita esta semana"
Secciones Qué hay dentro "Inicio, tratamientos, precios, equipo y contacto"
Acción Qué debe pasar "Pedir cita con un formulario de nombre, teléfono y motivo"
Tono Cómo suena "Cercano y tranquilo, sin jerga médica"
Restricción Qué evitar "Sin fotos de archivo genéricas ni frases sobre excelencia"

La cuarta fila es la que más se olvida y la que más pesa. Una web sin una acción clara sale presentable y no sirve para nada, porque el orden de las secciones depende entero de hacia dónde estás empujando al visitante.

La sexta fila hace un trabajo silencioso. Nombrar lo que no quieres recorta el terreno mucho más rápido que describir lo que sí, y es la manera más barata de esquivar el resultado genérico del que se queja todo el mundo.

¿Cómo se ve un prompt débil frente a uno fuerte?

Débil: "una web moderna para mi gimnasio". Ahí solo hay una palabra con información, y es "gimnasio". Todo lo demás lo decide la herramienta por ti, y decidirá lo estadísticamente más común.

Fuerte: "Web de un gimnasio de barrio con veinte máquinas y clases de grupo. Entran vecinos de treinta a cincuenta años que quieren probar una semana antes de apuntarse. Secciones: inicio, clases con horario semanal, precios de tres cuotas, entrenadores y contacto. La acción principal es reservar una clase de prueba gratis con un formulario de nombre, teléfono y clase elegida. Tono directo y sin épica deportiva. Sin fotos de modelos con abdominales".

El segundo prompt cabe en cinco líneas y contesta las seis preguntas de la tabla. Ese es todo el truco. No es más largo por adornarse, es más largo porque cada frase elimina una decisión que si no tomarías tú más tarde, editando.

Fíjate en la última frase del ejemplo. Es una restricción, ocupa siete palabras y ahorra una edición completa de 3 créditos, porque las fotos de gimnasio genéricas son justo lo primero que aparecería.

¿Qué conviene dejar fuera del primer prompt?

Tres cosas, y dejarlas fuera es una decisión de coste, no de pereza. Una construcción cuesta 6 créditos y una edición 3, así que todo lo que se pueda ajustar después sale a mitad de precio si sale mal.

Los colores exactos. Pedir una paleta concreta antes de ver la estructura suele terminar en una segunda opinión en cuanto la ves montada. Es material de edición, no de construcción.

El texto definitivo. Escribe el prompt con el mensaje, no con la redacción final. Los textos se cambian mejor cuando ya sabes cuánto espacio tiene cada bloque y cuántas palabras entran sin romper el diseño.

La lógica de negocio rara. Descuentos por tramos, reglas de disponibilidad, precios que dependen de tres condiciones. Todo eso se alcanza en varias pasadas cortas y no en un prompt gigante, y el procedimiento está en cómo editar un proyecto después de generarlo.

¿Cómo se corrige lo que no encajó?

Editando en pasadas cortas y agrupando cambios. Cuatro correcciones pedidas en un mismo mensaje son una sola edición de 3 créditos, mientras que las mismas cuatro pedidas de una en una cuestan 12.

Las correcciones útiles nombran el bloque y el cambio: "en la sección de precios, pon la cuota mensual primera y destácala", "quita el bloque de testimonios", "el formulario debe pedir también la clase elegida". Cada una señala un sitio concreto de la pantalla.

Las correcciones que no funcionan son las que repiten el problema sin describir la solución. "No me convence el inicio" no contiene ninguna instrucción. "El inicio tarda en decir qué es esto, pon el nombre del gimnasio y la clase de prueba en lo primero que se ve" sí.

Si después de tres o cuatro ediciones el proyecto sigue lejos, casi siempre es que el prompt inicial no tenía la parte de "acción". En ese caso vuelve a construir con el prompt corregido: 6 créditos gastados a tiempo salen más baratos que ocho ediciones a la deriva.

¿Cuánto cuesta cada intento?

Estos son los números, y con ellos se puede planificar antes de escribir nada.

Acción Créditos
Construcción de una página o proyecto simple 6
Edición de un proyecto existente 3
Plataforma multipágina, primeras tres páginas 12
Cada página adicional 3
Construcción en modo Hi-Fi 12
Edición en modo Hi-Fi 6

El plan Free trae 5 créditos, o sea menos de una construcción, así que sirve para entrar y mirar por dentro, no para terminar un proyecto. Pro cuesta $25 al mes con 200 créditos y Business cuesta $99 al mes.

Con 200 créditos caben 33 construcciones o 66 ediciones. En la práctica un proyecto real es una construcción y entre cuatro y ocho ediciones, así que el presupuesto por proyecto ronda los 18 a 30 créditos. El desglose completo está en cuánto cuesta una web hecha con IA.

Antes de llegar a ti, cada construcción se arranca en un entorno aislado y la que no abre se reporta como fallo en lugar de entregarse. Eso reduce el riesgo de pagar por una página muerta, y no dice nada sobre si el prompt era bueno.

¿Qué no arregla un prompt mejor?

Cuatro cosas, y conviene saberlas antes de reescribir el mismo prompt por quinta vez.

El criterio de negocio. Un prompt perfecto no decide a quién te diriges ni qué oferta hace que alguien te llame. Eso lo pones tú, y ninguna redacción lo sustituye.

La lógica muy específica. Se construye por capas con ediciones sucesivas. Intentar meterla entera en la primera frase produce versiones confusas que luego cuesta más desmontar que empezar de nuevo.

Un producto complejo. Zugo no sustituye a un equipo de desarrollo cuando el proyecto se convierte en software serio con muchos casos límite y responsabilidades legales.

El alcance de los juegos. Salen en 2D y viven en el navegador. Un prompt mejor mejora las reglas del juego, no cambia esa frontera.

¿Cómo probar tu prompt hoy?

Escribe las seis frases de la tabla en un bloc de notas, léelas seguidas y comprueba si un desconocido podría montar la página con ellas. Ese ejercicio tarda diez minutos y evita las tres primeras ediciones.

Después constrúyelo y mira el resultado buscando una sola cosa: si la acción principal está visible sin desplazar la pantalla. Si no lo está, esa es tu primera edición, y con eso arreglas más que con un cambio de colores.

Si tu proyecto es una página de venta, el orden de bloques concreto está en cómo crear una landing page con IA. Y si prefieres comprobarlo directamente, escribe tus seis frases en Zugo y compara la primera versión con lo que tenías en la cabeza.

← Todos los artículos