Files
rangerhq-tuner/store/screenshots/README.md
T
ranger c3e5060199 docs(store): add Chrome Web Store screenshots (4× 1280×800 PNG)
Web Store-spec screenshots for Dashboard upload, generated from
David's screen grabs taken on the live v0.3.0 build.

Screenshots (1280×800 PNG, the Chrome Web Store required size):
  1. Stations tab — DEF CON Radio + quick chips + browse list
  2. History tab — the headline 4-button-search feature with 4
     tracks already logged (Spotify / YouTube / Apple / Bandcamp)
  3. Favourites tab — starred-track persistence demo
  4. Toolbar popup — composed on a dark canvas, helmet icon
     visible in the Chrome address bar above

ImageMagick recipe:
  - NTP shots: crop bottom Chrome chrome (1378x950+0+0), resize
    to width 1280, north-anchored extent to 1280x800
  - Popup: resize to height 740, center on 1280x800 canvas
    with palette-matching #0f1411 background

Source originals archived under store/source/ for regeneration.

No code changes — extension behaviour unchanged.
2026-06-09 00:46:08 +01:00

2.3 KiB
Raw Blame History

Chrome Web Store screenshots — RangerHQ Tuner v0.3.0

Upload these in order at: Dashboard → RangerHQ Tuner → Store listing → Screenshots

Spec met: 1280×800 PNG, ≤ 5 images (Chrome Web Store requirement).

# File What it shows Why it earns the slot
1 screenshot-1-stations.png The full New Tab Page on the Stations tab — clock top-right (real-time), DEF CON Radio queued, Play button, eight quick-station chips, searchable browse list of SomaFM channels. First impression. Shows the core product immediately.
2 screenshot-2-history.png The same New Tab Page on the History tab — 4 tracks logged with the Spotify / YouTube / Apple / Bandcamp search buttons per row clearly visible. The headline feature — the single-purpose statement comes alive here.
3 screenshot-3-favourites.png The Favourites tab with a single starred track. Demonstrates the star-toggle persistence and the per-user favourites surface.
4 screenshot-4-popup.png The toolbar popup in context (with the helmet icon visible in the Chrome address bar) showing the bottom nav row: Open in tab / History / Settings. Anchors "where the extension lives" — the Chrome toolbar.

Source files

The original screen grabs (13761378 × 1155 PNGs) are archived at ../source/ and were processed with ImageMagick:

# NTP shots (1378×1156 → 1280×800)
magick main-stations.png -crop 1378x950+0+0 -resize 1280x \
  -gravity north -background "#0f1411" -extent 1280x800 screenshot-1-stations.png

# Popup (367×590 → composed on 1280×800 dark canvas)
magick extension.png -resize x740 \
  -gravity center -background "#0f1411" -extent 1280x800 screenshot-4-popup.png

Same dark base colour #0f1411 as the popup palette, so the Dashboard preview blends naturally with the extension's own visuals.

Optional follow-on assets (deferred)

  • Promo tile (440×280 PNG) — required by the Web Store for the listing tile in search/browse results. Not yet produced.
  • Marquee tile (1400×560 PNG) — optional but Google promotes extensions with marquee assets more often. Not yet produced.

Both can be generated from ../source/ plus the helmet logo at ../../src/assets/img/ranger.png whenever ready.