FaceGym

Partnered with facegym to help deliver a user centered Face Gym experience online and in-store.

FG-VISUALS

Role

Senior Product designer

OVERVIEW

Partnered with an agency to help deliver a user centered Face Gym experience online and in-store.

Delivered an end to end journey that put the users at the forefront of the platform. Creating a consistent design system and page visuals by working closely with the stakeholders and developers to create visual designs that deliver value for the business and its customers.
FG-WIRE
DISCOVER
Enhancing User Engagement and Experience
To kick off the discovery phase we began with a UX checklist, we decided to use a hydrid model of a cognitive walkthrough complemented with a research from the Baymard Institute. The UX checklist was a comprehensive walkthrough of all aspects of a website that affect users and optimise conversions. This allowed us present the client with all the shortcomings regarding the UX. The cognitive walkthrough allowed us to experience the site from a new users perspective.


DEFINE
User personas were crafted based on the gathered available data from the current Face Gym platform.
After undertaking an audit from the UX checklist, we identified  the main problem area of the platform to be the checkout process. Our goal was to allow users to flow through the site and have one checkout process. As on the existing site users had two separate checkout experiences, one for skincare and one for workouts, which left all stakeholders feeling frustrated. From a business sense this was missing a key upselling stage.

We created low fidelity wireframe flows and presented these to a group of users and business stakeholders. From this round of testing we were able to make revisions to improve the flow.
FG-DS
DESIGN SYSTEM
Since Face Gym have a small marketing team, it was decided to use Google’s material design system as a base then develop additional components to fit Face Gym’s needs. This aided in reducing costs, as well as future proofing any future design or development work under taken on the platform, as other developers and designers will be familiar with it.

We opted for an atomic methodology in our design system, finding it instrumental in structuring and organizing both design and development efforts.

FG-MOBILE
solution
Assisted in overhauling Face Gym's e-commerce Platform
Problems solved
FG-DS
Case Study