Skip to content
THE RENDER OFFICEAI IMAGE DEPT.

Creative direction

How to brief an AI landing-page hero image

A hero image has to work with a headline, a button, and a small screen. Start with that arrangement before deciding on the mood. The useful question is what the image should help a visitor understand.

Give the image one communication job

Decide whether the hero needs to explain a product, establish an atmosphere, or show a possible use. Write that job in one sentence. If the headline already explains the offer, the image might provide context. If the product is unfamiliar, the image may need to make its shape or purpose clear.

For an imagined stationery collection, a close view of paper and binding could communicate material detail. A busy desk scene might communicate a working routine. Both can be attractive, but they answer different questions. Pick the question that belongs at the top of the page.

Treat the copy area as part of the brief

Sketch the approximate positions of the headline, supporting sentence, and button. Mark where the subject should sit and which area needs to remain quiet. A blank wall, a simple surface, or a restrained background can provide useful room; a dramatic highlight behind small text usually creates extra finishing work.

Be explicit about the layout you want. Ask for an uncluttered left side or a subject positioned below the headline area. Add the actual text and button in the page design so you can control their appearance and behavior independently of the image.

From the brief

Editorial concept for an unbranded clothbound notebook on a pale blue desk. Position the notebook in the lower-right portion of a landscape frame. Keep the left half quiet and evenly lit, with room for a headline to be added in the page layout. Soft daylight, visible paper edges, one simple graphite pencil. Restrained blue, cream, and charcoal palette. No lettering, logos, or watermark.

Plan the narrow layout separately

A landscape composition may lose its subject when a narrow container crops its sides. Decide whether the mobile page will crop the same image, use a separate composition, or place the image below the text. Make that decision in the layout instead of assuming one file will fit every placement.

For the notebook example, keep a recognizable portion of the notebook within the intended mobile crop. If the crop cannot preserve both the object and enough useful space, brief a second frame. Review any separate generation for changes in the notebook's shape, color, and details.

  • Keep the subject's identifying details away from likely crop boundaries.
  • Check the smallest intended layout with the real headline in place.
  • Confirm that image details do not compete with the primary button.
  • Choose a background treatment that keeps the text readable throughout the layout.

Approve the whole first screen

Place the candidate in the actual page design before selecting it. Read the headline, identify the subject, and find the next action. If the image attracts attention to a detail unrelated to the offer, simplify the composition or choose another frame.

Save the approved desktop and mobile crops alongside the brief. Record where the focal point sits and which areas should remain visible. This gives the person implementing the page clear guidance when the layout changes later.

Put the brief to work.

Bring your next idea to the studio and choose its visual direction.

Open the studio