This is a submission for the June Solstice Game Jam
Before we dive into technicalities, let me make one thing straight β I love rituals and small celebrations! π I'm usually the first one buying a Christmas tree (preferably in the first week of December), decorating my house for seasonal events, and taking care of small daily rituals like journaling, burning a candle, home SPA, or a short mindfulness practice over a morning cup of coffee.
Some time ago, I got a creative kit from a friend (thanks a lot @mentelka π). Inside, among others, there was a spring bingo. I was super excited to cross out spring activities, like blowing on a dandelion, enjoying a spring storm, or looking for a four-leaf clover π
Such small celebrations bring lots of joy, improve your mood, and reduce stress by encouraging you to enjoy nature, do something creative, or take care of yourself. That's why I'm inviting you to play Solstice Bingo and to celebrate the magic of June rituals!
What I Built
In Solstice Bingo I gathered June traditions from around the world and wrapped them into a browser-based bingo game. Complete activities, mark them done, and watch the sky shift from deep night to solstice noon.
But the game isn't only about ticking boxes. Every card tells the story of a June ritual and how people celebrate it around the world. Some also include links to articles or YouTube videos if you want to go deeper. It's a chance to discover customs you've never heard of and take part in some of them yourself, like reading literature by a Black author, going for a picnic, or simply staying hydrated π
Video Demo
Here's a quick demo:
Code
The code lies in the solstice-bingo GitHub repository.
How I Built It
The whole game lives in a single HTML file β and that was a deliberate choice! No frameworks, no bundlers, no node_modules folder that weighs more than the project itself. Just plain HTML, CSS, and a bit of JavaScript. For something this small, it just makes sense to keep it all in one place.
My favourite part? The sky animation π As you complete rituals, the background shifts from deep night blues to warm solstice noon. I used CSS custom properties and a small colour-interpolation function to make the transitions smooth. The sun literally rises as you play! βοΈ
Progress is saved in localStorage, so you can close the tab and pick up where you left off. Each card is randomly drawn from a pool of 33 rituals, so reshuffling gives you a fresh experience every time.
I built this with AI β Gemini and Claude were my coding partners, since I'm still learning CSS and JavaScript. I described what I wanted, reviewed the output, pushed back when something felt off, and iterated. Honestly, it felt a lot like pair programming!
Prize Category
Hell yeah, let me submit to all categories! Because why not? π I did this small project mostly for fun and for pleasantly learning new things. However, I did try to include everything necessary to apply for both categories:
Best Ode to Alan Turing β there is one card in the bingo that is devoted to Alan Turing. Can you find it and checkmark the activity? π
Best Google AI Usage - well, I did use Gemini for prompt engineering, as I myself cannot code (yet!). So I used Gemini as my collaborator and reviewer with whom I consulted my ideas and guided on how I wanted the project to look. I also generated the article banner using Gemini. It does count, right? RIIIGHT? π
Conclusions
The whole challenge and designing this game was super fun! I played with HTML, CSS, and JavaScript, vibe-coded another app (you can read about the first one in Gemma 4 challenge inspired me to build my first app!), checked out Netlify for the first time, and learned about June celebrations I'd never heard of before. It also gave me the push to finally start the Responsive Web Design course!
Have I started to play the Solstice Bingo myself? Of course! You know I love such stuff π I encourage you to give it a try as well! If you want to share your activities and inspire others, feel free to post your activity photos on social media with the #solsticebingo hashtag. Let the magic of rituals shine! βοΈ
Top comments (8)
Good work! This looks really cool Klaudia!
I've already said it, but never enough appraisal in this crazy competitive world: I love it, it's cute and mindful, and you're so great at incorporating new skills in a friendly manner. I really admire that :)
Awww, thanks Marti! π₯Ή Still trying to find my way with AI, though.
You're nailing it, gurl!
Klaudia, this is such a fun idea. I like how it encourages people to enjoy small things they might otherwise overlook.
Also, I have to admit, now I'm curious to see if I can find the Alan Turing card π
Thank you! Let me know if you could find it! π
This is the kind of wholesome web project I enjoy discovering. Nicely done! πΌ
Thank you! π