Battle of velune: Turn-based mobile strategy rpg

Battle of Velune runs on a hex grid with a dynamic two card movement system. Each player cycles through active and neutral cards, constantly shifting available moves.

At any moment, players must understand turn state, active card, legal tiles, and predicted outcomes before committing to an action. The challenge was making this readable in real time on a small screen.

I spent the first weeks studying turn based strategy systems, digital TTRPG, RPG mechanics, and progression loops to understand game design patterns.

Two months in, I hit a wall. I had consumed a lot but produced very little. I started questioning whether any of it would translate into actual work.

I shifted from research heavy work to rapid low fidelity prototyping. My component based Figma workflow helped translate systems thinking into scalable UI design.

The visual foundation is Pixel Frog's Tiny Swords asset pack. For gaps in the asset library I used Google Gemini to generate visuals that matched the existing visual language.

I built a fully modular component library with state based variants, enabling rapid composition of gameplay scenarios without rebuilding screens.

Typography was chosen to support readability and tone, using IM Fell English for headers and Patrick Hand for body text. The UI prioritizes clarity over visual density, reducing fatigue while keeping the battlefield visually dominant.

Sign in appears immediately after splash with Play as Guest as the primary entry point to reduce friction. Social login is optional and secondary.

The main menu follows established multiplayer conventions: Quick Play, Create Game, Join via Code, Play vs Bot. Familiar patterns mean players spend their energy on strategy, not on figuring out navigation. Secondary actions are accessible but visually subordinate.

The first board was a flat 2D pixel grid that looked right but failed on a small screen. Spatial depth was weak and tactical positioning read poorly, so I shifted to an isometric hex grid which fixed both immediately.

Each tile supports idle, highlighted, and selected states to clearly communicate legal moves before commitment.

The interface uses a split structure with gameplay anchored centrally and system information pushed to edges.

Every element was intentionally scoped. If it did not support a decision in the moment, it is removed.

I evaluated multiple onboarding approaches including split flow, continuous flow, and move based guidance, each with tradeoffs in control versus clarity.

I landed on a modular single flow tutorial combining static explanation with interactive learning. Players move forward and backward freely, while frame based highlighting guides attention without removing control. The goal was to guide the experience, then step back.

Pre game introduces players and establishes turn order through a short animated sequence that sets context before gameplay begins.

Post game dims the board behind a results modal with immediate rematch options to keep engagement within flow.

Battle of Velune is currently in active development. The next phase is playtesting to evaluate move clarity, tutorial comprehension, and error rates in legal move selection for design iterations.

I'm incredibly proud of what I built with Battle of Velune, especially as my first mobile game. It taught me to output more than input. I'm grateful to Nerdino Studios for trusting me with this, and for the patience it took while I found my footing in a new medium.

This is a living case study that will be updated as Battle of Velune progresses through playtesting and launch.