Talk promo card

The speaker does this when a talk is announced. The promo is a portrait card: talk title, event badge, speaker portrait slot, date. The title slide is 16:9. This card is 1200×1500. Both should agree on the talk.

This is announcement work. The promo must not advertise an old title because someone updated the slide and not the card. Portrait promo and the 16:9 title slide should come from one set of talk facts.

The job is to render the promo from per-event { event, date, room } so the announcement matches the talk. One announcement, one file, one run.

Give Lerret a React component under .lerret/ and optional data. export writes a PNG. Same component, data swapped, many images. There is no batch product, no queue, no orchestrator.

The component is .lerret/talks/talk-promo.jsx. It shows the talk title, an event badge, a speaker portrait slot, and the date. The shipped talk-promo size is 1200×1500. The portrait slot is a slot on the artboard. The event badge is part of the component, fed by the event fields.

Data is per-event { event, date, room }. Pass it with --data for that announcement. One announcement, one file, one run. The next event is a new file. Room is on this card because the promo is the announcement, not the title slide.

The image is a PNG 1200×1500, the shipped talk-promo size. Portrait, for the announcement post. The 16:9 title slide is a different artboard. Both come from one set of talk facts, so the promo never advertises an old title.

You use Lerret because the portrait promo and the 16:9 title slide come from one set of talk facts. Change the talk facts and both exports can read them. The card and the slide stay in agreement. A separate design file that drifts from the slide, or a cropped screenshot of the title, will advertise the old title.

Event, date, and room are this card’s per-event fields. Talk title and the portrait slot sit on the component with the event badge. The 1200×1500 PNG is the announcement. The 16:9 title slide is the other artboard.

npx @lerret/cli@latest export --data

Pass the per-event file. Start a project with npx create-lerret@latest. More in the use cases index.