UI Art
Logo / Adobe XD
Start Button / Adobe XD & Photoshop
UI/UX Design
Main Menu
using Adobe Animate
The design I made for our main menu is based on two main ideas. First, I must introduce players to the vibe of the game. I planned to give information about the setting through a 3D area that acted as a slice of the main map. Second, I wanted to communicate a main mechanic. Entering a designated room is how you make each delivery in the game, so I incorporated that idea by animating the camera to fly into the end of the hallway. Through this practice, I found limitations in creating these animations. One of which is the fact that I had to use a lot of static art, leaving out a lot of specifics of what was executed in engine. In my future projects, I would combat this by adding annotated screenshots to further push the concept and allow for those extra details that I added in-engine.
Main Menu
using Unity Engine
This is the main menu in-engine! I had taken ownership of the design and setup of the scene, so I wanted to be able to incorporate the work from other team members in an impactful way. I worked with another member to come up with the concept of the sparking wires, adding depth to the scene while creating the desired work for our 3D modelers. Being able to set up this scene was such an awesome learning experience. I learned how angles can affect depth perception and how to utilize that concept to make spaces feel larger than they are. I also was able to learn about how much work goes into setting up a realistic scene and how to create that environment.
_gif.gif)
Pause Menu
using Unity Engine
One of our team members was working on a custom brochure texture that communicated our controls. I saw this as a good way to continue practice with 3D GUI elements, and, knowing how little functionality usually exists in game jam pause menus, I thought this was the perfect place to utilize the brochure! Once more progress had been made, I noticed that we had forgotten to communicate our controls at the beginning of the game. Utilizing the same fold-out animation, I added a small text sequence that prompted players to look over the important information. This showed the player the controls, allowed the player to have more power over the start time of the gameplay, and explained the premise, all while utilizing custom assets from my teammates.
_gif.gif)
HUD
using Unity Engine
I created this mini-map using a camera and a few 3D models over the player's head. The minimap's main function is to tell you where the correct delivery door is after harvesting the liver. Because there is no large push to utilize the mini-map before harvesting, I had guessed that it would be easy to miss the directional indicator appearing. To combat this, I added a text popup at the bottom. For a last-minute UX fix, I think this works, however, there is a lot happening on the screen making it understandable that players might miss the text prompt. In the future, I would draw attention toward the mini-map with a glowing effect, delay the speed at which the text shows up, and change the text positioning to the top of the screen to solidify the desired outcome.
_gif.gif)
HUD
using Unity Engine
When a liver is dropped off you gain 15 extra seconds, allowing more gameplay if you're on a roll. I knew that I needed to draw attention to the watch when time is added for the same reason the minimap directional icon can get lost: there are other things happening on the screen at the same time. I imagine someone noticing 1:30 left, then looking up after another delivery and the time has only gone down by 5 seconds. This could lead to confusion and giving up. I feel as if I did a good job at pulling a lot of attention to the watch, creating a deeper user understanding of this mechanic.