Photo Vault

Keepsafe Photo Vault is for locking photos securely behind a PIN. The app had been experiencing a drop in retention. Here are a few examples where I helped the team by focusing on the user.

  • Skills: UX, UI, Mobile Design, User Research
  • Tools: Sketch, Zeplin, Framer
  • Team: PM, iOS engineers, Android engineers

Backup & storage

I learned about a variety of pain points via user testing, app reviews and customer services. These were two common user stories:

Value proposition

I'm mostly here to store photos behind a PIN. I'm not convinced I should pay for more.

I lost my photos

My photos haven't finished backing up yet. But, I try to access them via a new phone or fresh install.


I lost my photos

My photos haven't finished backing up yet. But, I try to access them via a new phone or fresh install.

auto connect

The paywall underemphasized storage and was part of a poor experience.


Uncommon ways of representing backup and storage.


The upper right-hand corner shows a cloud icon with a progress indicator. Overall the progress of syncing was undercommunicated.


The upper right-hand corner shows a cloud icon with a progress indicator. Overall the progress of syncing was undercommunicated.


Design goals


  • More clearly represent the progress of a backup. Especially states where the user is potentially at risk to lose photos.
  • Use more common terms and phrases. It will take the user less time to understand the state of their backups.
  • Incorporate a better paywall experience. Present options where they feel most valuable and relevant.
backup and sync changes

A friendlier paywall experience focused emphasizing storage.


More graphical representation of storage. Common interaction patterns and messaging.


A progress bar more directly communicated the state of backup.


A progress bar more directly communicated the state of backup.


Helpful alert states help to prevent loss of photos.


The original paywall came at the end of a 30 day trial where the user had unlimited backups. Due to business constraints we could not block import once the user had reached their storage limit. So we relied on educational elements. The new paywall was better because it was more contextually relevant and could prevent a painful downgrading process.

backup and sync changes

Additional warning states helped to prevent loss of photos.

backup and sync changes
backup and sync changes

Onboarding


Dropoff

We were experiencing dropoff at PIN creation during onboarding. The analysis came from event measurement in Amplitude. A funnel was created from two events which measured install followed by email entry. Each event was represented by total number of times triggered.


The email creation screen was shown just after PIN code creation. I saw that about 95% of users who installed the app successfully made it past the PIN creation screen.


I tested users with no experience with our app on usertesting.com. I asked them to go through the flow of creating an account. I specifically watched for areas of confusion during the PIN screen. Areas where users were repeatedly confused (or where progress was notably slowed) gave me an idea of what I should focus on to improve the interaction.


previous pin code screen

Success state isn't visually prominent enough.


Odd placement for the deletion button.


No indication for the minimum number of pins.


No indication for the minimum number of pins.


**Redesign**
previous pin code screen

It was helpful to create a prototype in order to illustrate the interaction details. It made it easier to clearly communicate my thoughts to the engineers.

Import menu

The iOS version of the app suffered from some UI decisions that had been made hastily during development. Atypical functionality slowed and confused progress for users.

**Desired metrics**

Increase the length of time we'd retain a user via an increased number of photos imported.

**Original**
previous import menu

Reported results

The following was measured as a test against two other possibilities and our control. The other experiments involved an animation and a hint. The control was the original interaction which you can see above. The redesign led about 20.7 photos per import where the other import variations led about 16.5. The redesign was reported to have led about 18% more items per import.

previous import menu