Usa el prompt
Añade tu encargo
Añade tu contexto a continuación. Se incluirá en el prompt cuando lo copies o descargues.
Crea una composición editable en HTML/CSS con texto seleccionable y una hoja de estilos para impresión; trata cualquier ilustración rasterizada como un recurso local independiente para [PROJECT] y [AUDIENCE]. La tarea es: Portada de artículo editorial.
Contenido y estructura obligatorios
Traduce la tensión principal del artículo en un recurso visual original y sobrio que deje espacio para el título.
Utiliza [APPROVED_CONTENT] como fuente de nombres, fechas, cifras, afirmaciones y destinos. Enumera los datos que faltan antes de sustituir cualquier elemento. Si se necesita una demostración, indica que su contenido es ficticio. No inventes citas de clientes, clasificaciones, logotipos de socios ni capacidades del producto.
Dirección de diseño
Usa [BRAND_RULES] y el sistema de diseño ya seleccionado en el proyecto. Si no se proporciona ningún sistema, comienza con esta dirección: crema, gris carbón y verde oliva; jerarquía editorial asimétrica con abundante espacio negativo. Mantén la coherencia de la tipografía, el espaciado y las funciones de los colores. Prioriza la tarea sobre los elementos decorativos y evita una colección genérica de tarjetas inconexas.
Preparación del contenido
Lee el argumento central del artículo e identifica su tensión principal. Proporciona el titular exacto, el recorte previsto y cualquier restricción de marca o de la publicación.
Diseño y comportamiento
Elige una metáfora visual que respalde el argumento. Deja espacio intencionado para el título en lugar de reunir cada palabra clave en un collage ilustrado.
Comprobación de aceptación específica de la tarea
- Evita un collage literal de cada palabra clave y mantén la relevancia de la metáfora.
- Visualiza la portada sin el artículo y comprueba si sugiere el tema correcto.
- Prueba la ubicación del titular y la escala de la miniatura; la complejidad decorativa no debe ocultar la idea editorial.
Implementación y revisión
Mantén el texto editable. Utiliza una estructura semántica, controles descriptivos, un foco de teclado visible y estados vacíos o de error adecuados. Comprueba los diseños estrechos y anchos. Respeta las preferencias de movimiento reducido. Conserva el framework y las dependencias existentes del proyecto; no sustituyas la estructura tecnológica sin avisar. Devuelve los archivos editables y explica cualquier comportamiento incompleto o dato de entrada no compatible. Revisa esta tarea específica antes de proponer funciones adicionales.
Mantén el texto exacto y los créditos obligatorios como texto editable. Solicita las dimensiones previstas cuando falten. No inventes un código QR funcional, un código de barras, una firma ni un sello oficial.
Archivo de referencia y objetivo de reconstrucción
Adjunta reference.webp, incluido en el paquete de descarga de este prompt, junto con el prompt en OpenDesign. Crea un resultado editable con una composición y jerarquía similares; no incrustes la imagen de referencia completa como interfaz final. Conserva el contenido aprobado del proyecto y las reglas de marca si entran en conflicto con las etiquetas ficticias de ejemplo. Si la imagen falta o no se puede leer, solicítala en lugar de afirmar que existe fidelidad visual.
Composición y contenido de referencia
Usa el archivo reference.webp adjunto como referencia visual para la portada de artículo editorial. Antes de crearla, identifica las regiones principales de arriba abajo, sus anchuras y alturas relativas, la alineación, el espaciado, la jerarquía tipográfica, los colores de las superficies, los bordes, las imágenes y los componentes repetidos. Conserva esas relaciones en lugar de sustituirlas por una plantilla genérica. Contenido obligatorio de la tarea: Traduce la tensión principal del artículo en una imagen original y sobria con espacio para el título. Al convertir la imagen en elementos editables, sigue estas pautas de maquetación específicas de la tarea: Elige una metáfora visual que respalde el argumento. Deja espacio intencionado para el título en lugar de reunir cada palabra clave en un collage ilustrado.
Dirección visual de los requisitos de ejemplo
crema, gris carbón y verde oliva; jerarquía editorial asimétrica con abundante espacio negativo.
Resultado y capacidad de edición
Recrea el gráfico final como capas editables de texto, formas e imágenes. La referencia es una composición, no la interfaz de un editor; no añadas elementos de navegación, formularios ni widgets de panel que no aparezcan en ella. Elige una metáfora visual que respalde el argumento. Deja espacio intencionado para el título en lugar de reunir cada palabra clave en un collage ilustrado. Confirma las dimensiones previstas y conserva la jerarquía del texto al adaptar la obra. Evita un collage literal de cada palabra clave y mantén la relevancia de la metáfora.
Comparación visual y entrega
- Compara el resultado con la imagen adjunta usando las mismas proporciones. Revisa la ubicación de las regiones principales, los tamaños relativos de las imágenes, los saltos de línea, el espaciado, la jerarquía tipográfica, el contraste, los estados activos y la densidad del contenido antes de perfeccionar los detalles decorativos.
- Después, prueba el diseño estrecho sin comprimir el texto de escritorio en etiquetas diminutas.
- Mantén los logotipos, las fotos y los iconos como recursos independientes y todas las etiquetas relevantes editables. Enumera las fuentes o los recursos no disponibles y cualquier desviación deliberada. Devuelve los archivos funcionales junto con una descripción concisa del comportamiento implementado y las integraciones pendientes; no prometas un resultado idéntico píxel a píxel basándote únicamente en el prompt.
Descargar prompt + imagen
Incluye el prompt completo y la imagen de referencia a tamaño completo. Adjunta ambos en OpenDesign para orientar la composición.
Cómo escribir un prompt de diseño de portada de artículo editorial
Un buen prompt de diseño de portada de artículo editorial explica el argumento, la composición y el orden de lectura, no solo una atmósfera. Este ejemplo combina un titular serif de gran tamaño con un paisaje urbano circular y un primer plano rocoso oscuro. La guía siguiente convierte esas decisiones visibles en instrucciones que puedes adaptar a tu propio artículo.
Las tres vistas detalladas que aparecen a continuación son recortes de la misma referencia generada por IA. Explican la composición y la tipografía; no son capturas de pantalla de una interfaz funcional.
Crea una única metáfora visual en torno al artículo
La ciudad no se presenta como una fotografía convencional de un horizonte urbano. Aparece dentro de un gran círculo claro, suavizada por las crestas montañosas y la bruma. Una pequeña figura sentada se muestra más cerca del espectador, sobre la roca de la derecha. Junto con el titular ficticio «Un progreso más sereno», esto crea una posible tensión entre el crecimiento urbano y un punto de vista más pausado y reflexivo. Esta lectura es una interpretación de la composición; un artículo real podría requerir una metáfora diferente.
Empieza el prompt de la portada editorial con la pregunta central del artículo y, después, indica los pocos elementos visuales que la expresan. «Hazlo reflexivo y editorial» deja sin definir el tema, la escala y la relación. La referencia es más específica: ciudad distante, persona pequeña, gran roca y un único marco circular. Su tamaño relativo importa tanto como su identidad. No añadas relojes, gráficos, hojas ni otros símbolos solo porque aparezcan en el artículo. Cada objeto adicional compite con la idea central. Si tu artículo aborda una tensión diferente, sustituye la metáfora antes de conservar esta composición.
Del prompt
Elige una metáfora visual que respalde el argumento.
Personalízalo
El artículo examina [CENTRAL_QUESTION]. Expresa la tensión entre [IDEA_A] y [IDEA_B] mediante una sola escena: [DISTANT_SUBJECT] dentro de un gran campo circular, con [FOREGROUND_SUBJECT] en el primer plano inferior derecho. Mantén pequeño el detalle a escala humana y discreto el fondo. Reserva el lado izquierdo para el titular aprobado. Evita objetos simbólicos adicionales salvo que sean necesarios para explicar el argumento.
Especifica la jerarquía y los saltos de línea del titular
El título ocupa la mayor parte de la mitad izquierda. «Un» aparece en una línea propia, «más sereno» está en verde oliva y «progreso» vuelve al gris carbón. Las letras serif de alto contraste sostienen la composición; la breve pregunta en mayúsculas situada debajo usa un espaciado amplio entre caracteres y un tamaño mucho menor. Esta jerarquía establece con claridad una primera y una segunda lectura. No es una plantilla para obligar a que todos los títulos ocupen tres líneas: un titular aprobado más largo necesita saltos distintos y puede requerir más espacio horizontal.
Proporciona por separado el titular exacto, la frase complementaria y el nombre de la publicación. Después, describe sus funciones y su escala relativa. Pedir una «tipografía bonita» no indica al modelo qué texto debe destacar. Especifica texto editable, un gran titular serif, una línea complementaria compacta en sans serif y un único color de énfasis sobrio. Revisa las palabras reales al tamaño previsto para la portada: los trazos serif finos pueden desaparecer en una miniatura pequeña y las palabras largas pueden chocar con la imagen. Ajusta los saltos de línea o la región del título antes de reducir todo el texto por igual. El texto ficticio de esta imagen es una referencia de composición, no un texto aprobado para tu publicación.
Del prompt
Traduce la tensión principal del artículo en un recurso visual original y sobrio que deje espacio para el título.
Personalízalo
Usa el titular exacto [APPROVED_HEADLINE] como texto editable en la región izquierda. Compónlo con una tipografía serif de alto contraste y un interlineado ajustado pero legible. Elige los saltos de línea según el significado de las palabras; no dividas ninguna palabra. Destaca únicamente [KEY_PHRASE] con el color de acento. Coloca [SUPPORTING_LINE] debajo, con una tipografía sans serif más pequeña y un espaciado amplio entre caracteres. Mantén el nombre de la publicación en un plano visual secundario y deja una separación clara entre el título y la ilustración circular.
Describe el color, las capas y el recorte final
El campo crema cálido es la mayor área de color. El verde oliva aparece en la palabra destacada del título y en la forma curva que recorre la parte inferior de la imagen; el gris carbón da peso visual al titular y a la roca. La roca del primer plano se superpone al paisaje circular en lugar de permanecer dentro de él. Esa superposición conecta el marco geométrico con el borde inferior de la portada. Las pequeñas etiquetas de la publicación se sitúan cerca de los márgenes, pero no compiten con el titular ni con la escena principal.
Los nombres de los colores son solo un punto de partida. Asigna una función a cada color y describe el orden de las capas: lienzo crema, forma complementaria verde oliva, paisaje circular claro, roca oscura en primer plano y, por último, tipografía editable. Esto ofrece resultados más reproducibles que pedir un estilo minimalista impreciso. Indica también las dimensiones de salida y el área segura antes de generar la imagen. La referencia usa un lienzo horizontal de 3:2. Un recorte cuadrado para redes sociales o una portada vertical requerirán recomponer la disposición, no hacer un recorte centrado que corte el título. A escala de miniatura, la silueta principal y el título deben seguir siendo legibles, aunque desaparezcan las pequeñas etiquetas de los márgenes.
Del prompt
crema, gris carbón y verde oliva; jerarquía editorial asimétrica con abundante espacio negativo.
Personalízalo
Crea una portada editorial de [WIDTH] × [HEIGHT]. Usa crema cálido para el lienzo, gris carbón para la tipografía principal y el primer plano, y verde oliva apagado para una única palabra destacada y una curva complementaria. Coloca el paisaje circular detrás de la imagen del primer plano para que la roca se superponga a su borde. Mantén todo el texto aprobado dentro de [SAFE_MARGIN]. Para una versión cuadrada o vertical, recompón el título y la imagen como capas independientes; no recortes la portada horizontal terminada ni fusiones el texto con la imagen.
Revisa el resultado de tu portada de artículo editorial
Compara el resultado con la referencia usando la misma relación de aspecto y, después, revísalo al tamaño en que los lectores lo verán realmente. Evalúa el significado del artículo antes de perfeccionar los detalles superficiales. La imagen es un concepto visual; aún deben comprobarse en los archivos entregados el texto editable, las dimensiones finales y los permisos de los recursos.
- Significado: oculta el titular. ¿La escena restante sigue sugiriendo la tensión central del artículo o implica una afirmación que el artículo no hace?
- Jerarquía: visualiza una miniatura pequeña. ¿Puedes identificar de inmediato el título principal y la silueta? Elimina los detalles que compitan antes de agrandarlo todo.
- Composición: comprueba que el título tenga su propio espacio, que el círculo siga siendo reconocible y que la superposición del primer plano sea intencionada. Compara la portada completa, no detalles decorativos aislados.
- Texto y entrega: verifica el título exacto, la puntuación y el crédito de la publicación. Confirma que la tipografía sea editable, que las capas de imagen estén separadas y que se incluyan las dimensiones solicitadas y cualquier recorte alternativo.
Prompt de seguimiento
Úsalo después del primer resultado. Centra la revisión en la parte más importante de esta tarea.
Perfecciona la portada actual del artículo editorial. Visualiza la portada sin el artículo y comprueba si sugiere el tema correcto. Prueba la ubicación del titular y la escala de la miniatura; la complejidad decorativa no debe ocultar la idea editorial. Conserva el contenido y la dirección visual aprobados; cambia solo lo necesario para resolver estos problemas.
