Sebastian Pedersen
Frontend Lobby
During production internal playtesting had revealed that our original Frontend Lobby flow and screen often felt awkward and clunky to navigate. Thus, a large iteration was required. I designed this new iteration which has been used tens of millions of players in the live game since launch.
My responsibilities included:
-
Competitive analysis of lobby designs used in competitor game titles.
-
Designing the frontend lobby screen as it exists today.
-
Designing the frontend flows for entering the lobby as well as inviting friends to join.
-
Collaborating across different crafts and with stakeholders to ensure UI implementation followed my designs.
On this page is a summary of the design process that led to the current version of the Battlefield 6 Lobby.
Competitive Analysis
Lobbies in primarily multiplayer games are far from new as a concept. To ensure we had an intuitive and easy-to-use system, I conducted competitive analysis across multiple competitor titles. Playing and analysing these flows and screens gave me the necessary insights to determine what worked and what could be improved upon by our own systems. Below is are two of the many games I used as examples for in my competitive analysis.
Lobby Layout
After competitive analysis came screen layout design. Across competitive analysis, multiple aspects stood out:
-
The start button should have a large focus compared to other buttons on the screen, and be a spot to celebrate a match being found
-
Information about the selected mode should be clear to all players in the lobby
-
There should be ample space for party members to peacock their cosmetic items.
I also added quick links to easily manage the party, go back to select another mode, and to view and equip XP modifiers before entering a match.
Lobby Wireflows
To ensure the new lobby system was frictionless, I mapped out many different cases for the lobby flow. This also allowed for easy prototyping and communicating to stakeholders how the flow should work, so we could all align on its direction. Below is the mapped out wireflow, displaying flows for solo parties, the party leader inviting others, and party members joining via invite. There are also edge case wireframes for different lobby types and how matchmaking looks when browsing other screens simultaneously (i.e. customizing loadouts while searching for a match).
Final Screen In-Game
Below is a screenshot of how the screen currently looks in the live game after collaborating with different stakeholder across different crafts to ensure a smooth implementation.
