Plantilla de prompt

Tablero de presentación de un sistema de diseño con tokens, tipografía y componentes

Este prompt pide un único tablero de presentación que resuma el sistema de diseño de un producto que tú elijas; por defecto, una plataforma moderna de analítica SaaS. Enumera las secciones que debe incluir: tokens de color, muestras tipográficas, estilo de iconos, botones, campos de entrada, tarjetas de datos, componentes de gráficos y ejemplos de espaciado, y descarta el texto diminuto, las tarjetas superpuestas, los degradados aleatorios y los logotipos falsos de marcas. Nuestro ejemplo dio como resultado un tablero limpio con muestras etiquetadas de colores primarios, semánticos y neutros, una escala tipográfica, un conjunto de iconos de contorno, estados de botones y campos, tarjetas KPI, cuatro tipos de gráficos y una escala de espaciado. Úsalo para proponer una dirección visual, abrir una revisión de diseño o mostrar de un vistazo una guía de estilo en una presentación o un caso de estudio.

Relación de aspecto 16:9No necesita imagen de referencia
Tablero de diseño para una plataforma de analítica: colores, escala tipográfica, iconos de contorno, botones, estados de campos, tarjetas, gráficos y espaciado
Ejemplo creado en Nano Banana Pro con GPT Image 2. Con otras entradas y ajustes el resultado puede ser distinto.

Prompt de la plantilla

Copia el prompt en el generador de imágenes y sustituye los datos entre corchetes por los tuyos.

Create a design system presentation board for [a modern SaaS analytics platform]. Include color tokens, typography samples, icon style, buttons, input fields, data cards, chart components, and spacing examples. Style: clean professional Figma-like board, precise alignment, readable labels, and consistent component proportions. Restrictions: no unreadable tiny text, no overlapping cards, no random gradients, no fake brand logos, no inconsistent UI styles.

Idea de prompt de github.com. Ver la publicación original

Para qué sirve

  • Proponer una dirección visual para un producto nuevo antes de construir los componentes
  • Imágenes de portada para la documentación de un sistema de diseño o un caso de estudio
  • Diapositivas de arranque para una revisión de diseño con ingenieros y product managers
  • Comparar dos o tres direcciones de estilo una al lado de la otra

Consejos para el prompt

  • Sustituye el producto entre corchetes por el tuyo, como una app bancaria o una herramienta de reservas
  • Añade una paleta o el nombre de una fuente si ya los tienes; si no, el modelo elegirá los suyos
  • Mantén la línea de restricciones para orientar la composición y desalentar logotipos inventados, y después revisa el resultado
  • Toma los códigos hexadecimales y los tamaños del tablero como sugerencias y compruébalos antes de reutilizarlos
  • Quita las secciones que no necesites, como los gráficos, para dejar más espacio al resto