SuSimple | Simone LaBonté

A mobile app that helps keep track of and share subscriptions

Synopsis

The Problem

With subscription business models as popular as they are, it’s become increasingly harder for consumers to keep track of their subscriptions. Consumers may get charged for services they aren’t using or trials that have expired. SuSimple has a desktop-only website that helps users track their subscriptions. This (fictitious) company would like to capture a larger audience by developing a mobile app.

The Solution

SuSimple developed a mobile app that helps users keep track of their subscriptions, customize alerts and share their log-in credentials with friends and family. Onboarding and initial set-up is easier than ever as users now have the option to connect bank accounts or credit cards through a secure, encrypted connection.

Interactive Prototype

Go ahead, check it out!

Solution Overview: Primary Features

Subscriptions

Users will feel in control of their subscriptions by keeping track of them in one place.

Sharing

Through SuSimple, users can easily share their log-in credentials with the added benefit of security, quick access and eliminating the need to communicate when passwords get updated.

Custom Alerts

Never get charged for subscriptions that aren't in use or trials that have expired by customizing alerts and setting alert rules.

Reports

Users can get a sense of their spending on subscriptions and compare spending by categories and by month.

Unsubscribe

SuSimple makes it easy to cancel subscriptions by providing a direct external link to cancel a subscription.

My Role

User Experience (UX) Designer

User Interface (UI) Designer

Key Skills

User research, ideating, quickly sketching key frames, wireframes, high-fidelity prototypes, usability testing.

Timeline

Two months

Tools

Background

I received a brief about a fictitious company that has a successful subscription management desktop-only website. They want to increase their market reach by developing a mobile app.

Their User Stories

As a

Current user

Returning user

Consumer

I want to...

see all of my subscriptions in one place

unsubscribe from a subscription

be notified if any of my subscriptions are about to be auto-renewed

so that...

I can get a comprehensive view of my spending on subscriptions

I can reduce needless spending

I can make a decision about if I want to renew the subscription and continue spending money.

Their Current Target Audience

According to the brief, their target audience includes people that are

Over 30 years of age
They use phone and desktop equally
Middle class
Trying to be more budget-conscious

Importance of User Research

The information described in the brief are what the company believes their goals and users are. However, it was important to do my own research for a variety of reasons.

The user stories may be ones that enforce their business strategy. It’s important to validate them by doing research to ensure that they are also what’s most important or valuable to their users.
It may hurt the company’s reputation and it would be a waste of their time and money to design something that isn't user friendly or that no one uses. Reputation is especially important for companies involved in user’s finances.
Their target audience may shift as they cater to mobile users.

Process

Design Thinking

Empathize

Secondary Research

Similar to Lightning Demos in a Google Ventures Sprint, I studied other companies to see how they solved a similar problem. I studied three mobile applications and one website, noting their strengths and weaknesses.

Based on this research, one hypothesis I had was that it may be helpful for users to link their bank account to the app so that the app can detect subscriptions. This could lower the barriers for onboarding (no manual entry required), and possibly uncover forgotten subscriptions. However, some users may be weary of giving their banking information away or how their data will be used. This was something I needed to address in my user interviews.

Primary Research

Identifying Participants

I crafted a screener survey and posted it on Slack and social media and emailed and texted it to people I know who use subscriptions. Ultimately, 24 people responded.

Subscriptions

average number of subscriptions participants can access

Device

66%

of participants use a smartphone to sign up for, discontinue or manage subscriptions either the same or more than they use a desktop or laptop.

Sharing

65%

of participants have access to subscriptions they don’t pay for.

Cancel

74%

of participants have canceled subscriptions in the past 6 months

Reasons for Canceling

Objectives

The principal goal of my primary research was to understand how people manage their subscriptions in order to provide opportunities for improvement. My research questions were as follows:

What is the end-to-end process of how people currently manage their subscriptions?
What are users’ paint points when they are managing their subscriptions?
What are tools or resources people use to manage their subscriptions?
What makes users feel comfortable linking their bank account to a mobile app?

Interviews

I interviewed three people individually over Zoom calls, one over a phone call and one in person.

Research Synthesis

Affinity Map

After interviewing 5 participants, I listened to their recordings and took notes, making bullet points of important things they said. Using Miro, I put those notes onto digital post-it notes and grouped them into common themes to make an affinity map.

Common Themes from Affinity Map

Current Management

Pain Points

Wishlist for App

Trust in Mobile Apps

Tools to Manage

Sharing or Multiple Accounts

Getting better deals

“For me, managing my subscriptions is just managing my passwords so that I can log in to the things“

“I generally have my subscriptions on autopay which is kind of inconvenient. Well, on one hand they are paid timely, but on the other hand [...] I don’t necessarily [cancel them] when I should.”

“If you get a subscription, you put the term in, the day it expires and the app pops up a month ahead saying ‘This is due for renewal. Do you want it?’”

“I’m worried [about giving banking information to apps], but my spouse was the one that signed up in the end.”

“Sometimes I look at iPhone settings [to see subscriptions], but I don’t use it very often because it’s not comprehensive.”

“Sometimes we have accounts that we could be sharing but no one is aware that another person already has an account to the same subscription.”

“[When the intro offer about to expire], I try to call them up and saying ‘I want to cancel my introductory offer. What’s your next introductory offer.’”

Personas

In my interviews, many people expressed very similar ideas, especially over-paying for subscriptions. I knew a variation of this theme needed to go in each persona. From my screener survey I knew that most people have access to more subscriptions than they pay for. It made sense to have two personas: one sharer and one receiver.

Define

Key Insights from Research

Tools

Delayed Canceling

Unsubscribing

Duplicate Access

Negotiating Prices

Memberships

Tools people are using for subscription management are inadequate or laborious.

It usually takes a couple of months to cancel subscriptions they are no longer using.

People often don’t cancel introductory offers before they are billed the full price.

The experience of canceling a subscription can be very difficult or hard to find.

Sometimes, people sign up for subscriptions when they already have access either through family, a friend or through a service provider (i.e. included in phone or cable plan)

People negotiate lower prices for some subscriptions. There are intro offers that existing users can take advantage of.

People wonder if memberships that are meant to save money (Costco, Barnes and Nobel) are worth it.

Problem Statements

With these insights in mind, I was able to define the problem space by creating “How Might We” statements.

How might we...

...help people manage subscriptions in a quick and easy way?

...help people have an easier unsubscribing experience?

...help people communicate with their friends or family which apps they have access to?

...help people save money?

...prevent people from paying for apps they are no longer using?

...prevent people from paying the full price for apps after the introductory offer?

...help people calculate the price they pay for their money-saving membership is worth it?

...help people get the best price for the subscriptions they want?

Ideate

Once I defined the problems, I went to work brainstorming different solutions. I came up with 38 different ideas or features. In the end, I narrowed them down based on what would be the most useful and what was technologically possible.

User Journeys

Next, I created multiple user journeys to articulate what specific roles a user may inhabit and to keep the user at the center of the design process. I then prioritized them to determine the minimum viable product (MVP).

As a

new user

returning user

subscription owner (payer)

subscription receiver

I want to...

connect banking accounts and credit cards

unsubscribe from a subscription

be notified if subscriptions have changed their price

see trends in my subscription spending

share subscriptions with my family

add passwords and usernames to subscriptions I want to share

see the username and password of a subscription that was shared with me

so that...

I can quickly set up my account.

I can feel in control of my spending on subscriptions

I can save money

I can choose whether or not to renew

I can unsubscribe if it’s too expensive

I have a better understanding of my spending habits.

they can share subscriptions with me and to save them money.

Friends and family can access my subscriptions

I can access the subscription

Priority

Must have

Must have*

see all of my subscriptions in one place

be alerted when a subscription is about to renew

*For a competitive advantage

User Flows

Based on the user stories of the minimum viable product (MVP) and the site map, I assembled user flow diagrams to show how a user would complete their journey. Below is the key and then two of the five user flow diagrams.

Flow 1: User sets up SuSimple account and connects bank account

Flow 4: User sets up custom alerts

Click here to see all seven user flows in Miro.

Brand Identify

Before designing for user experience, I developed a brand identity with a company name, logo and some of the user interface style. According to the brief, the brand's personality is that it’s a trusted friend who’s helping users save money. Its attributes are: trustworthy, caring, friendly and casual.

Brand Identify

“Su” stands for “Subscription” and it resembles the word “so,” giving the feeling that this app will make it so simple to keep track of subscriptions. It’s an alliteration that is friendly and has a ring to it. The logo is a filled circle with a concave line. This white concave line is a smile that also mimics the lower quarter of the “S”s in SuSimple. The logo signifies three things:

The calmness and contentment the user will feel once they have their subscriptions under control.
The encouragement of the brand’s personality–the trusted friend who’s helping you save money.
It’s playful because subscriptions are meant to add joy, ease and entertainment to life.

Color

I chose a blue-purple as the primary color and blue as the secondary color because blue signifies trustworthiness and security and while purple signifies compassion, encouragement and wisdom–all traits of a friend who tries to help you save money.

I also took into consideration the color contrast so I could ensure the colors are accessible to a broad spectrum of levels of eyesight and color perception. The primary color has a color contrast of 4.77:1 against white. It's important that the lightest grey and the primary color to have a contrast ratio of at least 4.5:1. I made minor tweaks to the primary color and to Grey 1 until I got there. Based off of the primary color and the lightest grey, I chose four more greys, paying attention to their contrast ratio against the primary color, the secondary color or white, depending on what I thought the colors were going to be used for. These colors and the way that they are used pass at least WCAG AA standards, but in most cases pass WCAG AAA standards.

UI Elements

To be able to prototype rapidly, I used a UI kit from RusmirArnutovic.com and modified it to fit WCAG AA accessibility standards at a minimum and to fit SuSimple’s brand.

Prototyping

In order to start the prototyping process, it’s best for me to step away from the computer and start sketching with paper and pen. At the same time, I find that users have an easier time assessing a low-fidelity digital version rather than sketches. I knew I didn’t have time to sketch the entire app, then do wireframes. Instead, I sketched key screens using Crazy 8s, then crafted wireframes with the help of the Figma Brainstorming Kit by RusmirArnutovic.com.

Sketches

I used Crazy8s to sketch three key frames. Before sketching, I would note on the side what information could be portrayed in the sketches. Then, I set the timer for 8 minutes and sketched 8 screens.

Trends

Subscriptions

Trends

1/3

Wireframes

Below you will find Flow 1 and Flow 4, two of the seven userflows.

Flow 1: User sets up SuSimple account and connects bank account

Frames

Video

In the diagram of the userflow, I had the option for the user to log in to SuSimple using their Google account. However, I reconsidered that choice. Since the user has the option to link their bank account, they may not want Google or another large tech firm to have this information, especially considering the media coverage about how large tech firms are using people’s personal information. Therefore, in the wireframe, I didn’t include the option to sign in to SuSimple using their Google account.

Flow 4: Set up custom alerts

Frames

Usability Testing

I conducted the testing remotely on five subscription users in moderated usability studies. The goals of this usability testing were to determine barriers users encounter when they try to:

Create an account
Set custom alerts
Share subscriptions
Receive shared subscriptions
Get a sense of their own spending habits around subscriptions.

Evolution after Round 1: Highlights

I recorded each user testing session. After reviewing the recordings and taking notes, I found improvements that could be made. I’ll highlight two below.

Problem: Creating an account asks for too much information

Context

When creating an account, there are six text boxes to fill out, then users have the option to either link their bank account or manually set up information.

Problems

Some users found six text fields too much to set up an account.

Not everyone understood that there’s an option not to link a bank account. Also, there wasn’t an option to skip this step.

Solutions

I added the option to sign on with Google.

I deleted the need for a username

I separated the buttons to link a bank account and manual set up and gave a short description of each option.

I added the option to skip entering more information. The user does have the option to link bank accounts or manually enter in subscriptions later.

Before

Deleted username

After

Ability to sign in via Google

Separated and explained the two options

Added option to skip for now

Problem: Setting up Alerts