hero-image-art-direction git:20260905.f7824baA

Immutable. This exact content is served forever at /api/v1/blob/ec4f9bb88cb58af1.

---
name: hero-image-art-direction
description: "Compose text-safe responsive hero media."
---

# Hero Image Art Direction

Use this skill to make the first viewport immediately specific, inspectable, and composed.

## Workflow

1. Inspect the project, media assets, framework image/video APIs, responsive breakpoints, accessibility requirements, and verification commands.
2. Read [Hero Image Art Direction Guide](references/hero-image-art-direction-guide.md) for detailed direction before changing visuals or code.
3. Define the media's job: proof, desire, navigation, instruction, atmosphere, conversion, or accessibility.
4. Implement with stable dimensions, responsive crops, useful fallbacks, and real content hierarchy.
5. Inspect rendered desktop and mobile states, then refine crop, contrast, loading, labels, captions, and polish.

## Scoped execution

Apply the [shared web contract](../website-operating-rules/references/scoped-web-contract.md) once when execution crosses phases; reuse it if already read. Load only the specialist guidance relevant to the requested surface and deliverable.