Guía de Prompt
Decide antes de escribir, construye por partes, usa contenido real y pon cada solicitud frente al agente correcto. Estos hábitos convierten ideas de una sola línea en resultados terminados.
Decide antes de escribir, construye por partes, usa contenido real y pon cada solicitud frente al agente correcto. Estos hábitos convierten ideas de una sola línea en resultados terminados.
Empieza en el chat del proyecto. Abre el chat del proyecto que quieres cambiar, luego elige o dirígete al agente cuyo rol coincida con el trabajo. Si no estás seguro de qué agente encaja, pide al equipo que lo aclare antes de construir.
Esta guía reúne las técnicas que de forma constante logran mejores resultados de tu equipo de agentes. Ninguna de ellas requiere una habilidad especial. Se trata de lo que dices, no de cómo le das formato. Ya sea que estés escribiendo tu primera solicitud o refinando un proyecto maduro, se aplican los mismos principios: pensamiento claro, resultados claros.
Deja que el equipo pregunte antes de construir
Una de las formas más efectivas de obtener un mejor resultado: cuando una solicitud es grande o ambigua, invita a hacer preguntas en lugar de esperar que el equipo adivine bien. Indica lo que quieres y luego añade una línea al final:
Hazme cualquier pregunta que necesites para entender completamente lo que quiero antes de empezar.
A menudo recibirás preguntas que no se te habría ocurrido responder por tu cuenta, ya sea sobre casos límite, audiencias o compensaciones. Resolverlas desde el principio cuesta un minuto; descubrirlas después de una construcción cuesta rehacer el trabajo. El resultado se acerca mucho más a tu intención en el primer intento.
Paso 1: Decide antes de escribir
Ten claro qué estás construyendo
Unos minutos de reflexión al principio pueden ahorrarte mucho volver a escribir prompts después. Antes de empezar, asegúrate de poder responder cuatro preguntas simples: qué estás construyendo, para quién es, por qué lo usarían y cuál es la acción principal que quieres que realicen.
Esa acción principal suele llamarse CTA, abreviatura de call to action. Es el botón, enlace o siguiente paso que más quieres que elijan los usuarios, como Registrarse, Reservar una demo, Empezar gratis o Comprar ahora.
No necesitas escribir una especificación completa. El objetivo es simplemente darle al proyecto una dirección clara. Cuanto más específico sea tu punto de partida, más fácil será generar un resultado que coincida con lo que tienes en mente.
Crea un sitio de una sola página para una app de presupuesto dirigida a freelancers. El CTA principal es “Empieza a ahorrar mejor”. Usa un estilo audaz y expresivo con tipografías grandes y colores intensos.
Esboza el recorrido, no solo las pantallas
El buen diseño vive tanto entre pantallas como en ellas. Recorre el camino que sigue tu usuario: ¿qué ve primero?, ¿qué genera confianza?, ¿qué le da seguridad para actuar? y ¿a dónde conduce esa acción? Incluso un esquema de tres pasos, hero, prueba, llamada a la acción, hace que tus solicitudes sean mucho más efectivas, porque ahora cada sección tiene una razón para existir y una razón para llevar a la siguiente.
Define la dirección visual desde el principio
El estilo es mucho más fácil de establecer que de adaptar después. Elige una dirección: tranquila y elegante, audaz y disruptiva, premium y estilizada, y exprésala en tu primera solicitud usando palabras de tono sobre las que el equipo pueda actuar: minimalista, lúdico, cinematográfico, enfocado en desarrolladores. Estas palabras son más que decoración: dan forma a la tipografía, el espaciado, el color, la sombra y el radio de las esquinas desde el primer componente. Reutiliza la misma línea de estilo en solicitudes posteriores para mantener todo cohesionado.
Usa un diseño tranquilo, inspirado en el bienestar: degradados suaves, tonos tierra apagados, esquinas redondeadas, relleno generoso. Tono general suave y tranquilizador.
Paso 2: Escribe solicitudes que den en el blanco
Describe resultados, no implementaciones
Describe el resultado que quieres, no los pasos para construirlo. Por ejemplo, “Añade una sección de precios con tres opciones y haz que la del medio destaque” es más útil que explicar exactamente cómo debe construirse la página. Concéntrate en lo que debe aparecer y por qué importa; el equipo puede decidir cómo construirlo.
Trabaja por partes, no por páginas
Las solicitudes limitadas a un solo componente — un hero, una cuadrícula de funciones, una fila de testimonios, una tabla de precios — te dan claridad y control. Si una parte no da en el blanco, ajustas esa parte en lugar de regenerar todo lo que la rodea. Construye un bloque, revísalo, refínalo y luego pasa al siguiente. Una solicitud de página completa produce ruido; una solicitud de componente produce señal.
Crea una sección de funciones: titular centrado y luego tres tarjetas una al lado de la otra, cada una con un ícono, un título y una línea de descripción. Sombras suaves, ligera elevación al pasar el cursor.
Usa palabras reales
El texto de relleno oculta problemas; el texto real los revela. Un titular real puede necesitar dos líneas; un CTA real puede funcionar mejor como verbo. Escribe lo que un usuario realmente leería, aunque sea un borrador; los diseños, el espaciado y las decisiones de diseño mejoran cuando el contenido es real.
Titular del hero: “Diseña con calma”. Subtexto: “Convierte el estrés en estructura”. CTA: “Empieza a construir gratis”. Diseño centrado en el texto con un espaciado vertical generoso.
Nombra elementos reales
Usa palabras claras y específicas para describir lo que quieres en la página. No necesitas conocer la terminología de diseño; solo nombra las cosas que los usuarios deberían ver o con las que deberían interactuar, como una tarjeta de perfil, un botón o un formulario.
Las solicitudes específicas son más fáciles de construir que las amplias. Empieza con el elemento básico que necesitas y luego añade detalles uno por uno.
Crea una tarjeta de perfil con una foto, nombre y botón de seguir. Añade una pequeña etiqueta “Verificado” junto al nombre y muestra una breve explicación cuando alguien pase el cursor sobre ella.
Paso 3: Cambia con precisión
Delimita cada cambio: qué se mueve, qué se queda
Al ajustar trabajo existente, sé explícito en ambos lados: qué debe cambiar y qué no debe cambiar. Usa palabras de dirección como “reemplaza”, “actualiza” y “ajusta” en lugar de “haz esto mejor”, y delimita las partes que te gustan. La precisión aquí es lo que evita que la iteración se convierta en regresión.
Cambia el texto del CTA a “Comenzar” y aumenta su relleno horizontal. Mantén los colores actuales, la fuente y todo lo demás de esta sección sin cambios.
Un cambio significativo a la vez
Actualiza el texto, luego el diseño, luego las interacciones y revisa cada resultado antes de la siguiente solicitud. Los pasos pequeños y deliberados se acumulan en un producto pulido; diez cambios en un solo mensaje se acumulan en ambigüedad, y cuando algo salga mal no sabrás qué cambio lo causó.
Las correcciones a mitad de tarea ocurren en el chat. Cuando Prompt Queue esté disponible en tu chat y el trabajo del Agente esté activo, los mensajes de seguimiento se ponen en cola detrás del trabajo en ejecución. Confirma que tu mensaje aparezca en la cola antes de enviar otra copia. Si los controles de la cola no están visibles, no vuelvas a enviar: espera a que termine el trabajo actual, o usa un control de interrupción si tu chat ofrece uno, y luego confirma el estado de la tarea antes de enviar un seguimiento. Consulta Project chat para más detalles.
Piensa un paso por delante de la UI
Si tu proyecto necesita hacer más que verse pulido, define el comportamiento junto con la apariencia. Especifica qué ven los usuarios cuando han iniciado sesión o cuando no, de dónde proviene el contenido dinámico y cómo maneja la interfaz los estados vacíos, de carga y de error. No necesitas un backend funcional para diseñar en torno a estos escenarios: planificarlos desde el principio ayuda a evitar una gran reelaboración de la UI más adelante.
Si el usuario ha iniciado sesión, muestra su avatar y nombre en la parte superior derecha. Si no, muestra un botón “Iniciar sesión” que dirija a la pantalla de autenticación.
Preguntas frecuentes
¿Cómo escribo un prompt efectivo para el agente de IA?
Estructura tu prompt con estos elementos clave:
1. Contexto — Establece la situación. Explica qué estás construyendo y en qué punto están las cosas actualmente.
2. Objetivo — Sé específico sobre el resultado exacto o la función que quieres.
3. Requisitos y restricciones — Enumera claramente qué debe cambiar y qué debe permanecer intacto.
4. Resultado esperado — Define cómo se ve el éxito (p. ej., comportamiento de la UI, manejo de errores, persistencia del estado).
5. Referencias — Adjunta capturas de pantalla, enlaces, pasos del flujo de trabajo o muestras de código siempre que sea posible. Elimina contraseñas, códigos de verificación, claves de API, cookies, datos personales y detalles de pago antes de compartir.
Ejemplo: "Estoy construyendo un panel con una barra lateral. Añade un botón de cerrar sesión en la parte inferior de la barra lateral. Debe borrar la sesión y redirigir a /login. No cambies el diseño de la barra lateral ni los enlaces de navegación. Después de hacer clic, el usuario debe ver la página de inicio de sesión en menos de 1 segundo."
¿Cómo debo manejar solicitudes complejas que involucran varias funciones?
Para solicitudes complejas, divídelas en tareas más pequeñas:
1. Indica el problema actual y el objetivo final.
2. Enumera cada subtarea por separado (tarea 1, tarea 2, tarea 3).
3. Verifica cada tarea antes de pasar a la siguiente.
4. Prueba el flujo completo al final.
Este enfoque reduce los cambios inesperados al pedirle al Agente que haga demasiado de una sola vez. Cada prompt debe centrarse en un único resultado verificable.
¿Cómo escribo un prompt para corregir un error?
Un prompt útil para corregir errores debe incluir:
- La página, función, entorno y usuarios afectados
- Pasos exactos para reproducir el problema
- Comportamiento real y comportamiento esperado
- El texto completo del error y cuándo ocurrió
- Capturas de pantalla o registros relevantes, con contraseñas, tokens, cookies, datos personales y detalles de pago eliminados
- Qué debe permanecer sin cambios
- Cómo verificar la corrección y qué comprobaciones de regresión ejecutar
Ejemplo: “En la página de pago en Preview, al seleccionar Enviar se devuelve un error 500. Esperado: el pedido se confirma y el usuario llega a la página de agradecimiento. Reproducción: [pasos]. Corrige la causa sin cambiar los totales del carrito ni el flujo de pago, y luego verifica un caso exitoso y uno de pago rechazado. Eliminé todos los valores secretos del registro adjunto.”
¿Cómo escribo un prompt para modificar el diseño o el estilo de una página?
Al solicitar modificaciones de página, incluye:
1. La página, módulo y elemento específicos que se deben modificar.
2. Estado actual y resultado objetivo.
3. Enlaces de referencia o capturas de pantalla.
4. Funciones que deben permanecer sin cambios.
5. Criterios de aceptación (p. ej., debe funcionar tanto en escritorio como en móvil).
Ejemplo: "En la página /pricing, cambia la cuadrícula de tarjetas de planes de 2 columnas a 3 columnas en escritorio. Mantén el diseño móvil como una sola columna. Usa como referencia esta captura de pantalla [adjuntar]. No cambies el contenido de las tarjetas ni los estilos de los botones."
¿Qué debo hacer cuando el agente sigue haciendo los cambios equivocados a pesar de las correcciones?
Cuando el Agente falla repetidamente, añadir más instrucciones a veces puede causar más confusión. En su lugar:
1. Conserva el estado actual — Deja de enviar correcciones superpuestas. Si tu chat muestra un control Revert, lee su texto de confirmación antes de usarlo, toma nota de cualquier cambio posterior que necesites conservar y verifica el proyecto después. Si el alcance no está claro, no continúes; usa la guía de Project chat o contacta con Support con un Chat Link censurado y una captura de pantalla.
2. Elimina el ruido — En lugar de añadir instrucciones extra encima, vuelve a plantear el problema central de forma clara desde cero.
3. Una tarea a la vez — Concéntrate en resolver un solo problema antes de pasar al siguiente.
Dar un paso atrás y abordar los cambios de forma incremental suele resolver los problemas mucho más rápido que intentar corregir varios problemas superpuestos en un solo prompt.