The context

The AcadArena web app was going to be soft launched in Brazil, and we needed to address the concern on what users from that region will be using: do we host them all in the existing web app that is being used by our PH users? Or do we launch a separate and duplicated entity that functions the same way, but is just catered to Brazil users?
We decided to go with the latter, especially considering that the main language used in Brazil is Brazilian Portuguese, not English. We wanted to cater to this need as soon as we launched, so while the team was preparing the translations for the different parts of our web app, we had to create a feature that would allow users to choose which region they wanted access to.

The solution

A region selector will be included in the web app, where users can select if they want to access the PH region or the Brazil region. We also planned out the routing in case PH users accidentally visit the Brazil region site, and vice versa.

Prototype

Desktop

Desktop prototype for Region selector. Feel free to interact with the prototype and click around. As an example, you may click the flag icon on the upper right portion of the navbar to start the interaction flow.
 

Mobile

Mobile prototype for Region selector. Feel free to interact with the prototype and click around. As an example, you may click the flag icon on the upper right portion of the navbar to start the interaction flow.

Skills

  • UX & UI Design
  • Design System

Project Components

  • Mockups

Collaborators

Kevin He - Product Lead