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.