Swipii

Client
Swipii

My role
UI Design, UX Research, UX Design

Credits
Swipii

The context

Swipii was a Scottish-based company on a mission to give local businesses the tools and technology they need to help compete on a level playing field with global brands. By simply downloading the app and linking their payment card, consumers can use Swipii to discover local offers, save money on everyday purchases, and share them with their friends and community.

At the time of starting this project, Swipii was just pivoting from a previous business model based on loyalty points and rewards (proven unfit for purpose), and transitioning to a cashback incentive.

In order to grow, it was key for the company to be able to reach out to consumers with marketing communications, so that more offers could be discovered and redeemed, but the sign-up journey at the time wasn’t intuitive and easy enough for users to ultimately go down the happy path of creating an account, linking their payment card, and enable marketing comms, resulting in only 8-10% of people opting in.

After the redesign, the number skyrocketed to 72%. That’s right, about 800% increase.

The existing sign-up journey presented several challenges, which could be broken down to two main categories: usability and interface. The majority of the work focused on improving the usability of the journey, with the interface improvements serving the purpose of binding everything together for a more consistent and appealing experience.

These interface design changes rolled out across the app and ranged from minor consistency updates, to general hierarchical improvements, such as re-establishing the priority of CTAs, or revisiting the business listings.

The main issue

The biggest problem to fix was that the journey asked users to do too many things, in a short amount of time, without providing any value upfront, ultimately gaining little trust as a company, which resulted in poor activation rates.

Specifically, this was across several touchpoints.

1.
The marketing ask was inconveniently placed right at the start of the journey, at the moment of inputting details, in the form of a toggle. Raise your hand if you’ve ever been excited to see a marketing checkbox. 🥱

2.
Right after inputting the details, users were asked to link their payment card, with little explanation on how the service worked (this was still when loyalty points were present).

3.
After potentially agreeing to link their card, additional friction surfaced when having to actually type in the details or scan the card itself (through Fidel, Swipii’s third party payment API).

4.
Lastly, whenever a new user made it that far, if they were using an iPhone they had to allow in-app notifications, as Apple iOS blocks them by default. This hiccup wasn’t present on Android.

What then?

This situation called for an onboarding journey that would place the value of the app at the centre for users, before asking them to do anything. It was important to hold them by hand throughout and explain what the benefits of the marketing comms are (eg. receiving notifications to help them earn more cashback).

Since explaining the value of the app would be crucial, it felt natural to separate the card-linking aspect from the sign-up journey, to leave it in the app, to let people link their card in their own time, actively choosing to do so as a result of the value perceived.

With this hypothesis in mind, I designed some prototypes and ran some user testing sessions to find out more about the attitudes towards signing up, the in-app push notifications opt-in, and the onboarding experience.

User testing: control vs guided onboarding

With our hypotheses laid out, I designed and hooked up in Figma a prototype for an onboarding journey that was tested against the (at the time) current experience. In addition to this, the notification ask was turned into a screen of its own, with the copy combining a call to action for both the marketing notifications and transactional notifications.

We spoke to 20 people aged 18 to 30 years old, earning £40k or less, and based in the UK. The user pool was divided into two groups of 10, to run the test in opposite order, to eliminate bias.

Of all those people, 18 out 20 preferred the option that made them go through the onboarding journey, with the remaining participant in the study saying they wouldn’t necessarily want to go through “all of it”, but see the benefit of it.

The guided onboarding was described as informative, easy to understand, simple, and doesn’t waste time. In regards to the notification ask, all but one participants allowed both kinds of notifications.

Some user feedback

“Experience is quicker than expected”

“Everything is smooth and easy to digest”

“I’ve allowed notifications because the app recommended it”

“I Like the chance to earn up to 3x more”

In a nutshell:

Most users preferred an approach which provides more information on how the app works, and are happy to go through it
All of the users expressed a preference towards the explicit benefits of extra cashback
Simplicity of the screens, tagline and graphic approach was generally well received
As long as Swipii doesn’t spam notifications, those won’t feel like an inconvenience

Based on the learnings and the user interviews, we knew we had to:

Ask users for notifications (transactions + extra cashback) in a single screen
Emphasise consumer value (eg. you can earn up to 3 times more)
Provide a guided onboarding journey with simple, clear steps
Make the flow visually engaging

Here come the solution

The updated UX flow was much more streamlined, with users think way less about which actions to perform, and able to make informed decisions after having received the value in the onboarding screens.

Starting from the login screen, I reorganised the priority of the calls to action, since the hierarchy should’ve been more targeted towards new users, placing emphasis on the “sign up” and “sign in” buttons, rather than the “I have a Swipii card” call to action (catered to users who were still on the version with points and rewards).

I then created basic illustrations to accompany the copy, making the flow feel light and engaging.

Zen, but inclusive

For the marketing ask screen, I initially created an illustration portraying a zen wallet having a good time surrounded by cash, to convey the fact that you really need to turn on notifications to get the most out of Swipii.

However the subject of this illustration was, not long after the implementation of this feature, changed from a wallet to a coin, in order to be more inclusive of our audiences. After some chats within the team it came out that a wallet (that wallet?) was pretty much a “male” thing, and I was happy to investigate ways to make this less biased.

It’s a small thing, but if it makes a big difference in someone’s experience… why not implement it?

After agreeing to (or dismissing) the notification ask, users would be brought to this new version of the home screen, with UI improvements for both in the location screen and the businesses screen.

Now people could link their card in their own time, after playing around with the app and/or after having learned more about it; this approach takes the pressure off the user and makes for a much higher activation rate. Kinda like a tutorial inside videogames.

One other additional feature added was the display of the payment provider on the home screen, so that people would know right away (without necessarily having to tap onto a business profile page) which payment card would allow them to earn cashback at which business. The last thing we wanted was people transacting and not receiving any cashback because of confusion. 😅

Result: 800% increase in marketing comms opt-in

Following a redesign of the sign-up flow in the app, the new onboarding journey outlined the value that Swipii provides. We were able to increase the marketing notifications opt-in from a rate of 8-10% to 72%! Users now clearly understand the benefits of opting in: extra cashback.