DEV Community

Cover image for Solstice Panic! — Protect the Sun on the Longest Day of the Year
Aashita
Aashita Subscriber

Posted on

Solstice Panic! — Protect the Sun on the Longest Day of the Year

June Solstice Game Jam Submission

This is a submission for the June Solstice Game Jam


What I Built

On June 21 — the summer solstice — the sun is at its most powerful. The longest day. The peak of light. And in Solstice Panic!, shadows are trying to steal it.

Solstice Panic! is a fast-paced arcade game where you defend a golden Sun core against waves of encroaching shadow blobs on the longest day of the year. Tap them, smash them, swipe through them — don't let a single one reach the center or the sun starts to dim. The day is long. The shadows keep coming. Keep the light alive.

But here's what makes it more than a clicker:

Every power-up in the game is a real June celebration. The Summer Solstice. Pride Month. Juneteenth. The FIFA World Cup 2026. International Sushi Day. World Bicycle Day. International Yoga Day. World Music Day. Each one drops into the arena as a collectible, triggers a visual spectacle, and shows an educational banner about the real event that inspired it.

The metaphor is intentional and direct: the sun is light, joy, and freedom. The shadows are everything that tries to extinguish them. On the solstice — the day light wins — you make sure it stays that way. Every June celebration you've ever heard of shows up as a weapon in your hands.

Play it here: https://solstice-panic-750247458250.asia-southeast1.run.app/


Video Demo


Code

GitHub logo aashitanegii / SolsticePanicGame-

☀️ A fast-paced June Solstice arcade game where players defend the Sun using celebration-themed power-ups inspired by real June events.

☀️ Solstice Panic!

Defend the solstice sun light against falling shadows on the longest day of the year!

A fast-paced arcade survival game inspired by the June Solstice and June celebrations.


🎮 About The Game

Solstice Panic! is a fast-paced arcade survival game inspired by the June Solstice and a month full of global celebrations. In this game, players are tasked with defending a glowing Sun from relentless waves of incoming shadows. As you play, you can collect themed power-ups inspired by real-world events that happen in June, providing dynamic and engaging gameplay that also serves to celebrate these occasions!

✨ Features

  • Three Difficulty Modes: Tailor the challenge with Easy, Medium, and Hard modes.
  • Eight Unique June-Themed Power-Ups: Collect special abilities inspired by real-world June events.
  • Educational Event Banners: Learn about historical and global events as you play.
  • Combo & Multiplier System: Chain successful defenses for…

How I Built It

Stack

Tool Role
React 18 + Vite State-driven menus, difficulty screens, view transitions
TypeScript Strict interfaces for every game entity — shadows, particles, projectiles, power-up state queues
HTML5 Canvas API All gameplay rendering: vector movement, glow gradients, rotation, collision math
Tailwind CSS Warm golden UI palette, HUD modules, responsive layout
Framer Motion Spring animations on cards, start screen, and slide-in educational banners
Web Audio API Real-time synthesized sound — zero audio files, everything generated from raw math
LocalStorage Persistent high score across sessions

No audio files. No sprite sheets. No external game engine. Everything is generated by code.


Eight Power-Up Physics Systems in One Canvas Loop

The real technical challenge was coordinating eight completely distinct active power-up states simultaneously inside a single high-performance canvas rendering loop — without dropping frames.

Each power-up has its own physics:

  • World Cup Shot — real bounce vectors off arena boundaries, velocity preserved on each wall collision
  • Sushi Cannon — heat-seeking projectiles that recalculate their target vector every frame toward the nearest shadow
  • Bike Day Zoom — cursor drag velocity converted into a sweeping collision radius in real time
  • Pride Wave — gradient arc swept across the full canvas width in a single render pass
  • Solstice Crown — radial freeze state with simultaneous petal particle system running independently

Getting all eight coexisting — multiple power-ups active at once without corrupting each other's render cycle — required a clean TypeScript state queue where each power-up owns its update and draw functions independently.


The Proudest Feature: The Web Audio Synthesizer

Every sound in the game — smash pops, power-up sparkles, damage thuds, the freeze sweep, combo escalation tones — is generated in real time using the Web Audio API. No audio files anywhere in the project.

The detail I'm happiest with: the combo pitch system. As your streak climbs, the base frequency of each smash sound rises. A 3x combo sounds different from an 8x combo. The game literally sounds faster and more intense as you get better at it, without a single pre-recorded file.


The Decoy System (Why It's Not Just a Clicker)

Purple decoy pulses mix into the shadow waves. Clicking them costs score and breaks your combo streak. This one mechanic is the difference between an arcade game and a spam-clicking toy — it forces players to actually look before they tap. On Hard mode (Endless Twilight), decoy frequency increases significantly. That's what makes Hard genuinely hard rather than just fast.


Three Difficulty Modes as a Design Requirement

A jam game that only works for one skill level loses half its potential audience.

  • Easy (Golden Morning) — 3 shield charges, slower shadows, frequent drops. Lets casual players experience all eight power-ups before they're overwhelmed.
  • Medium (Solstice Balance) — Standard everything. The intended experience.
  • Hard (Endless Twilight) — Fast shadows, rare drops, 1.5x score multiplier. A real reflex test.

Every Power-Up Is a Real June Event

Power-Up June Event Effect
🌞 Solstice Crown Summer Solstice — June 21 Freezes all shadows 5s, golden rays burst, petals drift
🌈 Pride Wave Pride Month — all June Rainbow arc clears every shadow on screen
✊ Juneteenth Burst Juneteenth — June 19 2x score multiplier 10s, confetti explosion
⚽ World Cup Shot FIFA World Cup 2026 Bouncing soccer ball ricochets, deflects shadows
🍣 Sushi Cannon International Sushi Day — June 18 Heat-seeking sushi auto-targets shadows for 8s
🧘 Yoga Pose International Yoga Day — June 21 3s full pause, sun meter fully restored
🎵 World Music Day Fête de la Musique — June 21 Musical notes radiate outward, destroy on contact
🚲 Bike Day Zoom World Bicycle Day — June 3 Cursor becomes a high-speed shadow-sweeping trail

June 21 — the jam deadline — is the most power-up-dense day in the calendar. The Solstice, Yoga Day, and World Music Day all fall on the same date. If you're playing Solstice Panic! on submission day, every event you're collecting as a power-up is happening in the real world at the same time.


Prize Category

Best Google AI Usage

Solstice Panic! was built using multiple Google AI tools throughout the entire development lifecycle—from ideation and UI generation to coding, debugging, and deployment.

Google AI Studio + Gemini 2.0 Flash

Google AI Studio served as my primary development environment and Gemini 2.0 Flash acted as a collaborative engineering partner throughout the project.

I used Gemini to:

  • Design the game architecture and entity systems
  • Structure TypeScript interfaces and state management
  • Implement collision detection and power-up mechanics
  • Debug gameplay logic and rendering issues
  • Optimize Canvas performance
  • Generate educational content for June celebration banners
  • Refine game balance across Easy, Medium, and Hard modes

Rather than generating code once, development was highly iterative. I would describe a gameplay mechanic, test the implementation, provide feedback, and refine the system through multiple cycles until it behaved exactly as intended.

Stitch

I used Stitch to rapidly prototype and generate portions of the game's interface and visual structure.

This accelerated the transition from concept to playable experience, allowing me to spend more time refining gameplay systems, accessibility, animations, and overall player experience.

Gemini CLI

Gemini CLI became part of my development workflow for code generation, debugging, refactoring, and feature implementation.

Complex systems such as:

  • Multi-state power-up management
  • Projectile targeting logic
  • Audio synthesis architecture
  • Difficulty scaling systems
  • Persistent score storage

were developed and refined through an iterative CLI-assisted workflow.

Cloud Run Deployment

The final game was deployed using Google Cloud Run, allowing the application to be packaged and delivered as a scalable web experience.

Using Cloud Run simplified deployment and provided a production-ready environment for sharing the game with judges and players.

Why Google AI Was Meaningful

The scope of Solstice Panic! is significantly larger than a typical jam project:

  • Eight unique power-up systems
  • Three difficulty modes
  • Dynamic combo mechanics
  • Educational event banners
  • Particle effects
  • Canvas-based physics systems
  • Real-time audio synthesis
  • Persistent high-score tracking

Google AI tools helped transform a large idea into a finished, polished experience within a limited jam timeline.

Most importantly, they accelerated experimentation.

Instead of spending hours searching documentation or rebuilding systems from scratch, I could focus on design decisions, gameplay feel, player experience, and creative direction.

Google AI didn't replace development—it amplified it.

Solstice Panic! is the result of combining creativity, engineering, and Google's AI ecosystem to build a complete game experience in just a few days.


Built for the June Solstice Game Jam 2026. The sun held; WON. The shadows didn't win.

Top comments (0)