Subtrac.

Making subscription tracking less of a hassle

Introduction

Overview

In recent years, more companies have been adopting the subscription-based business model, ranging from video and music streaming services, cloud storage services to e-commerce and even telco plans. As of 2019, according to Forbes, an average American subscribes to 3.4 video streaming services alone. It can already get overwhelming just tracking our daily expenses, much less keep track of the subscriptions we have. We usually only see money getting deducted from our bank accounts, sometimes even for services/products we no longer need.

Subtrac. is a conceptual project with the objective of making the tracking of subscriptions simpler and more convenient.​​​​​​​

Role and Scope

This was a solo project.

Role: User research, wireframing, prototyping and UI design

Timeline: 2 weeks

Platform: iOS mobile app

The Process

5 Stages of Design Thinking. Credit: uxdesign.cc

Empathise

User research was conducted to find out if the tracking of subscription plans is indeed a problem. For the research methodology, user surveys were conducted with current subscribers of different services and the results were analysed afterwards.

Define

A problem statement was defined after the analysis of the findings from the survey. This served as a guideline to aid in the brainstorming of solutions in the ideation stage.

Ideate

Initial brainstorming of the solution was done with sketching and followed by mid-fi wireframing using Figma.

Prototype

The mid-fi wireframes were made into prototypes, which were used in the testing stage for usability testing.

Test

Usability testing was conducted with a few users to gather feedback on the initial designs. Further design iterations were done afterwards, with the addition of UI elements for the creation of the final deigns.

User Research

User Survey

I conducted a user survey with 30 respondents across a few days. The objectives are listed below:

  • Find out whether the tracking of subscription plans is a challenge

  • Find out how people are keeping track of their recurring payments

  • Get to know the features that people are more concerned of when they are managing their subscriptions and payments

The survey questions consisted of a mix of multiple choice questions and free response questions.

Findings

Finding #1: Bulk of the respondents are unsure of how much they are spending on their subscriptions

Most respondents only vaguely know how much they are spending, if not, are not aware of their spending at all.

Finding #2: More than half of the respondents have encountered instances where they forgot to cancel a subscription plan that they didn’t need anymore

Some comments given by respondents on the challenges they face when tracking their subscription plans

Finding #3: The challenge of keeping track of subscription is often associated with the lack of notification from the products/services on the date of renewal/when the renewal date is nearing.

Finding #4: Respondents that track their subscription payments usually do it by memory or by checking their emails

Finding #5: Receiving notifications on payment dates and knowing which cards/bank accounts the money is getting deducted from are important

The Problem

From the findings, there are a few pain points that users face when they are keeping track of their subscription plans:

  • Keeping track of subscription plans is a challenge, particularly when it comes to knowing how much all these recurring payments amount to, and knowing the date of renewal of subscription plans (due to the lack of notifications sent from the products/services).

  • It is not uncommon for users to forget about subscription plans that they no longer need, and this can lead to unnecessary money being spent.

  • It might be difficult for users to recall or remember which credit cards or bank accounts are linked to a particular subscription plan.

Problem Statement

From the above pain points, a problem statement can be defined:

How might we design a product that helps users track subscriptions better?

User Personas

Ideation

Solution

Following the findings and pain points, I centered my app design on a few features:

  • Option to set reminders and notifications when subscription dates are nearing renewal so that users will not forget about any services that they no longer need.

  • Total spending on the subscription plans for a particular month to allow users to take note of their expenses better.

  • An overview of the billing dates of the subscription plans and indication of which credit cards or bank accounts are used for easier tracking of recurring payments.

  • Folders for users to organise their subscriptions according to categories of their choice.

Initial Sketches

I begun brainstorming for the app design with some sketches. I also decided to name the app Subtrac., which is a wordplay on “subtract”, “subs” (short form for subscriptions) and “track”.

Wireframes

Mid-fi wireframes were then created to plan out the navigation flow of the solution and visual hierarchy of elements. Since Subtrac. is primarily a utility app, I made sure to minimise the number of screens needed for each process — adding a new subscription, tracking the total expenses and organising the subscription plans.

Wireframes showing the navigation flow of Adding New Subscriptions, Checking Total Expenses and Managing Categories in the app

Prototype & Test

Usability Testing

With the wireframes, I created a prototype and invited 5 users to test out the design. The users were asked to perform simple tasks like adding new subscriptions, adding a new folder/category and accessing the Chart View to track total expenses. The prototype can be accessed here.

Findings

  • All users were able to add new subscription plans without trouble and found the process straightforward and intuitive

  • All users were able to access the Categories tab and add a new category

  • 4/5 users had trouble finding the Chart View option and were unsure what the icon meant before they tapped on it

Improvements to be made

As the Chart View is not a common concept/design, the use of onboarding screens that highlight the key features of the app can be useful. This can serve as a guide to inform users of the features.

Final Design

After further design iterations, the final designs were created, along with a style guide, mockups and final prototype. The prototype can be viewed here.

Key screens for Homepage, Chart View, Add New Subscription, Categories and Settings

 

For the UI design, I drew inspiration from current expenses tracking apps and Dribbble, and also created a mood board. For the colour palette, I decided to use purple as the main colour as it symbolises wealth.

Moodboard for UI inspiration

Style guide for Subtrac.

 

I also designed a few screens for onboarding, to introduce and highlight the key features of Subtrac.

  • Easy tracking of subscription billing dates

  • Receiving notifications once renewal dates are near

  • Indication of payment methods that are used for each subscription and track total spending

  • Ability to organise subscriptions into different categories

Onboarding screens

Conclusion

Project Review

Looking back at the personas' pain points and usability testing results, the key features of Subtrac. can potentially help users overcome the challenges faced when tracking their subscriptions:

  • Straightforward adding and tracking of subscription plans — billing dates, billing cycles and payment methods.

  • Chart View allows the easy tracking of expenses for the month.

  • The option of setting up notifications when renewal dates are near allows users to keep up to date on their subscriptions and decreases the chance of forgetting to cancel plans they no longer need.

What did I learn?

This project was my first solo project, which means that I had to juggle between different roles and also make sure I do them well. Conducting the usability test was a challenge as we are in the midst of a pandemic and many restrictions were in place. However, I managed to overcome it through the use of tools like Zoom, that allowed me to still observe my users while they try out the prototype. All in all, this project provided me with new learning experiences like conducting testing remotely, exploring new design concepts and creating UI designs from scratch.

Next Steps

Any design, no matter how good, will require several design iterations. For Subtrac., I am intending to develop it into an app in the future, for users to manage and track their subscription plans. I am also planning to put the design through further iterations to improve it and ensure the app truly meets user needs.​​​​​​​

Previous
Previous

Ethical Merchants

Next
Next

Daily UI Challenges - A Compilation