Small Skies

Inspiration

Small Skies reimagines the transport management genre (inspired by Mini Metro and Mini Motorways) by introducing a third dimension: altitude. We wanted to evolve the challenge from 2D surface routing to 3D spatial logic. The visual direction creates a "paper-cut" aesthetic to make complex volumetric puzzles feel tangible, approachable, and beautiful.

What it does

Small Skies is a spatial logic puzzle where players manage air traffic by drawing flight paths across a dynamic 3D map, backed by a persistent global competition system.

• 3D Routing: Manage paths across different flight levels distinguished by paper layers, balancing elevation costs against terrain obstacles like paper-cut mountains and moving storm systems.
• Traffic Management: Prevent terminal collapse by delivering passengers efficiently before airports overload.
• Strategic Depth: Players must optimize limited route capacity and fuel constraints within a deterministic "daily challenge" structure.
• Live Competition: A full backend tracks player history, calculates performance trends, and powers three tiers of leaderboards (Global, Weekly, and "Around Me").

How it's made

Frontend & Graphics

• Tech: React Three Fiber (R3F), Three.js with WebGPU renderer, and TSL (Three Shader Language).
• Papercut Terrain: A modular system generating layered marching-squares contours with settlement placement and dynamic drop shadows.
• Performance: Implemented object pooling (1,000 pre-allocated planes) and LOD route visualization to maintain a stable 60fps even with 100+ active agents.

Backend & Infrastructure

• Service Architecture: Built a modular TypeScript backend comprising distinct services for Game Sessions, Leaderboards, and Player Statistics.
• Data Layer: Leveraged Redis for high-speed data persistence, managing session expiration (24h), weekly leaderboard rotation, and user history retention.
• API: Developed 11 secure RESTful endpoints handling everything from game state validation (anti-cheat) to complex leaderboard queries (fetching rankings relative to the user's position).

Challenges

• Determinism vs. Randomness: Random rotations made debugging difficult. Created a hash-based calculations to ensure that specific map seeds always produce the exact same airport orientations and layouts, which is crucial for fair daily challenges.

Accomplishments

• Full-Stack Polish: Delivering a game that isn't just a client-side demo, but a connected application with persistent sessions, history tracking, and live leaderboards.
• Next-Gen Rendering: Successfully running a WebGPU-powered scene at a stable 60fps with heavy object pooling.
• Aesthetic Cohesion: Achieving a genuine distinct visual procedural system and context-sensitive UI that avoids screen clutter.

Learned about

• TSL vs. GLSL: WebGPU requires a paradigm shift in shader authoring. TSL is more verbose but allows for significant more options.
• Data Structure Efficiency: Organizing Redis keys for "Around Me" leaderboards required careful planning to ensure retrieval times for rankings.
• Spatial Math: Voronoi diagrams proved ideal for naturalistic territory delineation and airport spacing.

What's next for Small Skies

Community & Content

• Daily Seed System: Similar to Wordle, I utilised deterministic backend to serve one universal map seed per day to unify the Reddit player base.
• Discussion Integration: Players can share "Proof-of-Solve" screenshots and custom map seeds in comments, fostering discussion on routing strategies (e.g., "How did you handle the storm cluster?").

Roadmap

• Cleanup & Performance: While the full gameplay is not yet fully implemented and robust there are still lingering performance issues that need to be resolved.
• Gameplay Modifiers: Weekend events like "Heavy Winds" (reduced speed) or "Holiday Rush" (2x traffic).
• Mobile Polish: Optimization for touch controls and an immersive soundscape (wind ambience, tactile placement sounds).

Built With

• blender
• devvit
• r3f
• react