alfheim online: ui redesign
Alfheim Online is a fully immersive VR MMO from the anime Sword Art Online. Despite being a fully immersive VR world, Alfheim Online suffers from surprisingly poor interface design. Key systems lack clarity, navigation is unintuitive, and essential information is poorly communicated.
This project reimagines the iconic interface of ALfheim Online, focusing on clarity, intuitive interaction and maintaining immersion within a fully virtual environment.
what needs fixing?
The interface of Alfheim Online presents several usability issues. Spellcasting relies on memorising and reciting long incantations, menus are heavily layered and key information is not always accessible during fast-paced aerial combat. These limitations increase cognitive load and slow player reactions, particularly for support roles that require rapid decision-making.
- High cognitive load for spellcasting
- Menu-heavy interactions
- Limited support for aerial combat awareness
what i want to improve
Reduce cognitive load, improve combat reaction speed, suppor thealer gameplay, maintain immersion in VR
key design solutions
Gesture based spellcasting using a radial rune menu
Quick cast abilities for high-priority healing spells
Minimalist flight HUD with core navigation indicators (original HUD was way too minimal - had nohing on it)
Swipe-down quick access menu for system navigation, designed around a radial menu
interaction flow
The redesigned interface prioritises fast interaction by minimising menu navigation. Players can access abilities/spells through a radial rune interface and gesture inputs, allowing rapid spellcasting during combat.
design impact: the outcome
The redesigned interface reduced interaction friction by replacing menu-heavy systems with gesture-based inputs and radial menus. This allows players to access critical abilities faster while maintaining the immersive fantasy aesthetic fo ALO.
role-based design: the undine style guide
To guide the redesign, I developed a healer/support player persona, representing a role that requires high situational awareness and access to large amounts of information.
The interface was designed around the ehaler role, which requires ocnstant montiroign of aprty health and rapid abilitiy usag.e Designing for this role helped prioritise informatio hieracrhy and quikc-access spellcasting systes.
the swipe down menu
Rather than replacing the iconic swipe-down interface from Sword Art Online, this redesign preserves the recognisable interaction while restructuring the information architecture.
The original vertical command list has been replaced with a grid-based layout that groups related functions into clear categories, reducing cognitive load.
HUD concepts while out of combat/idle: concave vs convex styling.
Although the original interface in Alfheim Online rarely displays numerical flight data, additional orientation and velocity indicators were introduced to improve spatial awareness during high-speed aerial combat
HUD concepts of idle (left) and in-flight (right) using the convex styling.
HUD concepts of idle (left) and in-flight (right) using the convex styling.