NEURASTHENIA
ROLE:
UI Designer
PROJECT TYPE:
VR Game
PROJECT ENGINE:
Unreal Engine 5
Neurasthenia was a VR Shooter Project made for our VR & Mobile Game Development module. I was the UI Designer, and designed most interfaces in the game.
As this was the first VR Project I've worked on, I struggled quite a bit in making functional interfaces that would normally be easier to produce otherwise, coupled with Unreal's lack of support for UI within a 3D space. However, through iteration and a lot of trial and error, I was able to create a game with a functional Main Menu and Pause Menu, as well as functioning dialogue boxes and vignettes.
GAMEPLAY VIDEO
PRE-PRODUCTION
To begin this project, I did a UI Design Notebook. Having conferred with the team, we decided to combine our VR Game with a Gameboy reminiscent shader, while making sure to regularly adjust it so the player wouldn't feel at all nauseous or disoriented at this shader. To compliment this, I decided pretty early that all of the UI I would be creating would be of a Gameboy style.
To help dictate me in what I was making, I first did "Secondary Research" for what elements I planned to impliment in the game, which was finding images for what I wanted a UI element to resemble, as well as seek examples from games that had done it before. Then, through sketches and rough drafts, I would show "Primary Research" to give a clear example of what I actually wanted the room to look like.
MAIN MENU
In creating the Main Menu, I decided I wanted it to be a Dynamic 3D Space. I felt this would help immerse the player in the world from the very beginning of the game, and it would be far more engaging to interact with than a simple 2D plane.
I then tied each menu's option to a fitting object, such as the TV taking the player to an options menu reminiscent of a TV's options screen, and the Scores menu giving the player a view of a page with the scores of the game on it. Additionally, I tried to make the menu feel alive through animations done through level sequences, such as the glass breaking when the player tries to leave the room, and a visible zombie behind the glass that turns to you when you break the glass.
PAUSE MENU
Due to Unreal not having a traditional way to simply add a 2D UI into the player's viewport in VR, I instead mounted a widget to their hand, acting as a hover pop-up that comes up when they are trying to access their watch. However, I created our watch to have multiple options, and since the widget itself isn't linked to the viewport, casting a new one is extremely hard. I had to manually create a Boolean that casted to the Pause Menu class to tell it what Widget it had to display for every single possible option in the menu. This was a pain, but I can say thankfully it works.
Making the Pause Menu, I decided to make it diegetic in the world, in which it comes from the player's watch to compliment the game's narrative of the spy infiltrating the hospital. The player is able to access four things, the General Menu, the Scoreboard, the Options Menu, and the Exit Menu. However, the programmers gave up the concept of the scoreboard very late in development, so I was not able to create a new menu without it. Thus, it still exists without binding.
TEXTBOX/SHOP
With this being a VR game, the team decided that we wanted to have the game set in a fully immersive world. Because of this, we wanted for the player's holographic watch textbox to show from their watch to convey to them information, such as how much they needed to pay to access a door, or even a simple message, such as "The power needs turned on."
Additionally, I wanted to use this to help have the shop system work. This was where when the player walks into a trigger box, they are able to see a dialogue box that asks them if they want to buy that item, and directing them to press a certain button to see it work. This allows me to be able to have the UI be a consistent diegetic presence in the world.
VIGNETTE
Due to us wanting our User Interface to be diegetic, the player's health was an issue at first. I decided that a Vignette that's strength is linked to the player's health would be the best way forward. However, this originally presented itself as an issue in VR. This is because, traditionally, a vignette could simply be done through a widget. However, since VR has no widget support to the player's actual viewport, I instead decided to do this through a post-processing shader.
This post-processing shader would be applied in the level and strength tied to the variable of the player's health. You can see below how it looks in gameplay. To maintain the player's vision and not create a nauseating VR experience, I made it transparent to some degree. To note, it looks like it takes up quite a lot of the screen here, but this does not reflect the VR experience, as in VR it takes much less of the screen.
WITHIN US
WITHIN US was the beta version of Neurasthenia that we originally made during a Game Jam over the summer. This was in a similar vein to Neurasthenia, but was instead a regular first person horror over a VR experience. While it was not finished, I still made a lot of Gameboy inspired UI referencing palettes and the menu screens of actual Gameboy game.
