feat(atlas): mobile-aware halos, higher zoom ceiling, platform logos by titles
Three aesthetic / UX changes to the atlas:
1) Mobile halo restraint. On viewports < 600px the cluster halos were
bleeding into each other and dominating the small screen. Sprite
draw size now scales by 0.6 on mobile and the alpha floor drops from
25% to 10%, so the nebula vibe stays at fully-zoomed-out (where it
belongs) but disappears faster once you pinch in.
2) Higher zoom ceiling + bounded dots. maxZoom 30 → 60. No new data,
but the experience of zooming closer is more rewarding. Dot radius
formula gains a 7px ceiling so the sprite atlas memory stays
bounded (was unbounded in zoom). Per-doc title cap raised at zoom
> 15 from 50 → 200 desktop / 20 → 60 mobile — density naturally
limits collisions, so the dot caps were the real bottleneck. Title
font size grows +1px per 8 zoom levels above 25, capped at +4.
3) Platform logos next to per-doc titles. New site/platforms/ folder
with the best icon per platform (apple-touch-icon / favicon.svg /
favicon.ico → png) for leaflet, whitewind, pckt, offprint,
greengale, and "other" (standard.site favicon). loadPlatformLogos
prefetches in parallel with atlas.json. At zoom > 4.5 each per-doc
title gets a 12-14px icon to the left, with the icon+text combo
centered on the dot. Falls back to text-only positioning until the
logo image loads in (no layout jitter).
The user pushed back on coloring titles by platform: "we made up that
color in the first place." Logos give identity that ties to the
platforms' own brand instead of our palette.
Future: derive legend colors from the dominant hue of each logo so
the palette is grounded in the publishers' actual branding.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
feat(atlas): mobile-aware halos, higher zoom ceiling, platform logos by titles
Three aesthetic / UX changes to the atlas:
1) Mobile halo restraint. On viewports < 600px the cluster halos were
bleeding into each other and dominating the small screen. Sprite
draw size now scales by 0.6 on mobile and the alpha floor drops from
25% to 10%, so the nebula vibe stays at fully-zoomed-out (where it
belongs) but disappears faster once you pinch in.
2) Higher zoom ceiling + bounded dots. maxZoom 30 → 60. No new data,
but the experience of zooming closer is more rewarding. Dot radius
formula gains a 7px ceiling so the sprite atlas memory stays
bounded (was unbounded in zoom). Per-doc title cap raised at zoom
> 15 from 50 → 200 desktop / 20 → 60 mobile — density naturally
limits collisions, so the dot caps were the real bottleneck. Title
font size grows +1px per 8 zoom levels above 25, capped at +4.
3) Platform logos next to per-doc titles. New site/platforms/ folder
with the best icon per platform (apple-touch-icon / favicon.svg /
favicon.ico → png) for leaflet, whitewind, pckt, offprint,
greengale, and "other" (standard.site favicon). loadPlatformLogos
prefetches in parallel with atlas.json. At zoom > 4.5 each per-doc
title gets a 12-14px icon to the left, with the icon+text combo
centered on the dot. Falls back to text-only positioning until the
logo image loads in (no layout jitter).
The user pushed back on coloring titles by platform: "we made up that
color in the first place." Logos give identity that ties to the
platforms' own brand instead of our palette.
Future: derive legend colors from the dominant hue of each logo so
the palette is grounded in the publishers' actual branding.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
feat(atlas): mobile-aware halos, higher zoom ceiling, platform logos by titles
Three aesthetic / UX changes to the atlas:
1) Mobile halo restraint. On viewports < 600px the cluster halos were
bleeding into each other and dominating the small screen. Sprite
draw size now scales by 0.6 on mobile and the alpha floor drops from
25% to 10%, so the nebula vibe stays at fully-zoomed-out (where it
belongs) but disappears faster once you pinch in.
2) Higher zoom ceiling + bounded dots. maxZoom 30 → 60. No new data,
but the experience of zooming closer is more rewarding. Dot radius
formula gains a 7px ceiling so the sprite atlas memory stays
bounded (was unbounded in zoom). Per-doc title cap raised at zoom
> 15 from 50 → 200 desktop / 20 → 60 mobile — density naturally
limits collisions, so the dot caps were the real bottleneck. Title
font size grows +1px per 8 zoom levels above 25, capped at +4.
3) Platform logos next to per-doc titles. New site/platforms/ folder
with the best icon per platform (apple-touch-icon / favicon.svg /
favicon.ico → png) for leaflet, whitewind, pckt, offprint,
greengale, and "other" (standard.site favicon). loadPlatformLogos
prefetches in parallel with atlas.json. At zoom > 4.5 each per-doc
title gets a 12-14px icon to the left, with the icon+text combo
centered on the dot. Falls back to text-only positioning until the
logo image loads in (no layout jitter).
The user pushed back on coloring titles by platform: "we made up that
color in the first place." Logos give identity that ties to the
platforms' own brand instead of our palette.
Future: derive legend colors from the dominant hue of each logo so
the palette is grounded in the publishers' actual branding.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
feat(atlas): mobile-aware halos, higher zoom ceiling, platform logos by titles
Three aesthetic / UX changes to the atlas:
1) Mobile halo restraint. On viewports < 600px the cluster halos were
bleeding into each other and dominating the small screen. Sprite
draw size now scales by 0.6 on mobile and the alpha floor drops from
25% to 10%, so the nebula vibe stays at fully-zoomed-out (where it
belongs) but disappears faster once you pinch in.
2) Higher zoom ceiling + bounded dots. maxZoom 30 → 60. No new data,
but the experience of zooming closer is more rewarding. Dot radius
formula gains a 7px ceiling so the sprite atlas memory stays
bounded (was unbounded in zoom). Per-doc title cap raised at zoom
> 15 from 50 → 200 desktop / 20 → 60 mobile — density naturally
limits collisions, so the dot caps were the real bottleneck. Title
font size grows +1px per 8 zoom levels above 25, capped at +4.
3) Platform logos next to per-doc titles. New site/platforms/ folder
with the best icon per platform (apple-touch-icon / favicon.svg /
favicon.ico → png) for leaflet, whitewind, pckt, offprint,
greengale, and "other" (standard.site favicon). loadPlatformLogos
prefetches in parallel with atlas.json. At zoom > 4.5 each per-doc
title gets a 12-14px icon to the left, with the icon+text combo
centered on the dot. Falls back to text-only positioning until the
logo image loads in (no layout jitter).
The user pushed back on coloring titles by platform: "we made up that
color in the first place." Logos give identity that ties to the
platforms' own brand instead of our palette.
Future: derive legend colors from the dominant hue of each logo so
the palette is grounded in the publishers' actual branding.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
feat(atlas): mobile-aware halos, higher zoom ceiling, platform logos by titles
Three aesthetic / UX changes to the atlas:
1) Mobile halo restraint. On viewports < 600px the cluster halos were
bleeding into each other and dominating the small screen. Sprite
draw size now scales by 0.6 on mobile and the alpha floor drops from
25% to 10%, so the nebula vibe stays at fully-zoomed-out (where it
belongs) but disappears faster once you pinch in.
2) Higher zoom ceiling + bounded dots. maxZoom 30 → 60. No new data,
but the experience of zooming closer is more rewarding. Dot radius
formula gains a 7px ceiling so the sprite atlas memory stays
bounded (was unbounded in zoom). Per-doc title cap raised at zoom
> 15 from 50 → 200 desktop / 20 → 60 mobile — density naturally
limits collisions, so the dot caps were the real bottleneck. Title
font size grows +1px per 8 zoom levels above 25, capped at +4.
3) Platform logos next to per-doc titles. New site/platforms/ folder
with the best icon per platform (apple-touch-icon / favicon.svg /
favicon.ico → png) for leaflet, whitewind, pckt, offprint,
greengale, and "other" (standard.site favicon). loadPlatformLogos
prefetches in parallel with atlas.json. At zoom > 4.5 each per-doc
title gets a 12-14px icon to the left, with the icon+text combo
centered on the dot. Falls back to text-only positioning until the
logo image loads in (no layout jitter).
The user pushed back on coloring titles by platform: "we made up that
color in the first place." Logos give identity that ties to the
platforms' own brand instead of our palette.
Future: derive legend colors from the dominant hue of each logo so
the palette is grounded in the publishers' actual branding.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
feat(atlas): mobile-aware halos, higher zoom ceiling, platform logos by titles
Three aesthetic / UX changes to the atlas:
1) Mobile halo restraint. On viewports < 600px the cluster halos were
bleeding into each other and dominating the small screen. Sprite
draw size now scales by 0.6 on mobile and the alpha floor drops from
25% to 10%, so the nebula vibe stays at fully-zoomed-out (where it
belongs) but disappears faster once you pinch in.
2) Higher zoom ceiling + bounded dots. maxZoom 30 → 60. No new data,
but the experience of zooming closer is more rewarding. Dot radius
formula gains a 7px ceiling so the sprite atlas memory stays
bounded (was unbounded in zoom). Per-doc title cap raised at zoom
> 15 from 50 → 200 desktop / 20 → 60 mobile — density naturally
limits collisions, so the dot caps were the real bottleneck. Title
font size grows +1px per 8 zoom levels above 25, capped at +4.
3) Platform logos next to per-doc titles. New site/platforms/ folder
with the best icon per platform (apple-touch-icon / favicon.svg /
favicon.ico → png) for leaflet, whitewind, pckt, offprint,
greengale, and "other" (standard.site favicon). loadPlatformLogos
prefetches in parallel with atlas.json. At zoom > 4.5 each per-doc
title gets a 12-14px icon to the left, with the icon+text combo
centered on the dot. Falls back to text-only positioning until the
logo image loads in (no layout jitter).
The user pushed back on coloring titles by platform: "we made up that
color in the first place." Logos give identity that ties to the
platforms' own brand instead of our palette.
Future: derive legend colors from the dominant hue of each logo so
the palette is grounded in the publishers' actual branding.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
zzstoatzz.io
