In 2015, when FaceIT and Pixelmatters started working together, FaceIT was already a big name on the eSports scene, with millions of users using their platform on a daily basis. Now, it is even bigger!
Pixelmatters was hired to do all UX and UI of FaceIT iOS and Android Apps, that unfortunately were not released to the public. Still, here's a sneak peek of what was done.
FaceIT is a huge platform, with lots of screens and flows. So, the first task to start the project was the creation of a navigation map.
This allowed us to have a high-level view over the whole the platform, therefore getting visibility to translate the Desktop experience into a Mobile one.
After the navigation map was done and approved, we went on to actually starting to create the structure and hierarchy of elements of each screen, putting together some hi-fi Wireframes, that were then used as a basis for the UI.
With the Wireframes for pretty much all screens in place, it was time to start building the UI.
The Look and Feel created was bold, sporty, refreshing, adapted to the Mobile environment, but keeping in mind FaceIT brand guidelines, as it was an already established and well-known brand.
We just had so much fun doing this project! The idea was to try to combine FaceIT look and feel with the games' imagery. A match made in heaven!
The same foundation that was created for the iOS App was then used to create Android designs. Some adjustments were necessary given both platforms intrinsic differences, but the core of it was kept.
Based on the scale of the platform, it was essential to have a design system in place, in order to keep consistency and speed up the process, not only in terms of design but also development, with a full component-based approach.
The scale of the project enabled us to generate a wide range of components which then allowed us to create new screens with ease.
