Impact

Revamping the setup flow spiked a new feature’s adoption by 30.91%

About ReferralCandy

Businesses are always looking at ways to increase sales, and word of mouth is one of the easiest and proven ways of acquiring more customers. ReferralCandy, a B2B app available on Shopify and Woocommerce, makes this easy.

You can sign up and launch a referral program (i.e. give $10, get $10) in under 30 mins. It’s set-and-forget nature and ready-to-use assets make it a top choice among marketers.

Context

To stay competitive and respond to growing merchant requests, ReferralCandy introduced a new feature called “FlexiTiers”. It allowed e-commerce merchants to give customers different rewards depending on the number of friends they referred.

For example, the popular newsletter Morning Brew has a referral program with multiple tiers:

  1. Refer 3rd friend —> get a free stickers

  2. Refer 5th friend —> get a free t-shirt

  3. Refer 10th friend —> get free socks

  4. Refer 15th friend —> get a mystery item

  5. Refer 25th friend —> get a free backpack

Problem

After launching the feature, merchants using a single reward setup were abruptly changed to the new "Flexi-Tiers" setup without warning.

More serious though, was that merchants who did want to use tiers misunderstood the interface. Nothing in the UI communicated that to put a cap to their rewards, they needed to create a final tier that gave customers "nothing."

Without a "nothing" tier, a customer could earn unlimited rewards (such as unlimited $50 off coupons), risking profit loss. To resolve this quickly, our Customer Success Managers reached out to merchants to confirm their rewards.

Solution

We made several backend and frontend improvements to increase feature adoption, including

  1. Showing a clear preview so that users didn’t need to wonder if they set up their tiers correctly.

2. Using informative banners to guide users when they switched from a single reward to multi-reward & tiered setup, and vice versa.

3. Simplifying the flow of using tiers. Instead of needing to create a "tier that gives customers “nothing”, users could follow their mental model and simply create tiers based on what they wanted to give out, such as a free t-shirt for 3 referrals.

  • Progressive disclosure aids simple

    Several complex settings were nested in expandable components. These components were also collapsed by default.

    This allowed users to focus on high-level actions and only view details when needed.

  • More copy can give clarity

    After speaking to customer success staff, we found out that users felt anxious about how certain settings would affect customers (“if I count past rewards towards tier progression, how many customers do I need to give X reward to?”)

    By providing the exact number of customers who’d be affected, users could make a more informed decision.

    Although I’d generally opt for less copy than more, in this case it was the right decision because it helped give users confidence in their decision-making.

  • Users are in the driver's seat

    Instead of forcing all users to adopt tiers, those who wanted to retain a straightforward & single-reward setup could do so.

    By adding clear buttons for editing a single reward vs adding new tiers, we gave back the power to users. They could decide whether to use the feature or not. Furthermore, we were able to address the Marketing teams concerns and help them sell better by listing several creative ways the new “FlexiTiers” feature could be used.

Impact

The redesign resulted in an 30.91% adoption spike and the following feedback:

“Love it! ❤️"

“This layout is much easier to see. So when I was editing it before, it was quite difficult to see. So this is fine."