Settings Menu

Project: Ultimate Sackboy

Ultimate Sackboy, an endless runner game developed by Exient, is available on the Apple Store and Google Play. The game plunges players into the captivating universe of Sackboy, a renowned hero from PlayStation. Your mission is to guide the character through an exhilarating run, dodging obstacles and striving to reach the goal while earning valuable points. I had the delightful opportunity to contribute to the development of several features within this exciting game.

Details

01

Role

Product/UX Designer

02

Date

April 2023 – May 2023

03

Skills Used

Competitor Research
Wireframing & Prototyping
Visual Communication
Collaboration
Critical Thinking
Documentation

04

Tools Used

Figma
Unity
Confluence
In-house localisation software

The Challenge

How can we improve the user experience to allow users to optimise their settings, whether changing game options, finding support or changing their name?

The Solution

01

Research

Initially, the menu included:

- Graphics, Music, and SFX toggles,
- A Language button leading to a Language Popup
- Support, Legal and Privacy Settings buttons leading to external webpages

My aim was to introduce extra optimization preferences and a dedicated functionality for players to save their progress using Cloud storage.

Original Settings Menu

02

Competitor Research

I began researching how both direct and indirect competitors handle their Settings Menu and documented my findings. I looked into the setting preferences they offer, the layout, and the overall user flow.

03

Wireframes

Next, I started sketching out ideas and then hopped onto Figma bring those ideas to life by creating wireframes that cover all the different user flows and edge cases.

Wireframes for all user flows within the Settings Menu

I also wanted to provide users with the option to change their name. Personally, I believe this feature should be accessible through their Player Profile. However, since the Player Profile section doesn’t exist in-game, the best place to access this would be from the clothing inventory. We can add their name on the top right and include an edit button for easy customization.

Ability to change name from within the clothing inventory

04

Clickable Prototype

I then developed a clickable prototype to test and full proof the design before moving on to documentation.

Preview of wireframe flow interactions on Figma

Settings Prototype

Name Change Prototype

Third Name Change – Purchase

05

Documentation, Review & Iteration

Lastly, I compiled a design document with additional requirements for stakeholders from Art, Design, Code, and QA disciplines. The Lead Designer reviewed and provided feedback for iteration. The design underwent a review by all stakeholders and after receiving feedback, we discussed the necessary iterative improvements to the flow, prototype, and the entirety of the document. The following images are snippets from the documentation.

06

Implementation

I then provided Code and UI support to ensure alignment until the design was fully implemented. The design was tested by myself and QA and any bugs that came up were reported and fixed.

Settings Menu

Name Change Flow – Profanity filter

More Projects

PROJECT: ULTIMATE SACKBOY

Creating a first time user experience

A UX designer & product person passionate about creating simple and innovative user experiences.

PROJECT: ULTIMATE SACKBOY

Creating a first time user experience

A UX designer & product person passionate about creating simple and innovative user experiences.

More Projects