This is a submission for the June Solstice Game Jam

(🇧🇷 Para a versão em Português, role até o final do post / Scroll down for Portuguese!)

What I Built

While the Northern Hemisphere celebrates the summer solstice, here in Brazil, this astronomical event marks the arrival of winter. We celebrate it with a massive, traditional, and culturally rich event called Festa Junina (June Festival)!

To honor this theme, I built Arraial do Solstício (Solstice Festival), a digital interactive courtyard entirely from scratch using Vanilla JavaScript, HTML5 Canvas, and CSS. No heavy game engines, just pure code!

The project features a living Hub and 3 distinct minigames (endless runner, physics balancing, and a frantic clicker), fully equipped with a real-time global language switcher (i18n) and a local localStorage Medal Board!

Video Demo

Code

How I Built It

🗺️ The Hub: A Living Courtyard

When you enter the app, you are greeted by a central bonfire, clickable stalls, and characters walking around randomly. To bring the scene to life without overloading the DOM, I used inline SVG to draw the characters and manipulated their positions with pure JavaScript.

🔥 Minigame 1: Fire Jumper

Chrome's classic dinosaur game got a festive version! Here, you control a character who needs to jump over bonfires, collect pamonhas (corn treats for points), and candy apples (for invincibility). This was rendered frame-by-frame using the <canvas> API with a parallax effect for the background.

🍷 Minigame 2: Drink Balancer (Quentão)

The challenge here is to keep a cup of Quentão (a traditional hot mulled wine) upright using just your mouse! Instead of a complex physics engine, I used basic math to calculate the cup's rotation and inertia based on the mouse position. If you tilt it too much, the cup "spills" with a fluid animation using ctx.rotate().

🌽 Minigame 3: Corn Grater (Pamonha)

A "click/swipe as fast as you can" game, where the player has to "grate" corn by dragging the mouse frantically. Each grated corn adds to your score, and the difficulty increases until the grater structure (literally) explodes.

🌍 Internationalization (i18n) & 🏆 Local Ranking

Since the jam is global, I implemented a custom i18n module! The game automatically detects your browser language and serves the UI in English or Portuguese, switching instantly without page reloads.

To spice things up, I integrated a global "Medal Board" using the browser's localStorage API, keeping the Top 3 high scores for each minigame. Creating games in Canvas and Vanilla JS gives you incredible control over pixels and performance, plus it's an excellent logic exercise!

🇧🇷 Versão em Português

Esta é uma submissão para a June Solstice Game Jam

O que eu construí

Enquanto o Hemisfério Norte celebra o solstício de verão, aqui no Brasil esse evento marca a chegada do inverno e a nossa tradicionalíssima Festa Junina!

Para honrar o tema, construí o Arraial do Solstício, um pátio digital interativo feito do zero com Vanilla JavaScript, HTML5 Canvas e CSS. Sem engines pesadas, apenas código puro!

O projeto conta com um Hub vivo e 3 minigames distintos, totalmente equipado com troca de idioma em tempo real (i18n) e um Quadro de Medalhas usando localStorage.

Vídeo de Demonstração

Código Fonte

Como eu construí

🗺️ O Hub: Um Pátio Vivo

Quando você entra no app, é recebido por uma fogueira central, barraquinhas clicáveis e personagens passeando aleatoriamente. Usei SVG inline para desenhar os caipiras e manipulei as posições via JS.

🔥 Minigame 1: Pula Fogueira

O clássico jogo do dinossauro ganhou versão junina! Renderizado frame a frame via <canvas>, com direito a efeito parallax. Você coleta pamonhas (pontos) e maçãs do amor (invencibilidade).

🍷 Minigame 2: Equilibrando o Quentão

O desafio é manter um copo de quentão em pé usando o mouse! Em vez de usar uma engine de física complexa, usei matemática básica para calcular a rotação e inércia do copo.

🌽 Minigame 3: Ralando a Pamonha

Um jogo estilo "clique o mais rápido que puder", arrastando o mouse freneticamente até o ralador (literalmente) explodir.

🌍 Internacionalização (i18n) e 🏆 Ranking Local

Criei um sistema i18n do zero para jogadores do mundo todo jogarem em Inglês ou Português. Também integrei um "Quadro de Medalhas" usando a API de localStorage para salvar seus recordes!

Criar jogos em Canvas e Vanilla JS te dá um controle absurdo sobre os pixels e a performance, além de ser um excelente exercício de lógica. Qual sua barraquinha favorita na Festa Junina? Conta aí nos comentários! 👇