Pixel city expansion — new districts and visual upgrades as agents level up

[leocagli]

Problem

The pixel city has 5 fixed districts and a static layout. As the ecosystem grows, new districts should unlock based on community activity, and high-level agents should visually upgrade their district.

District unlocks

Condition	New District	Color
50 total agents	Financial District	#f59e0b
100 total tasks	Archive Vault	#8b5cf6
First mainnet x402 payment	Commerce Hub	#10b981
5 legendary badges in ecosystem	Nexus Core	#ec4899

Per-district visual upgrades

As total district XP grows, the district background upgrades:

• Tier 1 (0-10k XP): base city tiles
• Tier 2 (10k-50k XP): more buildings, street lights
• Tier 3 (50k-200k XP): neon signs, animated windows
• Tier 4 (200k+ XP): skyline visible, particle effects

Agent sprite upgrades

• Level 1-9: basic robot sprite (current 7 variants)
• Level 10-24: adds glow outline in agent color
• Level 25-39: adds animated halo
• Level 40+: legendary frame with particle trail

Implementation

• District tier stored in DB, queried on canvas load
• New sprite variants (overlay layers) for level milestones
• District tile graphics are composited: base + upgrade layers
• Unlock events fire confetti on canvas

Files to modify

• components/pixel-city.tsx — tier-aware district rendering
• lib/renderer.ts — overlay layer system for drawDistrict
• lib/data.ts — new district definitions
• public/sprites/ — new sprite overlay assets

🎁 Evidencia visual = reward extra

• Si tu PR incluye video demo o capturas de pantalla mostrando la funcionalidad pedida funcionando end-to-end, va a ser considerado para rewards de GrantFox en esta issue. No es obligatorio, pero suma mucho para la evaluación.

[gloskull]

Hi, I’d love to work on this issue. I have 4 years of experience across backend, frontend, full-stack, and smart contract development. I understand the task clearly and can deliver a clean, efficient, well-tested solution on time, with strong focus on code quality and maintainability. My PR will be submitted in under 10 hours.

[MztaKing]

Dear Team, I would appreciate the opportunity to work on this issue.
Kind Regards

[sherifatolanike]

I would like to work on this issue. I have reviewed the requirements for implementing the pixel city district expansions, dynamic visual upgrades, and level-based agent sprite overlays, and I am ready to build the solution.
Proposed Approach:

• District Unlocks & Definitions (lib/data.ts): Expand district definitions to support unlock conditions for Financial District, Archive Vault, Commerce Hub, and Nexus Core, including their respective brand color tokens.
• Tiered Rendering Engine (lib/renderer.ts & components/pixel-city.tsx): Implement composited rendering in drawDistrict that overlays progressive visual tiers (building density, streetlights, neon animation, and skyline particle effects) driven by aggregate district XP stored in the database.
• Agent Sprite Upgrades: Add visual overlay rendering for agent sprite milestones (glow outlines for Lvl 10–24, animated halos for Lvl 25–39, and particle trails for Lvl 40+).
• Unlock Celebrations: Integrate canvas confetti event triggers when new districts are unlocked in real-time.
  Please assign this issue to me so I can begin drafting the implementation.

[obedojukwu50-stack]

I will like to work on this issue, I know exactly what to do and will deliver efficiently.

[OmniZlatoon]

Good day sir, Ready to deliver the task A.S.A.P. Gone through the issue and to be honest, i can work the task with the right tools at hand. please assign me maintainer . My eta is 5 hours

[github-actions]

✅ Accepted — @OmniZlatoon, this issue is yours. Please open a PR that references #45. Comment /unassign to release it.