Prompts@alexr_designVisual Hero Section Blueprint for Designers
Visual Hero Section Blueprint for Designers

Visual Hero Section Blueprint for Designers

@alexr_design·Updated 08 Jul 2026

Generate a complete, design‑ready hero section layout and a DALL·E‑compatible image prompt, letting UI/UX designers jump from concept to mock‑up in minutes.

text promptgpt-4oclaude-3.5-sonnetgemini-1.5-flash
Prompt - alexr_design/visual-hero-section-blueprint-for-designers/prompt.txt
prompt.txt
## Prompt (Copy‑and‑paste)
```
You are a senior UI/UX designer and creative director. Using the information provided, create a **Visual Hero Section Blueprint** for a landing‑page. The output must be a JSON object with two top‑level keys: `layout` and `image_prompt`.

### Input placeholders (replace with your own values)
- `{{product_name}}` – the name of the product or service.
- `{{target_audience}}` – a brief description of the primary user persona (e.g., "young tech‑savvy professionals").
- `{{brand_adjectives}}` – three to five adjectives that define the brand voice and visual style (e.g., "minimalist, vibrant, trustworthy").
- `{{key_value_proposition}}` – one sentence that captures the core benefit.

### Tasks
1. **Layout generation** – define hierarchy, typography, color palette, spacing, and suggested UI components (headline, sub‑headline, CTA button, supporting graphic). Include accessibility notes (contrast ratio, ARIA label suggestions) and SEO‑friendly HTML tag recommendations.
2. **Image prompt creation** – craft a single DALL·E‑3 / Stable Diffusion prompt that visualizes the hero background or illustration. The prompt must specify:
   - lighting, composition, perspective
   - dominant colors matching the palette
   - style cues derived from `{{brand_adjectives}}`
   - any focal objects or scenes relevant to `{{key_value_proposition}}`

### Output format (must be valid JSON)
```json
{
  "layout": {
    "headline": "<string>",
    "sub_headline": "<string>",
    "cta": {
      "text": "<string>",
      "style": "<primary|secondary>",
      "aria_label": "<string>"
    },
    "typography": {
      "font_family": "<string>",
      "headline_weight": "<string>",
      "body_weight": "<string>"
    },
    "color_palette": {
      "primary": "#xxxxxx",
      "secondary": "#xxxxxx",
      "background": "#xxxxxx",
      "accent": "#xxxxxx"
    },
    "spacing": "<e.g., 24px>",
    "html_tags": {
      "headline": "h1",
      "sub_headline": "h2",
      "cta": "button"
    },
    "accessibility": "<list of checks, e.g., contrast >= 4.5:1>"
  },
  "image_prompt": "<full DALL·E‑3 prompt string>"
}
```

### Quality bar
- All text must be concise (≤ 20 words per field) and persuasive.
- Colors must comply with WCAG AA contrast for headline vs. background.
- The image prompt must be **safe‑for‑work** and avoid copyrighted brand assets.
- No more than 300 total words in the entire JSON payload.

### Constraints
- Do **not** fabricate brand assets; rely only on the provided placeholders.
- If any placeholder is missing, ask the user to fill it before proceeding.
- Keep the response strictly JSON – no additional explanations.
```
Files - extra files in this repo
alexr_design/visual-hero-section-blueprint-for-designers6 files
file-1.txt289 bytes
file-2.txt322 bytes
file-3.txt411 bytes
file-4.txt243 bytes
sources.json223 bytes
thumbnail-source.txt145 bytes