JETT: THE

FAR SHORE

Helping refine the UX of

a Playstation 5 Debut

— PROJECT NAME

Jett: The Far Shore

— ROLE

UX Consultant

Additional UI Design

Gameplay & QA Testing

— TOOLS

Adobe Photoshop

Sketch

Principle

Adobe Premier

Bandicam

Jett: The Far Shore is an action-adventure game for Playstation 5 and PC, set on a faraway planet. As Mei, an acolyte tasked with exploring and uncovering the secrets of this new world, the player takes to the alien skies in an aircraft called a Jett. Researching new species, soaring to new destinations with your fellow scouts, and using all the tools at your disposal to avoid danger are all in a days work. All the meanwhile, your religious experiences intertwine with the mysteries of the faraway planet.

I jumped into the project when development was at a highly-refined Alpha stage. Initially tasked with gameplay testing, I was then hired on as a UX consultant from the quality of my reports.

The actual UI and user experience that shipped was a collaboration led by the talented team at SUPERBROTHERS. Although several of my ideas found their way into the shipping product, in many ways it differs from the vision I describe here.

Here are 3 of many avenues explored to enhance the user experience part-way through development.

**ON DESKTOP: Click on images to zoom in**

ORIGINAL HUD LAYOUT

In earlier builds of the game, numerous UI elements filled the screen as the player soared through the skies in their Jett.

From the many hours of play testing, I wanted to provide more reasoning for the location of these respective HUD elements.

ANCHORING ELEMENTS

Intending to add more order, we helped the player create a mental model of where to reliably look for certain critical information, such as the condition of your aircraft and status modifiers, in addition to updates about whats happening with your gear and objectives.

My proposed solution was categorizing each element and then anchor it to a section of the screen where the player could always know where to reference it.

HUD Layout Comparison:

Slide the divider to the right for the initial layout

and to the left for my proposed layout

NOTIFICATION CARDS

Collected objects, research findings from your scanner, and updates on new gear available to use are among many of the temporary notifications for the player that grace different sections of the Jett HUD.

To condense all these notifications into an area the player could predictably reference, my concept was to adapt them into a series of cards in a feed in the upper-right corner of the screen.

Timing and order of the cards is contextual. Warnings always appear at the very top, while new notifications appearing in quick succession form a stack below. To not crowd the screen, cards disappear after a length of time relative to the amount of information needed to fully notify the player.

INITIAL INDICATOR SYSTEM

On foot and in the air, a contextual diamond-shaped indicator appears within the game space whenever the player character is near something they can interact with.

Early on, when the player wanted to interact with something in the game space, they had to look to the bottom-right corner of the screen to see the relevant button to press.

I wanted to decrease the amount of eye travel the player made to get an immediate grasp of what can be done with in-game objects, especially while rushing towards time-critical goals and in sections of gameplay which required high dexterity from the player.

REDUCING EYE TRAVEL

To streamline this system, I proposed modifying the indicator in the game space to contain the icon of the corresponding controller button as well as carry the contextual label.

Bringing the information forward this way would help the player to not have to break immersion to figure out what to do with something, while allowing the controller HUD in the lower-right corner to always be a reference for all available actions the player could take at the current moment.

A subtle animation remains here as a small push towards the action the player SHOULD take out of many available- having that animation in two places would muddle that message.

JETT GEAR INDICATORS

Flying in your Jett provides many possibilities for interacting with objects in the game world. At the time of development, the "Square" button on the PS5 controller used whichever tool you had equipped, while the R1 shoulder button cycled through available gear one-by-one.

Visual feedback of what tool the player had equipped was conveyed through an icon and label on the controller section of the HUD.

To increase immediacy and reduce eye travel,

I conceived of a way to make the current tool equipped to be more apparent in the game space.

PROXIMITY-BASED RETICLES

To bring the information forward while using Jett gear, my concept of a new gear indicator system was to include an initial reticle that is the same shape as the corresponding button press when you are close by.

The shape of the reticle helps the player to quickly recognize what tool they have equipped, and what button it corresponds to on the controller.

EXAMPLE 1: GRAPPLE INDICATOR

A good first example is with the Grapple Tool, which allows you to pick up, move, and throw objects.

A square reticle appears when you are close to something that can be grappled, then the diamond indicator with label appears when you can initiate the action.

EXAMPLE 2: SHELTER INDICATOR

Setting up a remote shelter is another frequent task in the player’s adventure. As another tool tied to the square button, this could appear in the game space as a reticle mapped onto the ground.

This helps the player recognize where a good area to establish shelter is nearby.

EXAMPLE 3: PARKING INDICATOR

Though not a tool per-se, landing your craft not only allows you to get out and move around on foot, but is also necessary in key moments when you must calibrate your Jett’s equipment.

To differentiate these moments, a circular reticle is used instead when the game requires you to land in a certain place- helping drive home the fact that the player uses the circle button to land.

THE STARTING LIST

A big part of Jett: The Far Shore is recording new scientific entries about the flora, fauna, and geographic locations of the new planet. This all goes into a digital research journal, which can be referenced at any time to uncover new strategies and directions of experimentation with what you’ve found.

As a game with a very unique vocabulary, having this reference to stay in the loop with all the unique objects in the world is critical to the player.

This began as one flat list in the game journal, so we decided to explore potential improvements for how the player could quickly reference the details of any recorded object in the game.

The beginning task was to map out the most useful categories of research data in regards to gameplay. This was essential to help the player stay on top of the unique taxonomy of the organisms, locales, characters and story so far, in addition to the reference manual for the Helijet.

This could then be translated into new ways of organizing the journal UI.

INLINE LABELS

One solution was to simply add in-line labels to the existing list.

The more straight-forward change, it retained a singular list to scroll down, with the newest recorded entries appearing at the top of their respective categories.

TAB & TAG ORGANIZATION

My preferred solution was to sort through the information by tabs, which allows for quicker navigation and point of reference in all of the research data.

Tags on entries relayed critical information up-front, such as which organisms on the new planet were aggressive and likely to attack the player.