¿Qué hace que un prompt sea bueno?
Para obtener los mejores resultados de la IA, céntrese en estos tres principios fundamentales.Contexto
Proporcione contexto sobre el objetivo de su cambio. Explicar por qué desea probar una idea determinada ayuda a la IA a adaptar su salida para cumplir sus objetivos.- Bueno: “Change the color of the CTA to blue to improve visibility for the user.” ✅
- Demasiado vago: “Make this CTA nicer.” ❌
Precisión
Sea específico sobre el cambio que desea realizar. Proporcione una descripción visual precisa, incluyendo detalles como tamaño, color, forma, posición y estilo.- Bueno: “Add a white delivery truck icon next to the free shipping text to improve the click-through rate. The icon’s height should match the text height.” ✅
- Sin objetivo claro: “Change up the design.” ❌
Simplicidad
Utilice terminología sencilla y accionable. Céntrese en instrucciones claras y limítese a una petición por prompt. No complique excesivamente el prompt con jerga técnica.- Bueno: “Replace the white background with a top-to-bottom gradient from
#2b5d50to#dae995.” ✅ - Demasiadas instrucciones: “Change the button color, add a promo image, and move the text.” ❌
Siga una estructura de prompt clara
Los usuarios tienen éxito con PBX cuando sus prompts siguen una estructura clara. Utilice estos cuatro pasos para peticiones más complejas:- Defina el cambio
- Indique exactamente qué transformación desea lograr.
- Especifique los cambios visuales y de diseño
- Detalle los cambios visuales para el elemento objetivo, las directrices de diseño y los elementos de diseño. También puede hacer referencia a mockups o archivos de diseño aquí.
- Explique el comportamiento
- Describa cómo debe responder el elemento objetivo a las acciones del usuario.
- Establezca límites y limitaciones (opcional)
- Defina las limitaciones técnicas, los requisitos de capacidad de respuesta y lo que no debe ocurrir.
Ejemplos en acción
Revise estos ejemplos para ver cómo funciona la estructura de prompt en la práctica.El prompt “compare hotels”
Este ejemplo proporciona una estructura clara para una función compleja:“Build a ‘Compare hotels’ feature like the mockup. Add a ‘Compare properties’ toggle in the left sidebar to turn it on or off. When the toggle is on, show a ‘Compare’ checkbox on each property card in the bottom right. If at least one property is selected, show a sticky bottom tray with thumbnails, an ‘X/5 selected’ counter, and ‘Cancel’ and ‘Compare’ buttons. Clicking ‘Compare’ opens a simple modal showing the selected listing details. Limit selection to 5.”
¿Funcionará este prompt?
Prompt: “Replace the ‘Show on map’ block with a movable floating ‘Map’ button. Users should be able to drag it anywhere on the page. Clicking it should open the map view.” Veredicto: ✅ Sí. Sigue la estructura de prompt recomendada y describe claramente la transformación.
En caso de duda…
Si no está seguro de cómo formular un prompt, tenga en cuenta estos consejos:- Piense en grande, pero sea realista: la IA no puede crear nueva funcionalidad de backend. Concéntrese en cambios de UI y UX.
- Manténgalo simple: los cambios sencillos no necesitan prompts complejos.
- Trate a la IA como un compañero de equipo: redacte los prompts con la misma claridad con la que daría instrucciones a un desarrollador.
También puede utilizar la función Draw a sketch para encerrar visualmente el área que desea actualizar, la función Import a file para proporcionar un mockup que la IA pueda seguir, o importar diseños directamente desde Figma.