top of page
Black Friday: A Menu UI Project

Black Friday is a main menu UI project that I made for my Game Feel class. This project is the main menu for a game where you play as a store manager surviving an absurd horror version of a Black Friday sale. I decided to implement most of the project with a diegetic interface. The project consists of a main menu, an options screen, a play game screen, a credits “employee of the month wall”, and a Quit Game box.​

The outline of the menu elements was achieved using a 3rd party outline plugin. I added some custom logic on top of it that makes the size of the outline fluctuate over time. I also change the color of the outline when the mouse is held down over the menu element.

​

I used Unity’s animator to implement a lot of the transitions between menu elements. I chose to use the animator because of the customizability that comes with the curves. However, I found that there were a few parts of the project that I had to use custom interpolation logic instead. I coded the movement of the camera and the scaling of the buttons so that I had more control over the start of these animations.

​

In order to make the sliders feel more intuitive and fun to mess around with, I change the scale of the slider bar based on the speed that the slider handle is being moved. For the graphics options, I initially planned to use Unity’s dropdown, but I ended up replacing it with my own UI element that cycles through options with two buttons.

​

One challenge with this project was figuring out the camera rotation for the Exit Game animation. The issue was that moving the camera with code conflicted with moving the camera with an animation. Given that I was running out of time on the project, I decided to simplify the camera rotation by moving the door into a better position.

​

The transition from the Play Game screen to the security camera footage was achieved by making the Play Game screen a separate screen that is overlayed on top of the security camera footage. The screen waits until the camera is in place so that the screen leaving the bounds of the monitor can be hidden. Security camera screen is displaying a render texture that is rendering a camera in a separate room.

bottom of page