Zwift Memberships

UX/UI, Prototyping, User Testing

While at Zwift I had the opportunity to launch a major update to the members services side of the Zwift web experience, Annual memberships. At the time Zwift only offered a monthly membership and as a way to combat seasonality dips in subscriber numbers we thought that by offering a yearly membership we could reduce that summer churn and keep Zwifters active year round.

Image

Membership landing page that has membership options availabe at the time of launch.

We teamed up with the a fellow UX designer to map out the end to end experience. Similar to the Zwift Referrals project launch we gathered all the backend details and edge cases so that we could start to understand what is needed to update the existing components. Once the discover had been completed we got started on the redesign of the members page and account creation flow.

Zwift Members experience prototype, switching membership type.

While working on the design updates we wanted to take the opportunity to workshop the language used to communicate the value of the yearly membership over a monthyly membership. Working with the product marketing team we finalized on two different directions that we wanted to test using a figma prototype. After a round of testing we landed on what the language that we wanted to run with for launch and started to finalize the layouts and components.

User testing prototype for Members area updates.

Due to the complexity of the membership purchasing process we had to come utilize a documentation process developed during the Zwift Referrals project. This method of documentation aided in maintaining our source of truth and allowed us to add additional edge cases as they popped up during development. Part of this work was to finalizing and documenting the different animations needed throughout the flow. We wanted to add a bit of delight to what would be an otherwise mundane task. By adding in some visuals from the game and well timed animations I feel that we achieved our goal in making this process a bit more interesting.

View Documentation

Zwift Referrals end to end on mobile.

Shortly after launch we discovered that Annual memberships made up 10% of all new subscriptions sold, exceeding our projections (5% was the target) and we had 50K migrations of active subscribers in the first week after launch (exceeding the predicted 20k).

Image

Mid-fidelity prototype used to test out language used for Annual Membership.

Image

Documentation for membership card.

Redeem Promotion module with animation.

Switching memberships animation on mobile.