Ubisoft Connect is a transversal meta-layer which connects all
players and brands under the Ubisoft umbrella.
By offering players a series of 12 connected micro-apps, it enriches
game experiences.
My contributions to this project were split into two parts.
Company: Ubisoft
Team: Ghina El-Chemali, Letícia Zancan, Maria
Rundqvist, Émile Bergeron, Basile Fecourt, Roxanne Angers
Role: Product Designer, Front-End Developer
Timeline: 2019-2020
Status: in production
Name an electronic device. Someone probably tried to run a game on it. Games are ubiquitous - an idea which Ubisoft epitomizes. Upon starting this project, it was clear that most current & next-gen devices needed to be supported by this Design System. As most games are now played on mobile devices, light & dark modes would need to be included. Controller modalities also had to be taken into consideration, meaning that both focus-based navigation (common with game consoles or keyboards) and mouse/touch navigation had to be supported.
This project was on a short timeline, as its release needed to match
with the launch of the PS5 and Xbox Series X.
To support this timeline, engineering teams from various offices were leveraged.
In implementing some of the micro-apps, some of teams used React and others
used Vue.js. This meant that a shared library of React components would
not be usable by all engineering teams. Therefore, to best scale the usage
of the Design System to engineering teams, I devised a solution which matched
the level of abstraction:
To pull this off, here was my process:
My work enabled both React & Vue.js teams to save time on their
implementation by not having to worry about styling.
Code I wrote now runs on over 250 million PC, mac, Android,
iOS, Nintendo Switch, Playstation, Xbox devices and even cloud streaming
platforms!
Challenges are in-game prompts which players can complete to earn in-game currency and level-up their Ubisoft Account. There are 2 types of challenges: Core challenges only need to be completed once; and Time-Limited challenges reset every week and can be completed multiple times. Challenges are comparable in nature to Xbox & Steam achievements, Playstation trophies.
Together with a Game Designer responsible for designing wider system economics and gameplay loops, and a Product Owner responsible to matching business requirements, I designed UX & UI of the Ubisoft Connect Challenges feature.
The core of the Challenges feature is a list of Core and
Time-Limited Challenges. Each challenge has criteria which need to
be completed in-game by players.
Individual challenges are represented by a Card component within a list.
Many variables can compound and create lots of complexity within individual
challenges:
This is what Challenges look like in the mobile app: