Device Sync
UX, UX Writing
Opternative's vision test functioned entirely in their web browser of choice, rather than through a downloadable app. This presented a number of challenges, including getting users' smartphones and desktop screens to sync and work together as smoothly as possible without confusing the user or giving them what seemed like an onerous task.
The Problem
The old device sync page was confusing - it tried to cram a lot of information onto one screen, and that screen that also had a busy background. Users weren't sure what to do next, and dropoff rates once they hit that page were significant.
Before: Old, Confusing Device Sync Page
Old Device Sync Page

Before: Old, confusing page.

The Solution
We added an overview page with a video showing how the entire test would work so users understand what they needed to do.
Then we broke up the device sync into three parts and cleaned up the busy background, replacing it with an image of a user taking the test to again reinforce how the test would work.
The first part offered our recommended way to take the test: Give us your phone number, and we'll text you a link so you don't need to do any typing.  
Device Sync screenshot 1.1 - text for magic link
The second part of the page offered an option for users who didn't feel comfortable getting a "magic link" text message and/or giving their phone number to our system.
Users who clicked on "I'd rather type the link and my personal code" would get a URL to visit on their phone with a personal code to add once they were there. They'd also see an option to go back to getting a text message with the link instead.
Device Sync screenshot 1.2 - visit website in browser
And finally, once the code was added or the "magic link" clicked, the vision test would automatically understand that everything was synced and users could start as they were ready.
The new, more guided design was far clearer to users and significantly reduced drop-offs.
Device Sync screenshot 2 - Start test.
Back to Top