Skip to content

[Feature] Procedural sky effects to improve theme atmosphere #49

@jashkarangiya

Description

@jashkarangiya

What problem does this solve?

The current theme skies (Midnight, Sunset, Neon, Emerald) look good color-wise but feel static/empty, which reduces immersion.

Proposed solution

Add lightweight, procedural sky effects per theme, generated at runtime (no external assets).

  • Midnight: twinkling starfield, animated aurora bands, moon, occasional shooting stars
  • Sunset: volumetric sun disc + halo, seamless 360-degree cirrus cloud dome
  • Neon/Emerald: theme-matched procedural sky treatments

Implementation approach:

  • New component: ThemeSkyFX.tsx to keep CityCanvas.tsx clean
  • All textures generated via CanvasTexture at runtime
  • Dispose THREE.Texture / THREE.Material in useEffect cleanup to avoid leaks

Alternatives considered

  • Static sky textures (adds assets and bundle size)
  • Minor animation on existing sprites (limited improvement)

Additional context

I’ve opened a PR implementing this feature. Please take a look when you have a moment.

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions