Inspiration The idea behind Mystic Spirits: Your Personal Fortune Teller came from my fascination with tarot cards, mysticism, and all things mystical. I wanted to bring that ancient sense of wonder into the modern world with AI, so people could have their own little slice of the supernatural. It’s all about fun, surprises, and connecting with something beyond just a screen. It was a mix of curiosity, a love for magic, and the chance to create something unique that made me bring this project to life.

What it does So, what’s this magic all about? Well, Mystic Spirits is your very own AI-powered fortune teller. You answer a few quirky questions, and in return, you get a personalized fortune, curse, magical item, or even a spirit animal. The fun part is that, depending on your answers, the experience could be calm and peaceful in a mystical utopia... or, if you’re really unlucky, things might go south and trigger panic mode—storms, glitches, eerie vibes, you name it! It’s all about keeping the suspense alive and giving you a fun, immersive experience.

How we built it I built the front end with React, making it easy to manage all the interactive parts. For the AI, I’ve created a random system that generates fortunes, curses, and other fun things based on the answers you give. The design was all about making it feel like you’re truly getting a personal reading—using CSS animations for smooth transitions, changing backgrounds, and keeping things visually dynamic. To add to the magic, I used Google Fonts to give it that tarot-card theme. Every click, every response changes something, making it feel like the whole thing is alive.

Challenges we ran into Creating a truly engaging experience wasn’t as easy as it sounds. One of the biggest challenges was making the fortunes feel meaningful, even though they’re completely random. I wanted to make it so people felt connected to their readings, like there was a little magic happening, not just a machine spitting out words. Another challenge was making everything look good on different screen sizes, while still keeping the creepy, mystical vibe intact. And let’s not forget about designing the transition between peaceful and chaotic—it took some trial and error, but we got there.

Accomplishments that we're proud of The best part? The way the website shifts between calm and chaos depending on the fortune you get. When it’s peaceful, it feels like you’re floating in a serene magical world, but when things go wrong? The panic mode kicks in, with storms and glitches that make it feel way more intense. It’s that balance between calm and chaos that makes the project so fun. And of course, the personalized fortunes, curses, and spirit animals—those little details are what make the experience special.

What we learned I learned a ton about combining AI and design to create a user experience that’s both fun and surprising. Random data generation in React was an eye-opener, and CSS animations became my best friend in bringing the whole mystical theme to life. Most importantly, I learned how to take something as fun as fortune-telling and make it feel personal and engaging, which was honestly the most rewarding part of this project.

What's next for Mystic Spirits: Your Personal Fortune Teller There’s still so much to do! We want to expand the fortune pool—more curses, more spirit animals, and even more magical items. I also want to make the AI smarter, so the fortunes can be even more personalized. We’re also thinking of making a mobile version so you can take your personal fortune teller on the go! And who knows? Maybe a feature to share your fortunes with friends or even a way to challenge them to get the best predictions. Stay tuned, there’s a lot more magic coming your way!

Built With

Share this project:

Updates