Skip to content

Redraw eleven category icons for legibility and correctness - #210

Merged
sdunster merged 1 commit into
mainfrom
claude/rescue-category-icons-d5rp0r
Sep 10, 2026
Merged

Redraw eleven category icons for legibility and correctness#210
sdunster merged 1 commit into
mainfrom
claude/rescue-category-icons-d5rp0r

Conversation

@sdunster

@sdunster sdunster commented Sep 5, 2026

Copy link
Copy Markdown
Member

Legibility and correctness pass over the category icon set. Picked ten icons at random plus rcr, worked through what each one's defects actually were.

chain_saw, industrial_domestic_rescue, and attend_other were dropped from this PR after review.

Wrong metaphor

  • attend_hq — a document with a flagpole beside it. Its categories are "Attend RHQ" and "Attend SHQ", so it is now a headquarters building flying a flag.
  • attend_other_unit_not_ooaa / _ooaa — the "building" was a bare grid that read as a window or a spreadsheet, and the arrow overlapped its edge. Both are now a unit building with a door and windows, with the arrow clear of it. The pair keeps its existing left/right convention.
  • field_core_skills — the same briefcase as job_ready with an orange square added, so the two were near indistinguishable. Now a hard hat.

Strokes colliding with the shape they sit on

  • maintenance_building_land — the orange tool ran diagonally through the house wall and door. House and tool now sit side by side.
  • earthquake — the orange zigzag crossed the house at mid-wall, so it read as hills behind a house. The house now stands on a ground line with the crack running down its wall.
  • land_search — the orange terrain line overshot the lens rim. Now contained within the lens, and the meaningless dot at the centre is gone.

Weak or ambiguous

  • flood_ops_non_rescue — the sandbags were plain capsules and read as a pile of pebbles. Now a stacked barrier of tied bags above the water.
  • search — the orange dot at the lens centre carried no meaning. The lens now holds a figure, which is what the category searches for, and no longer competes with land_search and search_evidence.
  • public_relations — a single generic bubble, close to the one in critical_incident_support. Now a pair of bubbles, for engagement rather than a lone message. Also drops a translate() offset in favour of real coordinates.
  • rcr — the car sat in the lower-left with the top-right empty, the cabin outline crossed itself, the orange scribble inside the body read as noise, and the impact marks floated free of the vehicle. Now centred, with a clean side profile, a crumpled bonnet as the damage cue, and the orange impact rays anchored to the point of impact.

Conventions

Every icon keeps the house style: 48×48 viewBox, 2.4 navy stroke, icon-stroke / icon-accent-stroke classes intact so theme, hover and active colouring still work, orange on a single secondary detail, and the canvas filled the way the rest of the set fills it.

Only .svg files changed — no code and no icon names, so no call sites are affected.

Testing

  • npm run test:unit — 21 files, 146 tests, all passing.
  • Every icon rendered at 140px, 48px, 32px and 20px, before against after, and against its neighbours in the set to check legibility at button size and to catch metaphor collisions.

🤖 Generated with Claude Code

https://claude.ai/code/session_01JqpAgLZfQLCECpnkdi1wAc

@sdunster sdunster changed the title Redraw the chain saw and road crash rescue category icons Redraw twelve category icons Sep 5, 2026
@sdunster sdunster changed the title Redraw twelve category icons Redraw thirteen category icons Sep 5, 2026
Picked ten icons at random from the set plus rcr, and worked through
what each one's defects actually were.

Wrong metaphor:
- attend_hq: a document with a flagpole beside it. The categories using
  it are "Attend RHQ" and "Attend SHQ", so it is now a headquarters
  building flying a flag.
- attend_other_unit_not_ooaa / _ooaa: the "building" was a bare grid
  that read as a window or a spreadsheet, and the arrow overlapped its
  edge. Both are now a unit building with a door and windows, with the
  arrow clear of it. The pair keeps its existing left/right convention.
- field_core_skills: was the same briefcase as job_ready with an orange
  square added, so the two were near indistinguishable. Now a hard hat.

Strokes colliding with the shape they sit on:
- maintenance_building_land: the orange tool ran diagonally through the
  house wall and door. House and tool now sit side by side.
- earthquake: the orange zigzag crossed the house at mid-wall, so it
  read as hills behind a house. The house now stands on a ground line
  with the crack running down its wall.
- land_search: the orange terrain line overshot the lens rim. It is now
  contained within the lens, and the meaningless dot at the centre is
  gone.

Weak or ambiguous:
- flood_ops_non_rescue: the sandbags were plain capsules and read as a
  pile of pebbles. Now a stacked barrier of tied bags above the water.
- search: the orange dot at the lens centre carried no meaning. The lens
  now holds a figure, which is what the category searches for, and no
  longer competes with land_search and search_evidence.
- public_relations: a single generic bubble, close to the bubble in
  critical_incident_support. Now a pair of bubbles, for engagement
  rather than a lone message. Also drops a translate() offset in favour
  of real coordinates.
- rcr: the car sat in the lower-left with the top-right empty, the
  cabin outline crossed itself, the orange scribble inside the body
  read as noise, and the impact marks floated free of the vehicle. Now
  centred, with a clean side profile, a crumpled bonnet as the damage
  cue, and the orange impact rays anchored to the point of impact.

Every icon keeps the house conventions: 48x48 viewBox, 2.4 navy stroke,
icon-stroke / icon-accent-stroke classes, orange on a single secondary
detail, and the canvas filled the way the rest of the set fills it.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01JqpAgLZfQLCECpnkdi1wAc
@sdunster
sdunster force-pushed the claude/rescue-category-icons-d5rp0r branch from e114981 to e4cad12 Compare September 9, 2026 10:04
@sdunster sdunster changed the title Redraw thirteen category icons Redraw eleven category icons for legibility and correctness Sep 9, 2026
@sdunster
sdunster marked this pull request as ready for review September 9, 2026 10:05
@sdunster
sdunster merged commit 9d1bae7 into main Sep 10, 2026
1 check passed
@sdunster
sdunster deleted the claude/rescue-category-icons-d5rp0r branch September 10, 2026 03:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants