Homepage demo assets: feature screenshots + asciinema recording

[wiiiimm]

Goal

Replace the placeholder slides in the homepage hero slider with real product screenshots, and add an asciinema recording of the actual CLI as the closing "full demo" slide.

Context: the homepage was just repositioned around "everything GitHub at your fingertips — bulk-manage from the terminal, no more clicking." The hero now has a slider (components/hero-slider.tsx) with 4 placeholder slides + the existing demo video. We want real shots that prove the selling points, plus a crisp asciinema cast (free, self-hosted, text-crisp) to replace the blurry GIF.

Features to feature (suggested — and why)

1. Bulk Select mode — our Implement Organization Support Feature #1 selling point. Show several repos selected + a bulk action (e.g. bulk-archive confirmation). This is the "no more one-at-a-time clicking" payoff.
2. Fuzzy search & filter — "find any repo in milliseconds." Reinforces at your fingertips.
3. Repository transfer — the destination picker. A standout differentiator vs the web UI.
4. Fork tracking & sync — ahead/behind counts + one-key sync. Developer-loved, painful on github.com.

Optional bonus shots (nice-to-have): the main repo list / overview, and the session summary on exit (shows estimated time saved — great social proof).

Shared capture setup (do once)

• Terminal size: ~100×30 (cols×rows). Keeps the layout ~16:9 to fit the slider's aspect-video frame without letterboxing.
• Theme: use the CLI's Default (green) theme to match the site — cycle with Shift+T. Keep the same theme across all shots.
• Density: cozy (T cycles compact/cozy/comfy) for readability.
• Font: clean monospace at a readable size; capture on a retina / @2x display for crisp PNGs.
• Account hygiene: use an account/org with representative repos. Avoid exposing private repo names you don't want public. A demo org with ~a dozen repos is ideal.
• Verify keybindings in-app: press ? for the help overlay — the keys in the sub-issues are taken from the site copy; confirm before shooting.

File conventions

• Screenshots → public/screenshots/<name>.png (PNG, @2x): bulk-select.png, fuzzy-search.png, transfer.png, fork-sync.png.
• Recording → public/demo.cast.
• Wiring the assets into the slider/player is a dev task (sub-issue) — just hand off the files.

Sub-issues

• Capture feature screenshots (4 shots)
• Record asciinema hero demo
• Wire screenshots + asciinema into HeroSlider (dev)

[linear-code]

GMC-46

[coderabbitai]

🔗 Related PRs

#60 - feat: add repository creation (Ctrl+N) and transfer (Shift+M) [merged]

---

📝 Issue Planner

_{Check the box below or use the @coderabbitai plan command to generate an implementation plan and prompts that you can use with your favorite coding assistant.}

• Create Plan

---

🧪 Issue enrichment is currently in open beta.

You can configure auto-planning by selecting labels in the issue_enrichment configuration.

To disable automatic issue enrichment, add the following to your .coderabbit.yaml:

issue_enrichment:
  auto_enrich:
    enabled: false

💬 Have feedback or questions? Drop into our discord!