From 805a628f669f0a2e72c091db992e1f86191b6b4b Mon Sep 17 00:00:00 2001 From: Paulo Castellano Date: Sat, 18 Jul 2026 16:56:38 -0300 Subject: [PATCH] feat(release): render a branded changelog thumbnail in the release ritual Add a 1200x630 changelog thumbnail as a fourth release artifact, generated from a shared brand template that mirrors the marketing-site hero / OG image: warm cream to lavender wash, ink dot-grid, an Instrument Serif headline with a hand-drawn violet squiggle, a segmented 'CHANGELOG | ' sticker badge, and colored ink-bordered theme chips with solid offset shadows. - .claude/release-assets/: render-thumbnail.mjs (Playwright renderer), thumbnail.template.html (brand template), logo.png (TryPost wordmark) - .claude/commands/release.md: new Step 5b renders the thumbnail; it is versioned in the artifacts PR alongside the changelog and email - releases/v1.0.6/thumbnail.png: image for the latest release --- .claude/commands/release.md | 55 ++++++-- .claude/release-assets/logo.png | Bin 0 -> 11236 bytes .claude/release-assets/render-thumbnail.mjs | 99 ++++++++++++++ .../release-assets/thumbnail.template.html | 128 ++++++++++++++++++ releases/v1.0.6/thumbnail.png | Bin 0 -> 1376974 bytes 5 files changed, 269 insertions(+), 13 deletions(-) create mode 100644 .claude/release-assets/logo.png create mode 100644 .claude/release-assets/render-thumbnail.mjs create mode 100644 .claude/release-assets/thumbnail.template.html create mode 100644 releases/v1.0.6/thumbnail.png diff --git a/.claude/commands/release.md b/.claude/commands/release.md index 420f41e91..1b00abadc 100644 --- a/.claude/commands/release.md +++ b/.claude/commands/release.md @@ -3,13 +3,14 @@ description: Friday release ritual — create git tag, GitHub release (auto-gene allowed-tools: Bash, Write, Read, Skill --- -You are running the Friday release ritual for TryPost. Three artifacts are produced: +You are running the Friday release ritual for TryPost. Four artifacts are produced: 1. A git tag (semver) 2. A GitHub release with the **auto-generated** changelog (PR list + authors via GitHub's native generator — flat, technical, for developers) 3. A **customer-facing email draft** in Cal.com style (themed prose, end-user voice, no commit/PR references) +4. A **changelog thumbnail** (1200×630 PNG) rendered from the email's headline and themes, using the TryPost brand template -Plus local mirrors in `releases//`. +Plus local mirrors in `releases//` (changelog, email, and thumbnail), versioned via the artifacts PR. **Always confirm with the user before any push/tag/release.** @@ -189,18 +190,45 @@ Run the email body through the `humanizer` skill before previewing: The humanizer skill itself covers all patterns. Trust it. +### Step 5b — Render the changelog thumbnail + +Derive these inputs from the release. The **headline and the chips play different roles — never make one restate the other**: + +- **version** — always pass the release version (e.g. `v1.0.6`). It is stamped in the badge as a mono segment (`★ CHANGELOG | v1.0.6`) so every release image is consistent. Not optional. +- **headline** — a crafted marketing hero line (2-6 words, at most two lines), in the voice of the marketing site's hero (`Run your social media on autopilot`). It sells the *benefit* of the release's biggest wins; it is the loudest thing on the image. Do **NOT** paste the subject line, and do **NOT** just list the theme/chip words — the chips already name the areas, so the headline sits one level above them. Read the email's themes **and** the "New features" bullets, find the strongest story, and write a fresh benefit line. A little rhythm helps (a parallel pair reads well, e.g. `Speak every language, reach every reader`). Sentence case, no version number in the headline itself (it lives in the badge), no period. + - ❌ `Your language, mobile, and per-image alt text` (this is just the chip labels) + - ✅ `Speak every language, reach every reader` (benefit-driven, distinct from the chips) +- **underline** — a short emphasis phrase *inside* the headline (1-3 words) to carry the hand-drawn violet squiggle, usually the last / most important phrase (e.g. `every reader`). Must appear in the headline verbatim. Optional; omit for no squiggle. +- **themes** — 2-4 short chip labels naming the concrete areas that shipped, condensed to 1-2 words each (e.g. `Languages`, `Mobile`, `Alt text & previews`). These are secondary supporting labels, rendered smaller than the headline; the template auto-colors them (violet / green / sky / orange / rose, in order). Keep them concrete and distinct from the headline's wording. + +Create the directory and render the thumbnail so the user can preview it before confirming: + +```bash +mkdir -p releases/ +node .claude/release-assets/render-thumbnail.mjs \ + --version "" \ + --headline "" \ + --underline "" \ + --themes "