Shadow Realm

Inspiration

The inspiration for Shadow Realm came from a love of classic turn-based combat games like Pokémon and the desire to create a unique battle experience featuring legendary animals. We wanted to blend strategic gameplay with visually engaging elements and a nostalgic pixel-art style.

What it does

Shadow Realm is a turn-based battle game where players choose legendary animal avatars from different environments—Jungle, Desert, and Arctic—and compete in strategic combat. Each animal possesses unique abilities, such as powerful attacks, defensive buffs, and status effects like poison or stun. Players can engage in battles, monitor health bars, and aim to outlast their opponents through strategic moves and combo-building mechanics.

How we built it

We built Shadow Realm using HTML, CSS, and JavaScript. The game leverages a structured state management system to track player and enemy stats, health, and status effects. The front end uses CSS animations to enhance the visual experience, including attack effects and health bar transitions. JavaScript handles the game logic, such as AI-driven decision-making, combat calculations, and status effects.

Challenges we ran into

Balancing gameplay mechanics to ensure fair and engaging battles. Implementing AI profiles (aggressive, tactical, adaptive) that respond to player actions dynamically. Creating responsive UI elements to provide a smooth gaming experience across different devices. Managing game state efficiently to avoid unintended behavior during complex combat interactions.

Accomplishments that we're proud of

Successfully implementing multiple environments with unique animal avatars and abilities. Developing an engaging combat system with visual feedback like attack animations and combo tracking. Creating an intuitive and retro-styled interface that captures the essence of classic turn-based games. Designing AI behavior that adapts to player strategies and makes battles more challenging.

What we learned

The importance of balancing strategy and randomness to keep gameplay exciting yet fair. Effective use of CSS animations to enhance user experience without overcomplicating the codebase. Structuring JavaScript code to manage game logic in a modular and maintainable way. User feedback is invaluable in refining gameplay mechanics and UI design.

What's next for Shadow Realm

Introducing more animal avatars with unique abilities and elemental strengths/weaknesses. Implementing multiplayer mode to allow players to compete against friends online. Adding a progression system where players can level up their animals and unlock new abilities. Expanding the story mode with quests and challenges tied to each environment. Optimizing the game for mobile devices to reach a broader audience.

Built With

• css
• html
• javascript
• tailwind