Domina prompts efectivos con confianza: aquí verás cómo aplicar el framework CREA para guiar a un LLM, construir un MVP de portafolio UX/UI en minutos y publicarlo como artefacto listo para compartir. Todo con ejemplos prácticos, trucos accionables y términos clave como zero/one/few shot, etiquetas XML y “muéstrame el plan a ejecutar”.
¿Cómo usar el framework CREA para prompts efectivos?
El framework CREA ordena tus instrucciones para obtener respuestas claras y útiles. Un prompt es una instrucción o conjunto de instrucciones que guía la respuesta del LLM; si es ambiguo, el modelo inventa detalles y el resultado se desvía [14:10].
- Contexto: cuenta quién eres, tu objetivo y restricciones. Evita ambigüedades [13:35].
- Rol: indica “actúa como…”, acota la especialidad (por ejemplo, diseñador web experto en portafolios) [18:05].
- Especificidad: define secciones, estilo, dispositivos, animaciones, contenidos y criterios de calidad [20:40].
- Acción: pide el formato de salida exacto: “genera el sitio con código que funcione de inmediato y usa placeholders realistas” [23:00].
¿Qué significa escribir un prompt claro para un LLM?
- Evita órdenes genéricas como “créame el código en página web” [15:05].
- Guía el resultado con detalles: estructura, tono, elementos, ejemplos y validaciones [16:20].
- Usa el rol para alinear expectativas profesionales y estándares del entregable [18:05].
¿Qué es un MVP y por qué acelera tu proyecto?
- MVP: versión mínima para validar una idea con usuarios reales [11:35].
- En portafolio: secciones clave, navegación clara y posibilidad de contacto bastan para empezar [27:40].
- Itera después: ajusta textos, colores, tipografías y casos de estudio al avanzar [29:10].
¿Cómo crear un MVP de portafolio con Claude paso a paso?
Se puede lograr un portafolio UX/UI funcional con Claude (modelo Sonnet 4.5) en un flujo de chat, sin usar el modelo más costoso como Opus cuando no es necesario [25:05]. Claude además permite publicar artefactos con un clic [49:10].
- Abre Claude y define tu prompt con CREA [22:55].
- Contexto: experiencia UX/UI, proyectos y objetivo de empleo [19:05].
- Rol: diseñador web experto en portafolios para diseñadores [18:05].
- Especificidad: hero, sobre mí, proyectos con título/descr./herramientas/resultado, habilidades, contacto, estilo moderno y limpio, responsive, animaciones suaves, mucho espacio en blanco [20:40].
- Acción: “crea el sitio completo con código que funcione y placeholders realistas” [23:00].
Ejemplo de estructura con etiquetas XML para claridad del modelo [37:20]:
<contexto>
Soy diseñador UX/UI con 3 años, 4 proyectos clave; busco empleo y necesito portafolio profesional.
</contexto>
<rol>
Actúa como diseñador web experto en portafolios para diseñadores.
</rol>
<especificidad>
Secciones: hero, sobre mí, proyectos, habilidades, contacto. Estilo moderno, limpio, paleta neutra con acento.
</especificidad>
<accion>
Genera el sitio con código ejecutable aquí y placeholders realistas.
</accion>
¿Qué cambia entre zero shot y one/few shot?
- Zero shot: sin ejemplos, basta con CREA si la tarea es clara [33:35].
- One shot: añade un ejemplo de referencia visual (p. ej., estilo que te gusta) y describe qué te gusta de ese sitio: color, tipografías, formato tipo blog, paleta [31:00].
- Few shot: múltiples ejemplos para combinar decisiones de diseño [33:50].
- Resultado: el one shot aportó mejor color y composición, más cercano al referente [34:40].
¿Cómo publicar un artefacto y compartirlo?
- Usa “publicar artefacto” en la esquina superior derecha [49:10].
- El artefacto queda accesible en internet e indexable por buscadores; el chat sigue privado [49:25].
- Comparte el enlace como tu primer MVP de portafolio [50:20].
¿Qué técnicas y buenas prácticas elevan tus prompts?
Pequeños cambios mejoran mucho la calidad del resultado y el control de cambios.
- Etiquetas XML: delimita cada bloque del prompt. Ayuda al LLM a entender inicio/fin de contexto, rol, especificidad y acción [37:20].
- Plan antes de ejecutar: “antes de realizar el cambio, muéstrame el plan a ejecutar” obliga al modelo a razonar y te deja aprobar o ajustar el plan [41:10].
No me gusta el color naranja; cámbialo por rojo. Antes de realizar el cambio, muéstrame el plan a ejecutar.
- Iteración controlada: ajusta tonos (por ejemplo, de “rojo vibrante” a “rojo más opaco”) y aprueba los pasos [43:05].
- Pide insumos faltantes: solicita que pregunte si falta contexto antes de ejecutar la tarea [59:05].
- Idioma: escribir en inglés puede ayudar en temas con entrenamiento mayoritario en inglés; aún hay diferencias por idioma [1:02:05].
- Modelos: elige por prueba y error según la tarea; Sonnet 4.5 fue suficiente para generar el sitio; Opus para tareas más complejas de investigación [25:05].
- Tokens/contexto: algunas herramientas ofrecen compresión de conversaciones largas para mantener contexto útil [1:03:40].
- Editar prompt inicial: en el mismo chat, edita el primer mensaje para mejorar la base sin empezar de cero [1:05:05].
- XML vs JSON: XML funcionó mejor para estructurar el prompt; la salida sí puede pedirse en JSON cuando convenga [1:10:25].
- Automejora: pide que revise su respuesta y sugiera mejoras hasta quedar conforme; si tras varias iteraciones no converge, abre un chat nuevo y mejora el prompt [1:12:05].
Habilidades y conceptos clave que practicar:
- Prompt engineering con CREA y roles específicos.
- Diseño de portafolios UX/UI enfocado en proyectos, habilidades y contacto.
- Iteración guiada con planes de cambio y control de color/estilo.
- Publicación como artefacto para validar rápido con usuarios.
- Estrategias zero/one/few shot para ajustar calidad creativa.
¿Te quedaron preguntas o quieres compartir tu prompt y tu artefacto publicado? Déjalos en los comentarios y conversemos sobre cómo mejorarlos juntos.