docs: use the lifecycle GIF as the sole hero, drop the static still

Per review, the motion artifact carries the hero slot on its own. Removes the static composite and merges its caption into the GIF's.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

Author: Christian-Katzmann

README.md

@@ -2,13 +2,9 @@
 
 Turn a local web project into a macOS Dock-launchable `.app` bundle — a native window, its own Dock icon, and clean start/stop — **without Electron, Tauri, or a rewrite.**
 
-![A real app-it build: the Fjord demo running as a native macOS app with its own Dock icon](design/screenshots/01-hero.png)
+![A real app-it build: double-click the Fjord demo's Dock icon, its native window opens, ⌘Q quits and frees the port](design/motion/app-it-lifecycle.gif)
 
-*A real `app-it` build. `Fjord` is an ordinary local web project (`node server.js`); app-it turned it into a native macOS app with its own Dock icon — no Electron, no browser tab, no terminal left open. This screenshot is the actual generated app, not a mockup.*
-
-![The app-it lifecycle: double-click the Dock icon, a native window opens, ⌘Q quits and frees the port](design/motion/app-it-lifecycle.gif)
-
-*The same build, in motion: double-click launches it, the native window opens, and ⌘Q quits the app **and** frees the dev-server port. Animated from that same real window capture.*
+*A real `app-it` build, in motion. `Fjord` is an ordinary local web project (`node server.js`); app-it turns it into a native macOS app — double-click launches it, the window opens with its own Dock icon, and ⌘Q quits the app **and** frees the dev-server port. The actual generated app, not a mockup.*
 
 **Status** — Working, in daily use. The launcher templates are battle-tested across 12+ real projects; `v0.1.0` is the first standalone, marketplace-installable release. macOS only, by design.
 

design/README.md

@@ -1,15 +1,14 @@
 # Design assets
 
-The visual system for `app-it`. One brand color, a calm low-contrast palette, realistic Nordic demo data, and screenshots that are *real generated output* — never mockups.
+The visual system for `app-it`. One brand color, a calm low-contrast palette, realistic Nordic demo data, and visuals that are *real generated output* — never mockups.
 
 ## Assets
 
 | File | What it is | Size |
 | --- | --- | --- |
-| `screenshots/01-hero.png` | README hero — a real app-it build on a brand canvas | 2000×1125 |
-| `screenshots/02-native-window.png` | The same window, clean, for reuse | 1600×1071 |
+| `motion/app-it-lifecycle.gif` | README hero — the lifecycle loop (launch → window → ⌘Q) | 920×518 |
 | `social/social-preview.png` | GitHub social preview poster | 2560×1280 (2:1) |
-| `motion/app-it-lifecycle.gif` | Looping lifecycle: launch → window → ⌘Q | 920×518 |
+| `screenshots/02-native-window.png` | Clean native-window capture — the source frame for the GIF + poster | 1600×1071 |
 
 ## Brand
 
@@ -18,18 +17,15 @@ The visual system for `app-it`. One brand color, a calm low-contrast palette, re
 - **Type:** the native macOS stack (`-apple-system` / SF). app-it lives on macOS; leaning into the system face is honest, not generic.
 - **Wordmark:** `app` in ink, `-it` in accent.
 
-## How the hero was made (it's real)
+## How the visuals were made (they're real)
 
-The hero is not a render of an imagined product. It is `app-it` run on itself:
+Nothing here is a render of an imagined product. It is `app-it` run on itself:
 
 1. A tiny real web project — `Fjord`, a calm local "today" board (`node server.js`) — was built in a throwaway folder.
 2. The actual skill templates (`desktop-build.sh`, `wrapper.swift`, …) turned it into a real `.app`, ad-hoc-signed, installed to `~/Applications/App It/`.
 3. The running native window was captured by its window id (clean, shadowed, no desktop clutter) with `screencapture -l`.
-4. That real window was composed onto a brand canvas with the real generated Dock icon.
+4. That one real capture feeds everything downstream — the looping README hero and the social-preview poster — so the existence *is* the proof: the product had to run to produce the pixels.
 
-So the existence *is* the proof: the product had to run to produce the picture. To regenerate, re-run the steps above and re-export the composition.
-
-## The motion artifact
-
-`motion/app-it-lifecycle.gif` choreographs the launch → native-window → ⌘Q lifecycle using that *same* real window capture and generated icon — so it and the hero are the same provenance, just still vs. moving. It's built deterministically: `motion/lifecycle.source.html` renders frame `?f=<i>&n=<total>`, the frames are screenshotted headless, and ImageMagick assembles the optimized loop. Re-render the frames and re-run `magick -delay 6 -loop 0 frame_*.png -layers optimize` to regenerate.
+## The hero (motion)
 
+`motion/app-it-lifecycle.gif` choreographs the launch → native-window → ⌘Q lifecycle using that real window capture and generated icon. It's built deterministically: `motion/lifecycle.source.html` renders frame `?f=<i>&n=<total>`, the frames are screenshotted headless, and ImageMagick assembles the optimized loop — `magick -delay 6 -loop 0 frame_*.png -layers optimize`, then trimmed to 920w. The social-preview poster shares the same capture, composed onto a brand canvas with the real icon.