Cyberpunk 2077 x Matrix
A crossover created in my brain
Client
School Project
Course
INST703: Visual Design Studio
Timeline
6 weeks in Spring 2022
Tools used
Figma, After Effects
About Cyberpunk 2077
Cyberpunk 2077 is an open-world, action-adventure RPG set in the dark future of Night City — a dangerous megalopolis obsessed with power, glamor, and ceaseless body modification. The story takes place in Night City, an open world set in the Cyberpunk universe. Players assume the first-person perspective of a customizable mercenary known as V, who can acquire skills in hacking and machinery with options for melee and ranged combat.
Experience the Game
After playing the game for 5 hours, I found the character creation screen to be lacking creativity. The sequential list of 24 options makes it difficult to create a unique persona. The visual elements don't capture the essence of creating a cyber-human for the game. I believe a change is needed to improve the overall experience of creating a character to play.
Inspiration
Once it was clear in my head that I wanted to completely redesign this flow, I looked for inspiration. First thing that came to my mind being a Marvel fan was Iron Man creating his suits. More than that I wanted it to have it like holographic feel so that it feels like you are building something rather than just selection out of a few options.
Understanding Menu Structures
I researched various games to understand how their menus work visually and structurally. This helped me understand how different game types use different styles to create enjoyable experiences.

Multiplayer Games: I focused on Fortnite and Valorant's menu structures. Both games have a top-down layout, with a heavy focus on showcasing characters or game elements at the top. The Call to Action button is located at the bottom of the screen.
Box Structure: Some games use a box structure around the screen to emphasize on particular things. This structure uses size as a differentiating factor for various action buttons. This structure in games like FIFA, PUBG, Call of Duty Mobile
One Sided structure: Roleplaying games like Cyberpunk typically have a simple one-sided menu structure, with options on one side for quick navigation to start or load a game. This works well since the menu is not frequently used during extended gameplay sessions.
Character Selection Screen
From my understanding I wanted to club two screens using basic grouping. With this in play I try to give the users a better experience in terms of creating a character for themselves.

The first task was to understand the various customisations that Cyberpunk has for offer and then work towards a grouping.
Design Iterations
For my first design iteration I tried to play around with the matrix colors and see if they can work with the current assets of the game. I was able to come up with certain screens of the game but felt like the essence of Matrix was just in the colors and not in the elements of the design.