Skip to content

feat(icons): size the mark to Apple's proportions, assemble it from layer art - #9

Merged
keiver merged 1 commit into
mainfrom
feat/icon-scale-and-assembly
Sep 7, 2026
Merged

keiver merged 1 commit into
mainfrom
feat/icon-scale-and-assembly

Conversation

@keiver

@keiver keiver commented Sep 7, 2026 •

Copy link
Copy Markdown
Owner

Sizing

Every centred surface used a hardcoded 0.6 of the shorter side, via an iconScale option no caller ever passed. And the scale sized the artboard, so a designer's own transparent margin shrank the mark again. Tomo TV's art fills 67.6% of its 1024 artboard, so the iOS mark landed at 0.6 × 0.676 = 40.6% of the icon against the ~80% Apple's grid calls for.

The icon is now normalised to the square its visible artwork occupies before scaling, so the number means "the mark covers N% of the canvas" whatever padding the source carries.

Flag Default Source
--ios-icon-scale 0.8 Apple's icon grid centres the primary shape at ~80% of the canvas, ~10% margin
--tv-icon-scale 0.75 tvOS wants a 10-15% safe margin per layer (a focused icon scales ~1.05-1.1x and its layers shift); 0.75 leaves 12.5% a side

Both settable per project via CLI, config file, or the plugin (iosIconScale / tvIconScale).

One content box is measured per run, from the flat icon, and applied to every surface and every parallax layer. Sharing one transform is what keeps the layers registered: normalising each layer to its own bounds would slide the front layer off the middle one. The splash logo is untouched, it already fills its square.

Assembly

--icon is now optional when every icon layer carries its own art. The flat icon is composited from that art back to front and used for the appiconset, Top Shelf, splash logo and icon.png. Tomo TV's icon.svg was byte-for-byte layer-middle.svg + layer-front.svg, a third file kept in sync by hand.

Verified

Against Tomo TV's real art, measured from the generated PNGs:

Before After Target
iOS icon-1024 40.6% 80.0% ~80%
tvOS middle layer 40.6% 75.0% 70-80%

Front layer still registered inside the middle layer's body. 325 tests pass (8 new).

Heads up on the version label

Labelled version:minor: the CLI/config API is backward compatible, every existing flag still works. But the generated icons change proportions for every existing project, which is a visible output change. Relabel to version:major before merging if you'd rather signal that.

Merging publishes to npm via release.yml.

@keiver keiver added the version:minor 1.x.0 label Sep 7, 2026
…ayer art

Two fixes to how the mark is placed and where it comes from.

Sizing. Every centred surface used a hardcoded 0.6 of the shorter side, with an
iconScale option no caller ever passed. Worse, the scale sized the *artboard*,
so a designer's own transparent margin shrank the mark again: Tomo TV's art
fills 67.6% of its 1024 artboard, which put the iOS mark at 40.6% of the icon
against the ~80% Apple's grid calls for.

The icon is now normalised to the square its visible artwork occupies before
scaling, so the number means "the mark covers N% of the canvas" whatever padding
the source carries. Defaults follow Apple: 0.8 on iOS (icon grid, ~10% margin)
and 0.75 on tvOS (inside the 10-15% parallax safe margin, since a focused icon
scales ~1.05-1.1x and its layers slide against each other). Both are settable
per project with --ios-icon-scale and --tv-icon-scale, in a config file, or
through the plugin.

One content box is measured per run, from the flat icon, and applied to every
surface and every parallax layer. Sharing one transform is what keeps the layers
registered; normalising each layer to its own bounds would slide the front layer
off the middle one. The splash logo is untouched, it already fills its square.

Assembly. --icon is now optional when every icon layer carries its own art: the
flat icon is composited from that art back to front and used for the appiconset,
Top Shelf, splash logo and icon.png. Tomo TV's icon.svg was byte-for-byte
layer-middle.svg plus layer-front.svg, a third file kept in sync by hand.

Verified against Tomo TV's real art: iOS lands at 80.0% and the tvOS middle
layer at 75.0%, with the front layer still registered inside it.
@keiver
keiver force-pushed the feat/icon-scale-and-assembly branch from b43d95f to 44c7bd2 Compare September 7, 2026 03:20
@keiver keiver self-assigned this Sep 7, 2026
@keiver
keiver merged commit 24154f9 into main Sep 7, 2026
2 checks passed
@github-actions

github-actions Bot commented Sep 7, 2026

Copy link
Copy Markdown
Contributor

Released as v1.5.0 and published to npm.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant