Pausing Subscription: A simple documentation

Radhika Balaji
Bootcamp
Published in
3 min readFeb 5, 2023

Previously in HackerRank …

*intriguing music plays*

When a customer decides to cancel their subscription with us, they saw this modal. It was a swift process.

Older UI

We (the self-serve team @HackerRank) were keen on understanding more about cancellations.

We finally had data that helped us narrow down the reasons.

What stood out most?! Well, many of our customers had seasonal hiring needs.

This now brings us to the problem statement

How might we ensure customers can use our product intermittently and still come back to it?

Design

After multiple back and forths, we realised that a pause flow should be in place instead of a straightforward cancel flow.

Part 1 of the design was to revamp the older modal to newer styling.

This UI was designed using the design system being built in HackerRank

We started out with mapping the flows because Dora would say, “Map, map, map”.

Figjam process

Here’s a sneak-peak into my Figjam process. Flows are immensely helpful.

  1. It’s truly valuable to put everything out there and get early feedback.
  2. Helps determine standalone functionality, analyse their value and integrate into the bigger flow if needed.
Pause Flow
Resume Flow

This process sparked a ton of questions. Hence, I set out to get some answers.

I needed some answers before I could proceed confidently.

Answers to the above questions:

  1. Yes, that’s correct. The UX for extending the pause should reflect this as well.
  2. Pause will only be available to those on monthly plans.
  3. Yes, reduction in churn 😻
  4. I hope so

Constraints encountered:

Due to time constraints, and the need for rapid testing, this was decided to be carried out in the Older UI.

Final version

After a couple of iterations, we ended up with our final flows. Follow the videos here to look at the various instances we thought through.

First Time UX

Pausing for the first time

Resuming Subscription

Resuming subscription

Extending pause duration

Extend Flow

Did it work?

15 customers had paused their subscriptions to come back and activate (within a few weeks after release) ❤

Churn was thus reduced.

Shoutout to the team I worked closely with

Akanksha Garg (Product Manager); Azure Kelly (Front-end Engineer)

Thank you for reading. One quick thing before you go…

May this be a reminder to document your work too 😉

Until next time 👋 Adios Amigos!

--

--

Radhika Balaji
Bootcamp

Product Designer @HackerRank | Storytelling enthusiast