Zwift

Improve Rider’s Experience with Pacer Bots

Intro

I recently had an interesting professional event that lead me back to riding at Zwift’s Watopia. Then I realized that I’ve been missing a lot as they’ve released new interesting features. However, one of these features was confusing so I thought why not show my love for the game and apply my UX skills and solve a problem.

Disclaimer: This is a self-initiated project and not associated with the company.

TIMELINE

4 Days

PLATFORM

Online Fitness Gaming App

INDUSTRY

Sports

Tech

Retail

MY ROLE

UX Designer

UX Research

Game Designer

TOOLS

Photoshop

Illustrator

After Effects

TEAM SIZE

Conceptual Project

Goals

01

Apply my UX skills in the world of games

02

To enhance engage-abilty for fellow Zwifters

03

In 4 days, try and make improvements to Zwift as the sole designer for the roles of user experience, interaction design, and user interface

Issue that I found in recent engagement with Zwift

Riding with a pacer bot is one of Zwift’s features that came out last year. The rider or “player” can choose from four different speeds. Supposedly you are training with a bot by pacing with it.

It’s a pretty neat idea because I myself like to train at a consistent speed. So I tried it out. Five minutes in and I had to pause the game, and when I got back in I had no idea where my pacer partner bot is. No indicator or anything. I kept cycling for 10 minutes more hoping I’d catch up but no sign of the pacer bot. Where is my supposed partner? How do I know if I can still catch up? What’s the point of having a pacer bot if I can’t see them?

Ideation & Animated Icon

This is my avatar trying to find the pacer bot

Zwift plan feature

Initial notes: applying UX Principles for games

Zwift player journey

Player Journey

Whiteboard Session

Information Architecture/Wireframes for the Pacer Bot Indicator

I made a “pacer icon” in green, yellow, and red in Illustrator and made them in 3D on After Effects to show the transition of the player doing well pacing with the bot to trying to catch up. Not trying to redesign the icon, I’m just not the best artist but at least it looks like an avocado.

Faded yellow and red indicating the Swifter is slowing down and riding 14m distance away from the bot. More than 30 secs of this distance, the indicator will turn red

Check out the short clip of the pacer bot icon in action!