The Machines Arena

One of my first tasks on The Machines Arena was to overhaul the HUD, replacing placeholder developer art with a cohesive, adaptable style that matched the pace and polish of the game. The goal was to create a system that felt visually consistent while still being flexible enough to handle the needs of different game modes.

Because TMA features multiple modes - Detonation, Pushback, and Skirmish - the HUD was designed as a modular toolkit. Components could be swapped in or out depending on context, covering everything from health bars, buffs and debuffs, and weapon indicators to ability charges, the kill feed, team and enemy status, and a communication radial menu. This approach ensured that players always had the right information at hand without overwhelming the screen.

The pre-match screen was designed to let players quickly choose from nine playable characters spread across three classes: Support, Assault, and Tank. In ranked mode, characters also carried progression elements such as levels and perks, which were surfaced directly within the character tiles at the bottom of the screen. This gave players a clear sense of strategic options while keeping the selection process streamlined.

Visually, the screen made use of 3D animated characters layered into a live snapshot of the game world. By placing the UI above this background, we allowed for dynamic character motion as players swapped between choices, making the selection process feel more alive and immersive while still keeping the interface functional and readable.

The career profile screen provides players with a clear snapshot of their overall progress. It highlights key stats and performance across the different game modes, giving a quick sense of ranking, achievements, and playstyle trends.

The interface is set against a full-width portrait of the player’s most-used character, grounding the data in a personal connection and making the screen feel more character-driven.

The in-game store gives players a variety of ways to customise and accelerate their experience. Alongside individual items for tailoring character builds, the store also features bundle packs, hero packs for faster progression, and mintable skins that extend into Web3 ownership (Ronin Blockchain).

Because The Machines Arena uses multiple currencies - Urellium, Tokens, and Medals - the store was designed to clearly communicate costs, rarity, and availability at a glance. This ensured that purchases felt straightforward while supporting the game’s layered economy.

The inventory screen serves as the central hub for managing all in-game assets, whether earned through play or purchased. Selecting an item reveals its details, including its function, usage, and in some cases the option to mint it via the TMA website.

The item tiles were designed as modular components, adapting to different asset types while maintaining consistency. Each tile communicates key information at a glance: rarity, quantity, associated ability, and minting status. This approach ensured clarity while supporting the depth of the game’s progression systems.