Incorporating best ux practices and updating ui

Creating a more effective settings menu

I. Project overview

This project is a conceptual solution that addresses issues around the GTA V menu.

timeline
September 2024 - October 2024
Role
UX/UI Designer & Researcher
tools
Figma

Watch a quick 3.5 minute synopsis of this case study!

What's the problem I tried to solve?

Problem
The main menu of GTA V is poorly designed, with difficult navigation that hinders quick access to options. Its confusing layout makes it hard to memorize key settings, and many options lack clear descriptions, leaving players unsure of their impact on gameplay. Additionally, the menu features outdated designs from 2013, contributing to a dated and clunky feel.
goal
I needed to redesign the menu to align with modern minimalist trends and proven UX practices. The goal was to provide clearer context, ensuring players better understand the purpose and impact of specific settings.

Solution: Impactful settings menu

provide context
Providing players with context about the impact of specific settings enables them to make informed choices that align with their gameplay preferences.
REDUCE COGNITIVE LOAD
Simplifying menu options will reduce cognitive load, helping players focus on what’s most important.
MODERN VISUAL DESIGn
Updating the menu design to align with current design trends enhances visual appeal and keeps players engaged throughout their experience.

Providing context helps players understand the purpose of each setting and how it impacts their gameplay experience.

II. Research

Background

GTA V
GTA V is an open-world gaming platform where players take on specific missions and roles within the game's narrative. In addition to the single-player mode, players can engage in the online version, which immerses them into their character’s world. The game allows players to communicate in real-time through live chat and voice broadcasts with others, enhancing the multiplayer experience.
FIRST IMPRESSION AND ANALYSIS
The cluttered menu interface makes it hard for players to understand each setting's function, forcing them to exit and re-enter the game to experiment. This lack of clear explanations causes confusion and frustration, negatively impacting the overall user experience.
motivation
Having experienced GTA V's frustrating menu system firsthand, I was motivated to redesign it for a more intuitive and enjoyable experience. My assessment revealed outdated design patterns, poor navigation, and a lack of user-friendly structure, highlighting the need for a comprehensive UX overhaul.
GTA V
Settings in a video game play a crucial role in allowing players to customize their experience to fit their personal preferences. They help optimize performance, enhance immersion, and adjust how the user interface appears on screen. But what makes a settings menu truly impactful, enabling players to make choices that best suit their needs?

Empathizing with players

player stories
To design with the player in mind, I conducted informal 15-minute interviews with 5 friends during gaming sessions, uncovering frustrations around menu navigation and confusion about the impact of settings. A common pain point was the menu’s difficulty to navigate due to "unclear or ambiguous displays," which negatively affected the gameplay experience. By focusing on these specific issues, I aimed to streamline the menu for improved usability and smoother interactions.
As a player,
I want to know the meaning behind a setting and how it’s going to effect my gameplay.
As a player,
I want to see a preview of the impact of my settings without having to go back in my game.

Great examples

GOD OF WAR: RAGNAROK
In God of War: Ragnarok, players can choose their difficulty mode based on their preferred gameplay experience. Each mode is accompanied by a clear description, helping players understand the challenges of each option. This allows them to make informed decisions and select the mode that best suits their playstyle before embarking on their adventure.
Players can unlock runic attacks for both main and supporting characters, each with unique abilities and movesets. A preview shows the attack's effects, helping players visualize and make informed choices before committing.
God of War: RagnarokGod of War: Ragnarok
Call of Duty: Black Ops Cold War
In Call of Duty: Black Ops Cold War, players can customize the colors of player indicators on any map. The ability to adjust settings based on different colorblind types, along with a real-time preview of the map and indicators, helps all players see the effects of their changes before finalizing them.
Call of Duty: Black Ops Cold War

What makes these effective and exemplary menus?

EMPOWERMENT
Understanding each setting's purpose and impact allows for informed adjustments, enhancing gameplay and giving players control to tailor the game to their preferences.
visual confirmation
Enable real-time previews of settings adjustments, providing instant visual feedback so players can see changes as they make them without leaving the menu.
efficiency
Enable players to instantly assess the impact of settings without toggling between menus and gameplay, streamlining customization for a better experience.
reduces cognitive load
Present essential information without overwhelming players with unnecessary choices, enabling them to focus on what truly matters.

III. Design process

Wireframes and direction

goals
While redesigning the menu to improve user experience, I kept most of the layout intact to maintain player familiarity with GTA V, a 10 year old game. However, I introduced a new environmental status display, providing real-time in-game details like day, time, weather, and location, giving players more context without overwhelming them.
I added an in-game context feature that displays descriptions, images, or videos when players hover over submenu options, showing how settings affect the game. To avoid cognitive overload, the in-game context panel isn't displayed initially. When a player selects a setting from the original menu list, the menu list slides left, revealing the in-game context, offering a clear and seamless way to understand their choices without overwhelming them.

New addition

In-game context
The in-game context panel is a new addition to the menu, inspired by best practices from top menu designs. It informs players of the impact their settings will have in-game, eliminating the need to exit the menu to see how their gameplay is affected.

Final designs

redesign and improvement
In my final designs, I created a modern, minimalist menu with a cleaner layout for easier navigation. Icons next to each tab offer quick visual cues, while added gamepad controls like page up/down improve efficiency, reducing manual scrolling.
These new components improve the UI by providing more context for players. The arrows disable when reaching the end of options, and players can now see the percentage setting for each bar along with clear end-point indicators, offering more detailed control compared to the current UI.
After selecting “Display,” players enter the submenu where increased spacing and dividers improve readability and clarity. When modifying the "Weapon Target", the design helps players make informed decisions on their UI preferences during gameplay.

IV. Project learnings

Reflection

Next steps
Typically, I would continue developing this design through to completion rather than stopping here. However, since this was a personal project focused on a specific scenario, I paused after addressing the primary setting. If this were a full-scale project, the next steps would include designing and wireframing the rest of the menu. The following steps would be:

• Test ideas with players
• Iterate designs based on feedback
• Evaluate performance
challenges
A challenge I encountered during this solo project was figuring out how I was going to revamp an outdated menu while keeping it's functionality intact. Players who have been playing the game since 2013 would be in for a learning curve if the functionality of the menu was completely different.
Takeaways
Empowering players to make choices that align with their preferences requires providing them with the necessary guidance to support those decisions. To effectively prepare players for their adventure, the settings menu should serve as the initial step in this journey. Offering context is vital for helping players enhance their experience and find what suits them best.

Want to see more of my work?

Choose a project
Choose the next project or navigate back to the projects page.
View all projects
Startup
app
b2c
travel

To & Fro • Design System

Led the creation of a scalable design system with over 50 reusable components, achieving 90% component usage across the platform and full compliance with WCAG 2.1 accessibility standards.