Hotwheels: Rift Rally

WIREFRAMES | UI/UX DESIGN | INTERACTIONS | GAME DESIGN | ANIMATION

Hot Wheels: Rift Rally is a fast-paced mixed-reality racing experience in partnership with Mattel. Users can create courses throughout their homes as custom tracks and experience the course on their screen through the physical car's camera.

Target Audience: Ages 6+

Platform: PlayStation 4, PlayStation 5 & iOS

Original High Fidelity Mockups

User Flow

Activity Selection

I designed the HUD UI, including iconography for in-game collectibles and currency, the firmware status widget, and the map node popup panel for the activities. Each node on the map had its own objectives that would reward the player with collectibles and currency. I also animated the elements of the panel so that the timing and unlocks felt rewarding.

Results Panel

The design and animations for the post-race results panel.

Reward Moment - FTUE

For first-time user experience, when the player is able to complete an objective, they receive a ‘reward moment’ with messaging that explains the reward and its use.

Once the ‘reward moment’ is over, the player is taken back to the results panel that shows that the reward has been unlocked and the objective completed.

I wireframed two different low fidelity 'reward moment' flows and we essentially went with Option 2.

Reward Flow: Option 1 Wireframes

Reward Flow: Option 2 Wireframes

Final High Fidelity Designs

Reward Moment - General

After a race and challenge have been completed, the players would view a success screen outlining whether or not they completed the challenge. Instead of just highlighting challenge completion in the results panel, I wanted the user to have a feeling of accomplishment.

Rewards

Various mockups for the non-FTUE reward layout.

In-Game Messaging

In-game chyrons, messaging and animations animated in-engine.

Performance Customization Screen

Players could change the states and appearance of their collected vehicles.

Multiplayer Lobby

The multiplayer flow and lobby were designed to provide players with the ability to join another player's game and challenge their friends online.

I wanted to make sure that all 4 (max) players were recognizable and that the host player stood out. I decided to assign different colors to each player and create a controller icon that would display next to the host's name.

The host could change their car and stats at any time while waiting for players to ready up. The other player's could change their car and stats as well.

Multiplayer Lobby - User Flow

Multiplayer Lobby - High Fidelity Design

Player Join & Controller Connect

Network & Chameleon Connection Widget

Designs for changing network settings, alerting the player to any connection issues with the Chameleon and firmware updates.

Settings Menu

Full high fidelity design for the Settings/Pause menu.

Style Guide

Overall style, UI elements, currency and collectibles and firmware widget designed for the game.