UI Design

This section showcases a collection of UI mockups and interface elements I’ve created, primarily for NEX:OS and various gameplay systems. These assets were designed in Photoshop, then imported into Unreal Engine or Unity for use in building interactive widgets and HUD components.

While I’m not a trained UI designer by trade, interface design has become a vital part of my development workflow. I’ve learned through hands-on implementation—iterating layout structures, building responsive feedback systems, and aligning visual styling with gameplay intent.

These designs reflect practical problem-solving and creative adaptation within the engine environments I work with.

NEX:OS Character & Ability Menus

This section highlights a set of test and final menu mockups designed for NEX:OS, focusing on both character loadout and ability customization.

These interfaces aim to deliver the maximum amount of information in a single view, while maintaining a clean, readable layout that supports quick decision-making.

Character Menu

Players can view and modify:

Weapons and armor currently equipped
Abilities tied to their loadout
Assigned elemental affinities for their skills

This screen acts as a central hub for visualizing a character’s tactical setup—crucial for managing synergy, strategy, and battlefield role.

Ability Menu

The ability screen lets players manage their full skill inventory, including equipped and unlocked powers. It’s divided into three major categories:

Singularity & Runes – Passive effects and affinity modifiers
Abilities – Active powers usable in combat
Class Skills – Core moves unique to each character class

These menus are built with clarity and player control in mind, offering granular customization without overwhelming the user. Mockups were initially created in Photoshop, then translated into interactive widgets inside Unreal Engine or Unity

UI Design Evolution – NEX:OS Menus

Designing intuitive, information-rich menus takes iteration—and this timeline showcases the evolution of the Character and Ability interface for NEX:OS. From early concepts exploring layout structure and color theory to near-final mockups focused on readability and engine integration, each draft reflects lessons learned and refined UX thinking.

This journey highlights a shift from visual experimentation to modular, user-first UI systems ready for real-world gameplay..

A first draft of an ability screen using a page concept where a player’s abilities and skills were separated. This version focused on their ultimate—Singularity—and core combat skills.

A first draft of the second ability page, focused on the player’s class skills and build. These universal traits impact stats, passive bonuses, and non-combat gameplay systems. This layout explored separating active abilities from foundational role-specific attributes.

This version explored a single, unified skill tree that combined Character, Singularity, and Ability skills into one interface. While it offered a clean overview of player progression, it ultimately lacked clarity for separating passive traits from active combat abilities. After testing, the concept was retired in favor of a split-screen design that better reflected gameplay roles and system logic.

This polished draft presents a streamlined layout for managing a character’s full loadout and profile. Stats, equipped armor, weapons, and abilities are cleanly organized in a single view, supporting quick-select functionality across all slots. The goal here is fast loadout swapping without sacrificing clarity—giving players tactical control while maintaining immersion. Though some UI refinements are still underway, this version reflects the most balanced and accessible implementation to date

This refined layout introduces a clean tri-panel structure split into Singularity, Skills, and Abilities—giving players granular control over their character's combat identity. Each section supports drag-and-drop assignment or quick toggling, allowing for real-time gameplay adjustments without menu fatigue. The goal here is strategic flexibility: players can swap high-impact powers, tune passive bonuses, and experiment with elemental affinities while keeping everything one click away

Gameplay Icons – Visual Language of NEX:OS

This collection features gameplay and UI icons I designed for NEX:OS, used throughout the HUD, menus, and interface components to reinforce consistency, clarity, and style across all systems.

These icons were created primarily in Photoshop, tailored for implementation in Unreal Engine or Unity widget frameworks. Each symbol reflects a mechanical or narrative purpose—from representing class identity to signposting player actions.