---
name: product-ad-headline
description: Turn a product photo into a finished static ad. The product stays the same in a styled scene, and the exact headline, sub-line and button are added locally in your brand colours, in 1:1, 4:5 and 9:16.
metadata:
  type: image
  version: 1.0.0
  category: Social posts & covers
  tagline: Use this Skill to turn a product photo into a finished ad with exact headline text.
  made-for: Brands, E-commerce sellers, Social teams, Agencies
  generates-with: PNG ad, 1:1, 4:5 or 9:16
  requires: Node.js 20.9 or newer and the sharp package (run `npm install sharp` in the Skill folder) for the text step; an image-edit model (the fal model named below with your own FAL_KEY, or any GPT-Image-class editor)
  outside-costs: The image-edit model charges per image, about $0.07 at the default settings (about $0.15 with the nano-banana-pro alternative). The text step runs locally and is free.
  updated: 2026-10-16
  title: Product ad headline
  availability: live
  summary: Turn a product photo into a finished static ad with exact headline, sub-line and button text.
  command: /product-ad-headline my serum photo, headline "Glow that lasts all day.", button "Shop Halden"
  output: PNG · 1:1, 4:5 and 9:16 ad
  required-input: Product photo + headline, sub-line and button text
  creator: meleon
---

# Product ad headline

Use this skill when someone has a product photo and wants a ready-to-post ad: the real product in a styled scene, with a headline, a sub-line and a call-to-action button. The words are never drawn by the image model, so spelling is exact.

## What you need

- One product photo, as a public https URL or image data. The whole product in frame, label readable.
- The product described in a sentence, including exact label text ("amber glass dropper bottle, cream label reading HALDEN").
- The approved headline, sub-line and button text. Use them character for character. Never invent claims, prices or discounts.
- Brand colours, optional (hex codes).
- A scene: your own description of the backdrop and props, or a preset for the product type (`skincare`, `food-pack`, `tech`, `apparel`, `home`, `supplements`). One of the two is required; the script has no default scene so your ad does not copy the sample.
- Brand fonts, optional: a `.ttf`/`.otf` file for `--font-file`.
- Formats: 4:5 is the default; 1:1 and 9:16 on request.

If the photo or the copy is missing, ask for it.

## What you make

A PNG ad at 1080 x 1350 (4:5), 1080 x 1080 (1:1) or 1080 x 1920 (9:16). The art is generated slightly larger (1088 px wide) and composed down, so nothing is upscaled: product unchanged, scene with an empty text area, headline, sub-line and pill button rendered locally. 9:16 keeps text inside the story safe zones.

## How to run it

1. Read `references/ad-guide.md` for formats, copy rules and scenes by product type.
2. Run `node scripts/build-input.mjs --image <url> --product "<description with label text>" (--scene "..." | --preset skincare) [--format 4:5]`. It prints the request JSON.
3. Send the printed `input` as a POST to fal model `openai/gpt-image-2/edit` using your own FAL_KEY (the Skill never stores keys), or paste the `prompt` and the product photo into any GPT-Image-class editor. The alternative is `fal-ai/nano-banana-pro/edit` (give it `image_urls` and `prompt`, `aspect_ratio` and `resolution: "1K"`), at about $0.15 per image, twice the default. Save the image. Delete the uploaded photo URL afterwards if you hosted it publicly.
4. Look at the art next to the input photo. If the product changed, follow the fail path below.
5. In the Skill folder run `npm install sharp` once (Node 20.9 or newer), then run `node scripts/compose-ad.mjs --art art.png --format 4:5 --headline "..." --subline "..." --cta "..." --output ad-4x5.png`. Add `--ink`, `--button`, `--button-text` for brand colours (on a dark scene use a cream `--ink` and a light `--button` with a dark `--button-text`; see `references/ad-guide.md`). Fonts: the default is Georgia (headline) and Helvetica (body) on Mac and Windows, falling back to DejaVu on Linux; the script prints which font it asked for. Pass `--font-file <your .ttf>` (and `--body-font-file`) for exact brand type. Repeat per format with that format's own art.
6. Check every format you made against `references/output-spec.md`, reading the text letter by letter and looking for text touching the product or the story safe zones.
7. Fail path: at most 3 attempts. Change one thing per attempt and say what (label wording, scene, or model; the nano-banana-pro alternative costs about twice as much). View each output beside the input. Then return the best one and say what still differs.
8. Return the ad file(s), the art prompt, and the exact text used.

## Files

- `references/ad-guide.md`: formats, safe zones, copy rules, scenes, failure modes.
- `references/output-spec.md`: sizes and the pass/fail checklist.
- `assets/prompt-template.md`: art prompt with an empty text area.
- `assets/generation-input.json`: model, art sizes per format, scene presets, and the settings that produced the preview.
- `scripts/build-input.mjs`: prints the image-edit request; calls no API.
- `scripts/compose-ad.mjs`: adds the exact headline, sub-line and button locally, measuring text with the real font.