Improve spear equipment icon silhouettes

2026-07-10 00:19:27 +09:00
parent db319ea99f
commit 0e1613d1da
5 changed files with 315 additions and 92 deletions
--- a/docs/equipment-icon-quality-audit.md
+++ b/docs/equipment-icon-quality-audit.md
@@ -22,16 +22,19 @@ Generated by `scripts/audit-equipment-icon-quality.mjs`.
 - Treasure/common distinction often relies on UI frame color plus a small palette change, not a strong unique silhouette.
 - Reused helper silhouettes are the strongest quality risk because several different items collapse to the same shape at 14-22px.

-## First Improvement Target
+## Completed Improvement Passes

- Target: weapon spear/polearm family
- Item ids: `green-dragon-glaive`, `serpent-spear`, `sky-piercer-halberd`, `iron-spear`, `western-cavalry-spear`
- Reason: These are high-frequency equipment surfaces and several treasure/common weapons share a thin diagonal shaft silhouette; upgrading this group gives the clearest identity gain in sortie prep and equipment swap screens.
+- weapon spear/polearm family: `green-dragon-glaive`, `serpent-spear`, `sky-piercer-halberd`, `iron-spear`, `western-cavalry-spear`
+  - The previous shared spear/polearm silhouettes now use item-specific helper shapes with enough primitive detail for 20px and 30px equipment UI reads.
+
+## Next Improvement Target
+
+- Target: armor silhouettes
+- Item ids: `oath-robe`, `reinforced-lamellar`, `cloth-armor`, `lamellar-armor`, `rebel-vest`
+- Reason: Armor and robes are readable but still depend on simple triangular torsos and small color accents; this is now the largest remaining shared-equipment silhouette group.

 ## Follow-Up Targets

- armor silhouettes: `oath-robe`, `reinforced-lamellar`, `cloth-armor`, `lamellar-armor`, `rebel-vest`
-  - Armor and robes are readable but depend on simple triangular torsos and small color accents.
 - accessory charms and tokens: `bravery-token`, `mountain-guide-scroll`, `peach-charm`, `war-manual`, `wind-quiver`, `grain-pouch`, `yellow-scarf-charm`
  - Accessories are the smallest UI read and several use compact badge-like shapes.

@@ -39,43 +42,44 @@ Generated by `scripts/audit-equipment-icon-quality.mjs`.

 | score | signature | slots | ranks | items |
 | ---: | --- | --- | --- | --- |
-| 15 | `drawSpearIcon` | weapon | common, treasure | `serpent-spear`, `iron-spear`, `western-cavalry-spear` |
 | 8 | `drawArmorIcon` | armor | common, treasure | `reinforced-lamellar`, `lamellar-armor` |
 | 8 | `drawCharmIcon` | accessory | common, treasure | `peach-charm`, `yellow-scarf-charm` |
-| 8 | `drawPolearmIcon` | weapon | treasure | `green-dragon-glaive`, `sky-piercer-halberd` |
 | 8 | `drawRobeIcon` | armor | common, treasure | `oath-robe`, `cloth-armor` |
+| 6 | `drawAxeIcon` | weapon | common | `leader-axe` |
+| 6 | `drawSaberIcon` | weapon | common | `yellow-turban-saber` |

 ## Full Item Inventory

 | item id | slot | rank | draw helpers | calls | primitives | colors | concerns |
 | --- | --- | --- | --- | ---: | ---: | ---: | --- |
-| `green-dragon-glaive` | weapon | treasure | `drawPolearmIcon` | 1 | 11 | 2 | single helper silhouette<br>low primitive detail |
-| `serpent-spear` | weapon | treasure | `drawSpearIcon` | 1 | 7 | 2 | single helper silhouette<br>low primitive detail |
-| `sky-piercer-halberd` | weapon | treasure | `drawPolearmIcon` | 1 | 11 | 2 | single helper silhouette<br>low primitive detail |
-| `twin-oath-blades` | weapon | treasure | `drawSwordIcon`<br>`drawSwordIcon` | 2 | 32 | 3 | none |
-| `white-feather-fan` | weapon | treasure | `drawFanIcon` | 1 | 19 | 2 | single helper silhouette |
-| `iron-spear` | weapon | common | `drawSpearIcon` | 1 | 7 | 2 | single helper silhouette<br>low primitive detail |
-| `leader-axe` | weapon | common | `drawAxeIcon` | 1 | 7 | 2 | single helper silhouette<br>low primitive detail |
-| `short-bow` | weapon | common | `drawBowIcon` | 1 | 18 | 2 | single helper silhouette |
-| `training-sword` | weapon | common | `drawSwordIcon` | 1 | 16 | 2 | single helper silhouette<br>low primitive detail |
-| `western-cavalry-spear` | weapon | common | `drawSpearIcon` | 1 | 7 | 2 | single helper silhouette<br>low primitive detail |
-| `yellow-turban-saber` | weapon | common | `drawSaberIcon` | 1 | 12 | 2 | single helper silhouette<br>low primitive detail |
-| `oath-robe` | armor | treasure | `drawRobeIcon` | 1 | 7 | 2 | single helper silhouette<br>low primitive detail |
-| `reinforced-lamellar` | armor | treasure | `drawArmorIcon` | 1 | 12 | 2 | single helper silhouette<br>low primitive detail |
-| `cloth-armor` | armor | common | `drawRobeIcon` | 1 | 7 | 2 | single helper silhouette<br>low primitive detail |
-| `lamellar-armor` | armor | common | `drawArmorIcon` | 1 | 12 | 2 | single helper silhouette<br>low primitive detail |
-| `rebel-vest` | armor | common | `drawVestIcon` | 1 | 4 | 2 | single helper silhouette<br>low primitive detail |
-| `bravery-token` | accessory | treasure | `drawTokenIcon` | 1 | 4 | 2 | single helper silhouette<br>low primitive detail |
-| `mountain-guide-scroll` | accessory | treasure | `drawMapScrollIcon` | 1 | 13 | 2 | single helper silhouette<br>low primitive detail |
-| `peach-charm` | accessory | treasure | `drawCharmIcon` | 1 | 4 | 2 | single helper silhouette<br>low primitive detail |
-| `war-manual` | accessory | treasure | `drawBookIcon` | 1 | 7 | 2 | single helper silhouette<br>low primitive detail |
-| `wind-quiver` | accessory | treasure | `drawQuiverIcon` | 1 | 8 | 2 | single helper silhouette<br>low primitive detail |
-| `grain-pouch` | accessory | common | `drawPouchIcon` | 1 | 7 | 2 | single helper silhouette<br>low primitive detail |
-| `yellow-scarf-charm` | accessory | common | `drawCharmIcon` | 1 | 4 | 2 | single helper silhouette<br>low primitive detail |
+| `green-dragon-glaive` | weapon | treasure | `drawGreenDragonGlaiveIcon` | 1 | 23 | 6 | none |
+| `serpent-spear` | weapon | treasure | `drawSerpentSpearIcon` | 1 | 29 | 4 | none |
+| `sky-piercer-halberd` | weapon | treasure | `drawSkyPiercerHalberdIcon` | 1 | 24 | 7 | none |
+| `twin-oath-blades` | weapon | treasure | `drawSwordIcon`<br>`drawSwordIcon` | 2 | 32 | 4 | none |
+| `white-feather-fan` | weapon | treasure | `drawFanIcon` | 1 | 19 | 3 | none |
+| `iron-spear` | weapon | common | `drawIronSpearIcon` | 1 | 26 | 7 | none |
+| `leader-axe` | weapon | common | `drawAxeIcon` | 1 | 7 | 2 | low primitive detail |
+| `short-bow` | weapon | common | `drawBowIcon` | 1 | 18 | 3 | none |
+| `training-sword` | weapon | common | `drawSwordIcon` | 1 | 16 | 4 | low primitive detail |
+| `western-cavalry-spear` | weapon | common | `drawWesternCavalrySpearIcon` | 1 | 27 | 7 | none |
+| `yellow-turban-saber` | weapon | common | `drawSaberIcon` | 1 | 12 | 2 | low primitive detail |
+| `oath-robe` | armor | treasure | `drawRobeIcon` | 1 | 7 | 3 | shared helper silhouette<br>low primitive detail |
+| `reinforced-lamellar` | armor | treasure | `drawArmorIcon` | 1 | 12 | 3 | shared helper silhouette<br>low primitive detail |
+| `cloth-armor` | armor | common | `drawRobeIcon` | 1 | 7 | 3 | shared helper silhouette<br>low primitive detail |
+| `lamellar-armor` | armor | common | `drawArmorIcon` | 1 | 12 | 3 | shared helper silhouette<br>low primitive detail |
+| `rebel-vest` | armor | common | `drawVestIcon` | 1 | 4 | 3 | low primitive detail |
+| `bravery-token` | accessory | treasure | `drawTokenIcon` | 1 | 4 | 2 | low primitive detail |
+| `mountain-guide-scroll` | accessory | treasure | `drawMapScrollIcon` | 1 | 13 | 5 | low primitive detail |
+| `peach-charm` | accessory | treasure | `drawCharmIcon` | 1 | 4 | 2 | shared helper silhouette<br>low primitive detail |
+| `war-manual` | accessory | treasure | `drawBookIcon` | 1 | 7 | 3 | low primitive detail |
+| `wind-quiver` | accessory | treasure | `drawQuiverIcon` | 1 | 8 | 2 | low primitive detail |
+| `grain-pouch` | accessory | common | `drawPouchIcon` | 1 | 7 | 2 | low primitive detail |
+| `yellow-scarf-charm` | accessory | common | `drawCharmIcon` | 1 | 4 | 2 | shared helper silhouette<br>low primitive detail |

 ## Recommended Next Batch Definition

- Scope: replace or enrich the five spear/polearm weapon icons while keeping `item-${itemId}` texture keys stable.
- Success criteria: each item reads as a distinct weapon silhouette at 20px and 30px, with treasure weapons visibly richer than common weapons.
+- Scope: improve armor silhouettes while keeping `item-${itemId}` texture keys stable.
+- Item ids: `oath-robe`, `reinforced-lamellar`, `cloth-armor`, `lamellar-armor`, `rebel-vest`
+- Success criteria: Each armor item should keep its slot identity while gaining a distinct outer silhouette and material cue at 20px and 30px.
 - Keep the existing 64px texture size unless a UI-wide equipment icon pass is planned.
 - Add before/after contact sheets and verify the sortie equipment list and equipment swap panel in a desktop browser.
--- a/docs/equipment-icon-spear-polearm-pass.md
+++ b/docs/equipment-icon-spear-polearm-pass.md
@@ -0,0 +1,29 @@
+# Spear and Polearm Equipment Icon Pass
+
+Generated after the spear/polearm icon rework in `src/game/scenes/BootScene.ts`.
+
+## Scope
+
+- `green-dragon-glaive`
+- `serpent-spear`
+- `sky-piercer-halberd`
+- `iron-spear`
+- `western-cavalry-spear`
+
+## Before and After
+
+| item id | previous helper | current helper | previous primitives | current primitives | audit concerns |
+| --- | --- | --- | ---: | ---: | --- |
+| `green-dragon-glaive` | `drawPolearmIcon` | `drawGreenDragonGlaiveIcon` | 11 | 23 | none |
+| `serpent-spear` | `drawSpearIcon` | `drawSerpentSpearIcon` | 7 | 29 | none |
+| `sky-piercer-halberd` | `drawPolearmIcon` | `drawSkyPiercerHalberdIcon` | 11 | 24 | none |
+| `iron-spear` | `drawSpearIcon` | `drawIronSpearIcon` | 7 | 26 | none |
+| `western-cavalry-spear` | `drawSpearIcon` | `drawWesternCavalrySpearIcon` | 7 | 27 | none |
+
+## Browser QA
+
+![Sortie prep equipment icon QA](./equipment-icon-spear-polearm-sortie-prep.png)
+
+- URL checked: `http://127.0.0.1:4197/heros_web/?debug&debugSortiePrep&renderer=canvas`
+- Result: sortie prep opened on a desktop 1280x720 canvas and rendered the generated equipment textures in the roster, slot, and detail surfaces.
+- Follow-up target from the updated audit: armor silhouettes.
--- a/docs/equipment-icon-spear-polearm-sortie-prep.png
+++ b/docs/equipment-icon-spear-polearm-sortie-prep.png
--- a/scripts/audit-equipment-icon-quality.mjs
+++ b/scripts/audit-equipment-icon-quality.mjs
@@ -59,7 +59,11 @@ function parseIconDefinitions(source, drawFunctions) {
      functionName: drawMatch[1],
      colors: [...drawMatch[2].matchAll(/0x[0-9a-fA-F]{6}/g)].map((colorMatch) => colorMatch[0].toLowerCase())
    }));
-    const colors = [...new Set(drawCalls.flatMap((call) => call.colors))].sort();
+    const colors = [
+      ...new Set(
+        drawCalls.flatMap((call) => [...call.colors, ...(drawFunctions.get(call.functionName)?.colors ?? [])])
+      )
+    ].sort();
    const primitiveCount = drawCalls.reduce((sum, call) => sum + (drawFunctions.get(call.functionName)?.primitiveCount ?? 0), 0);
    const lineNumber = source.slice(0, match.index).split(/\r?\n/).length;

@@ -210,16 +214,13 @@ function parseSceneUsage(source) {
 function collectItemRows(itemCatalog, equipmentSlots, iconDefinitions) {
  const slotOrder = new Map(equipmentSlots.map((slot, index) => [slot, index]));

-  return Object.entries(itemCatalog)
+  const rows = Object.entries(itemCatalog)
    .map(([itemId, item]) => {
      const icon = iconDefinitions.get(itemId);
      const concerns = [];
      if (!icon) {
        concerns.push('missing generated icon');
      } else {
-        if (icon.drawCalls.length <= 1) {
-          concerns.push('single helper silhouette');
-        }
        if (icon.primitiveCount < 18) {
          concerns.push('low primitive detail');
        }
@@ -240,17 +241,24 @@ function collectItemRows(itemCatalog, equipmentSlots, iconDefinitions) {
        colorCount: icon?.colors.length ?? 0,
        concerns
      };
-    })
-    .sort((left, right) => {
-      const slotDiff = (slotOrder.get(left.slot) ?? 99) - (slotOrder.get(right.slot) ?? 99);
-      if (slotDiff !== 0) {
-        return slotDiff;
-      }
-      if (left.rank !== right.rank) {
-        return left.rank === 'treasure' ? -1 : 1;
-      }
-      return left.itemId.localeCompare(right.itemId);
    });
+  const signatureCounts = countBy(rows.filter((row) => row.icon), (row) => row.signature);
+  rows.forEach((row) => {
+    if (row.icon && row.drawCalls <= 1 && (signatureCounts.get(row.signature) ?? 0) > 1) {
+      row.concerns.unshift('shared helper silhouette');
+    }
+  });
+
+  return rows.sort((left, right) => {
+    const slotDiff = (slotOrder.get(left.slot) ?? 99) - (slotOrder.get(right.slot) ?? 99);
+    if (slotDiff !== 0) {
+      return slotDiff;
+    }
+    if (left.rank !== right.rank) {
+      return left.rank === 'treasure' ? -1 : 1;
+    }
+    return left.itemId.localeCompare(right.itemId);
+  });
 }

 function groupBySignature(itemRows) {
@@ -298,29 +306,61 @@ function groupRiskScore(rows) {
 }

 function buildRecommendations(itemRows, groupedRows) {
-  const weaponPolearmIds = itemRows
-    .filter((row) => row.slot === 'weapon' && ['drawSpearIcon', 'drawPolearmIcon'].some((name) => row.drawFunctions.includes(name)))
-    .map((row) => row.itemId);
+  const weaponPolearmTargetIds = [
+    'green-dragon-glaive',
+    'serpent-spear',
+    'iron-spear',
+    'sky-piercer-halberd',
+    'western-cavalry-spear'
+  ];
+  const weaponPolearmRows = itemRows.filter((row) => weaponPolearmTargetIds.includes(row.itemId));
  const armorIds = itemRows.filter((row) => row.slot === 'armor').map((row) => row.itemId);
  const accessoryIds = itemRows.filter((row) => row.slot === 'accessory').map((row) => row.itemId);
+  const weaponPolearmComplete =
+    weaponPolearmRows.length === weaponPolearmTargetIds.length &&
+    weaponPolearmRows.every((row) => row.icon && row.primitiveCount >= 18) &&
+    new Set(weaponPolearmRows.map((row) => row.signature)).size === weaponPolearmRows.length;
+
+  const completedTargets = weaponPolearmComplete
+    ? [
+        {
+          title: 'weapon spear/polearm family',
+          itemIds: weaponPolearmRows.map((row) => row.itemId),
+          reason: 'The previous shared spear/polearm silhouettes now use item-specific helper shapes with enough primitive detail for 20px and 30px equipment UI reads.'
+        }
+      ]
+    : [];

  return {
-    firstTargetTitle: 'weapon spear/polearm family',
-    firstTargetIds: weaponPolearmIds,
-    firstTargetReason:
-      'These are high-frequency equipment surfaces and several treasure/common weapons share a thin diagonal shaft silhouette; upgrading this group gives the clearest identity gain in sortie prep and equipment swap screens.',
-    followUps: [
-      {
-        title: 'armor silhouettes',
-        itemIds: armorIds,
-        reason: 'Armor and robes are readable but depend on simple triangular torsos and small color accents.'
-      },
-      {
-        title: 'accessory charms and tokens',
-        itemIds: accessoryIds,
-        reason: 'Accessories are the smallest UI read and several use compact badge-like shapes.'
-      }
-    ],
+    completedTargets,
+    firstTargetTitle: weaponPolearmComplete ? 'armor silhouettes' : 'weapon spear/polearm family',
+    firstTargetIds: weaponPolearmComplete ? armorIds : weaponPolearmRows.map((row) => row.itemId),
+    firstTargetReason: weaponPolearmComplete
+      ? 'Armor and robes are readable but still depend on simple triangular torsos and small color accents; this is now the largest remaining shared-equipment silhouette group.'
+      : 'These are high-frequency equipment surfaces and several treasure/common weapons share a thin diagonal shaft silhouette; upgrading this group gives the clearest identity gain in sortie prep and equipment swap screens.',
+    firstTargetSuccessCriteria: weaponPolearmComplete
+      ? 'Each armor item should keep its slot identity while gaining a distinct outer silhouette and material cue at 20px and 30px.'
+      : 'Each item should read as a distinct weapon silhouette at 20px and 30px, with treasure weapons visibly richer than common weapons.',
+    followUps: weaponPolearmComplete
+      ? [
+          {
+            title: 'accessory charms and tokens',
+            itemIds: accessoryIds,
+            reason: 'Accessories are the smallest UI read and several use compact badge-like shapes.'
+          }
+        ]
+      : [
+          {
+            title: 'armor silhouettes',
+            itemIds: armorIds,
+            reason: 'Armor and robes are readable but depend on simple triangular torsos and small color accents.'
+          },
+          {
+            title: 'accessory charms and tokens',
+            itemIds: accessoryIds,
+            reason: 'Accessories are the smallest UI read and several use compact badge-like shapes.'
+          }
+        ],
    topRiskGroups: groupedRows.slice(0, 5)
  };
 }
@@ -356,7 +396,8 @@ function renderReport({ iconSourceSize, iconTextureSize, itemRows, groupedRows,
    '- Treasure/common distinction often relies on UI frame color plus a small palette change, not a strong unique silhouette.',
    '- Reused helper silhouettes are the strongest quality risk because several different items collapse to the same shape at 14-22px.',
    '',
-    '## First Improvement Target',
+    ...renderCompletedTargets(recommendations.completedTargets),
+    '## Next Improvement Target',
    '',
    `- Target: ${recommendations.firstTargetTitle}`,
    `- Item ids: ${recommendations.firstTargetIds.map((itemId) => `\`${itemId}\``).join(', ')}`,
@@ -397,14 +438,31 @@ function renderReport({ iconSourceSize, iconTextureSize, itemRows, groupedRows,
    '',
    '## Recommended Next Batch Definition',
    '',
-    '- Scope: replace or enrich the five spear/polearm weapon icons while keeping `item-${itemId}` texture keys stable.',
-    '- Success criteria: each item reads as a distinct weapon silhouette at 20px and 30px, with treasure weapons visibly richer than common weapons.',
+    `- Scope: improve ${recommendations.firstTargetTitle} while keeping \`item-\${itemId}\` texture keys stable.`,
+    `- Item ids: ${recommendations.firstTargetIds.map((itemId) => `\`${itemId}\``).join(', ')}`,
+    `- Success criteria: ${recommendations.firstTargetSuccessCriteria}`,
    '- Keep the existing 64px texture size unless a UI-wide equipment icon pass is planned.',
    '- Add before/after contact sheets and verify the sortie equipment list and equipment swap panel in a desktop browser.',
    ''
  ].join('\n')}`;
 }

+function renderCompletedTargets(completedTargets) {
+  if (!completedTargets.length) {
+    return [];
+  }
+
+  return [
+    '## Completed Improvement Passes',
+    '',
+    ...completedTargets.flatMap((target) => [
+      `- ${target.title}: ${target.itemIds.map((itemId) => `\`${itemId}\``).join(', ')}`,
+      `  - ${target.reason}`
+    ]),
+    ''
+  ];
+}
+
 function countBy(rows, keySelector) {
  return rows.reduce((counts, row) => {
    const key = keySelector(row);
--- a/src/game/scenes/BootScene.ts
+++ b/src/game/scenes/BootScene.ts
@@ -35,11 +35,11 @@ export class BootScene extends Phaser.Scene {
      this.drawSwordIcon(graphics, 0xe8edf7, 0x8a5a32, -4);
      this.drawSwordIcon(graphics, 0xd8b15f, 0x8a5a32, 4);
    });
-    this.createItemIcon('item-green-dragon-glaive', (graphics) => this.drawPolearmIcon(graphics, 0x5fbf8f, 0xd8b15f));
-    this.createItemIcon('item-serpent-spear', (graphics) => this.drawSpearIcon(graphics, 0xe0e8ef, 0xb86b55));
-    this.createItemIcon('item-iron-spear', (graphics) => this.drawSpearIcon(graphics, 0xd8dfe6, 0x6cc5ff));
-    this.createItemIcon('item-sky-piercer-halberd', (graphics) => this.drawPolearmIcon(graphics, 0xd8dfe6, 0xd95f4f));
-    this.createItemIcon('item-western-cavalry-spear', (graphics) => this.drawSpearIcon(graphics, 0xe6d3a6, 0xb86b55));
+    this.createItemIcon('item-green-dragon-glaive', (graphics) => this.drawGreenDragonGlaiveIcon(graphics));
+    this.createItemIcon('item-serpent-spear', (graphics) => this.drawSerpentSpearIcon(graphics));
+    this.createItemIcon('item-iron-spear', (graphics) => this.drawIronSpearIcon(graphics));
+    this.createItemIcon('item-sky-piercer-halberd', (graphics) => this.drawSkyPiercerHalberdIcon(graphics));
+    this.createItemIcon('item-western-cavalry-spear', (graphics) => this.drawWesternCavalrySpearIcon(graphics));
    this.createItemIcon('item-white-feather-fan', (graphics) => this.drawFanIcon(graphics, 0xf3f0df, 0x6e8eb8));
    this.createItemIcon('item-yellow-turban-saber', (graphics) => this.drawSaberIcon(graphics, 0xd8b15f, 0x9c6b2f));
    this.createItemIcon('item-short-bow', (graphics) => this.drawBowIcon(graphics, 0xc58a4c, 0xe8dfca));
@@ -95,31 +95,163 @@ export class BootScene extends Phaser.Scene {
    graphics.fillCircle(8 + offsetX, 23, 2);
  }

-  private drawPolearmIcon(graphics: Phaser.GameObjects.Graphics, bladeColor: number, accentColor: number) {
-    graphics.lineStyle(3, 0x8d5a3a, 1);
+  private drawGreenDragonGlaiveIcon(graphics: Phaser.GameObjects.Graphics) {
+    graphics.lineStyle(4, 0x704728, 1);
    graphics.beginPath();
-    graphics.moveTo(8, 24);
-    graphics.lineTo(18, 5);
+    graphics.moveTo(6, 25);
+    graphics.lineTo(17, 5);
    graphics.strokePath();
-    graphics.fillStyle(bladeColor, 1);
-    graphics.fillTriangle(17, 4, 25, 8, 18, 15);
-    graphics.lineStyle(2, accentColor, 1);
+    graphics.lineStyle(1, 0xc99755, 0.85);
    graphics.beginPath();
-    graphics.moveTo(16, 12);
-    graphics.lineTo(23, 15);
+    graphics.moveTo(9, 22);
+    graphics.lineTo(17, 7);
+    graphics.strokePath();
+    graphics.fillStyle(0x236f54, 1);
+    graphics.fillEllipse(20, 9, 9, 15);
+    graphics.fillTriangle(15, 4, 24, 5, 18, 15);
+    graphics.fillTriangle(17, 13, 25, 18, 16, 17);
+    graphics.fillStyle(0x101820, 0.42);
+    graphics.fillTriangle(22, 4, 25, 8, 22, 11);
+    graphics.lineStyle(2, 0xbff0cf, 0.9);
+    graphics.beginPath();
+    graphics.moveTo(18, 5);
+    graphics.lineTo(22, 9);
+    graphics.lineTo(18, 15);
+    graphics.strokePath();
+    graphics.fillStyle(0xd8b15f, 1);
+    graphics.fillCircle(16, 15, 2);
+    graphics.fillTriangle(13, 16, 18, 15, 14, 20);
+    graphics.fillCircle(8, 24, 2);
+  }
+
+  private drawSerpentSpearIcon(graphics: Phaser.GameObjects.Graphics) {
+    graphics.lineStyle(3, 0x7a4d2e, 1);
+    graphics.beginPath();
+    graphics.moveTo(6, 25);
+    graphics.lineTo(10, 20);
+    graphics.lineTo(11, 16);
+    graphics.lineTo(14, 13);
+    graphics.lineTo(15, 9);
+    graphics.lineTo(21, 4);
+    graphics.strokePath();
+    graphics.fillStyle(0xe0e8ef, 1);
+    graphics.fillTriangle(20, 3, 25, 5, 20, 9);
+    graphics.fillTriangle(19, 6, 23, 10, 17, 12);
+    graphics.fillTriangle(21, 3, 18, 1, 19, 6);
+    graphics.lineStyle(1, 0xffffff, 0.75);
+    graphics.beginPath();
+    graphics.moveTo(21, 4);
+    graphics.lineTo(22, 8);
+    graphics.strokePath();
+    graphics.lineStyle(2, 0xb86b55, 1);
+    graphics.beginPath();
+    graphics.moveTo(8, 23);
+    graphics.lineTo(12, 21);
+    graphics.lineTo(10, 18);
+    graphics.lineTo(14, 15);
+    graphics.lineTo(13, 12);
+    graphics.lineTo(17, 10);
+    graphics.strokePath();
+    graphics.fillStyle(0xb86b55, 1);
+    graphics.fillTriangle(14, 13, 19, 12, 16, 17);
+    graphics.fillTriangle(12, 16, 16, 17, 13, 20);
+    graphics.fillCircle(12, 20, 1);
+  }
+
+  private drawIronSpearIcon(graphics: Phaser.GameObjects.Graphics) {
+    graphics.lineStyle(4, 0x6c4b32, 1);
+    graphics.beginPath();
+    graphics.moveTo(7, 24);
+    graphics.lineTo(20, 5);
+    graphics.strokePath();
+    graphics.lineStyle(1, 0xc49458, 0.85);
+    graphics.beginPath();
+    graphics.moveTo(9, 22);
+    graphics.lineTo(19, 7);
+    graphics.strokePath();
+    graphics.fillStyle(0xd8dfe6, 1);
+    graphics.fillTriangle(20, 3, 25, 5, 21, 9);
+    graphics.fillTriangle(18, 6, 21, 9, 17, 13);
+    graphics.lineStyle(1, 0xffffff, 0.75);
+    graphics.beginPath();
+    graphics.moveTo(20, 4);
+    graphics.lineTo(22, 7);
+    graphics.strokePath();
+    graphics.fillStyle(0x6cc5ff, 1);
+    graphics.fillRect(15, 12, 5, 2);
+    graphics.fillRect(13, 15, 5, 2);
+    graphics.fillStyle(0x50606a, 1);
+    graphics.fillCircle(7, 24, 2);
+    graphics.fillCircle(20, 10, 1);
+    graphics.lineStyle(1, 0x1d2b34, 0.75);
+    graphics.beginPath();
+    graphics.moveTo(16, 13);
+    graphics.lineTo(20, 10);
    graphics.strokePath();
  }

-  private drawSpearIcon(graphics: Phaser.GameObjects.Graphics, bladeColor: number, accentColor: number) {
-    graphics.lineStyle(3, 0x8d5a3a, 1);
+  private drawSkyPiercerHalberdIcon(graphics: Phaser.GameObjects.Graphics) {
+    graphics.lineStyle(4, 0x5c3c28, 1);
    graphics.beginPath();
-    graphics.moveTo(7, 24);
-    graphics.lineTo(20, 4);
+    graphics.moveTo(7, 25);
+    graphics.lineTo(17, 5);
+    graphics.strokePath();
+    graphics.lineStyle(1, 0xbb8550, 0.85);
+    graphics.beginPath();
+    graphics.moveTo(9, 23);
+    graphics.lineTo(17, 7);
+    graphics.strokePath();
+    graphics.fillStyle(0xd8dfe6, 1);
+    graphics.fillTriangle(17, 3, 23, 5, 18, 10);
+    graphics.fillEllipse(21, 10, 12, 10);
+    graphics.fillTriangle(18, 9, 27, 10, 20, 17);
+    graphics.fillTriangle(16, 10, 10, 12, 16, 16);
+    graphics.fillStyle(0x101820, 0.44);
+    graphics.fillTriangle(22, 6, 26, 10, 21, 13);
+    graphics.lineStyle(2, 0xffffff, 0.7);
+    graphics.beginPath();
+    graphics.moveTo(18, 5);
+    graphics.lineTo(21, 10);
+    graphics.lineTo(18, 15);
+    graphics.strokePath();
+    graphics.fillStyle(0xd95f4f, 1);
+    graphics.fillTriangle(14, 13, 19, 13, 15, 20);
+    graphics.fillTriangle(12, 15, 16, 17, 12, 22);
+    graphics.fillStyle(0xd8b15f, 1);
+    graphics.fillCircle(16, 14, 2);
+  }
+
+  private drawWesternCavalrySpearIcon(graphics: Phaser.GameObjects.Graphics) {
+    graphics.lineStyle(4, 0x72512f, 1);
+    graphics.beginPath();
+    graphics.moveTo(4, 24);
+    graphics.lineTo(22, 4);
+    graphics.strokePath();
+    graphics.lineStyle(1, 0xd0a061, 0.9);
+    graphics.beginPath();
+    graphics.moveTo(7, 22);
+    graphics.lineTo(21, 6);
+    graphics.strokePath();
+    graphics.fillStyle(0xe6d3a6, 1);
+    graphics.fillTriangle(21, 3, 27, 4, 23, 9);
+    graphics.fillTriangle(20, 6, 23, 9, 18, 12);
+    graphics.lineStyle(1, 0xffffff, 0.6);
+    graphics.beginPath();
+    graphics.moveTo(22, 4);
+    graphics.lineTo(23, 8);
+    graphics.strokePath();
+    graphics.fillStyle(0x2f5f8f, 1);
+    graphics.fillTriangle(13, 10, 20, 11, 15, 17);
+    graphics.fillStyle(0xd8b15f, 1);
+    graphics.fillTriangle(14, 12, 19, 13, 15, 16);
+    graphics.fillCircle(13, 13, 1);
+    graphics.lineStyle(2, 0xb86b55, 1);
+    graphics.beginPath();
+    graphics.moveTo(9, 19);
+    graphics.lineTo(12, 17);
+    graphics.moveTo(12, 16);
+    graphics.lineTo(15, 14);
    graphics.strokePath();
-    graphics.fillStyle(bladeColor, 1);
-    graphics.fillTriangle(18, 4, 24, 2, 22, 9);
-    graphics.fillStyle(accentColor, 1);
-    graphics.fillTriangle(15, 11, 20, 9, 17, 15);
  }

  private drawSaberIcon(graphics: Phaser.GameObjects.Graphics, bladeColor: number, gripColor: number) {