Files
2nd/10_Wiki/Topics/2026-04-24-Skybound_Particle_and_Supply_Readability_Fix.md
T

2.1 KiB

Skybound Particle and Supply Readability Fix

Date: 2026-04-24
Project: Skybound Protocol
Author: Codex
Status: Raw follow-up fix from gameplay screenshot review

1. Screenshot Issues

The reviewed screenshot exposed two readability problems.

Observed issues:

  • Mint/cyan square particles were scattered across the floor and looked like items even though they could not be collected.
  • The supply crate asset looked good, but it was not clear whether it was a player pickup or an enemy projectile/debris object.

2. Cause

Mint Floor Squares

The mint squares were runtime particles from EffectSystem.

They were rendered in GameRenderer.renderEffects() using fillRect(), so every spark appeared as a small collectible-looking square.

These particles can come from combat hits, skill effects, EMP interactions, exp pickup feedback, or other short-lived feedback systems.

Supply Ambiguity

The supply crate sprite itself was readable as an object, but the gameplay affordance was weak.

It needed explicit pickup language:

  • pickup color
  • capture ring
  • directional marker
  • short label

3. Fixes Applied

Particle Shape

Runtime particles now render as small rotated diamond sparks instead of square floor blocks.

This keeps the magical spark feedback while reducing item confusion.

Normal shard fragments were also changed from square blocks to triangular fragments.

Supply Pickup Readability

Supply drops now render with:

  • mint-green dashed pickup ring
  • soft pickup fill
  • bobbing downward arrow
  • retained supply crate sprite
  • PICK UP label

This separates supply drops from enemy bullets, hazards, and cosmetic particles.

4. Changed Runtime Paths

Important changed path:

  • /Volumes/Data/project/Antigravity/Skybound/src/features/game/systems/GameRenderer.ts

5. Verification

Production build completed successfully with:

npm run build

The existing /sprites/player.png static path warning remains non-blocking.

🔗 Knowledge Connections