
Subscription management made easy
SubsEase
Simplify users’ subscriptions with a mobile solution
SubsEase offers a service that enables users to monitor all their subscription fees for websites, apps, and services throughout the year. However, the company's current website is only compatible with desktops and lacks mobile compatibility. Consequently, SubsEase aims to develop a mobile version of its product to broaden its audience.
Highlights:
Utilized user research to determine the information priority
Created a user-friendly data tracking dashboard and system that is visually engaging with intuitive data visualization
Role
Solo UX designer
Tools
Figma, Protopie
Timeline
April 2023 to May 2023
3 main issues that we need to address
The company has identified three user stories to achieve its business goals. These are the initial challenges that I need to address in order to figure out the solutions.
Provide users with a holistic view of their subscriptions
As a current user, I want to see all of my subscriptions in one place so that I can get a comprehensive view of my spending on subscriptions.
Enable users to easily unsubscribe from subscriptions
As a returning user, I want to unsubscribe from a subscription easily so that I can reduce needless spending.
Remind users the upcoming bills before auto-renew
As a consumer, I want to be notified if any of my subscriptions are about to be auto-renewed so that I can make a decision about if I want to renew or not.
What users are saying?
After clarifying the initial problems, I further conducted 5 user interviews to learn about how to design a better solution that meets the users’ needs. Since this is a data-tracking application and the amount of various data is large, the most important problem for me is to figure out what is the most important information for users and how I should present information to users in a clear and organized manner, highlighting key points and maintaining a logical hierarchy.
What is critical information for users?
“I want to know how much I spend in total each month instead of knowing how much I need to pay when every bill renews.“
— User S.
“The most important information for me is how much I spend the money on different categories of subscriptions, such as working software or entertainment subscriptions.“
— User Z.
How to decide the information hierarchy for users?
“The most important information is how much I should pay for this month. It’s also good to know how much I will pay for the following months.“
— User X.
“I hope to see the upcoming bills in the first page so that I can track them easily with the App.“
— User S.
How to make the interface easy for users?
“I don’t want to see a lot of forms or simple texts there. I hope the visualization is easy to understand.“
— User S.
“I hope the subscriptions can be categorized with different colors so that I can identify them with a glance of view.“
— User S.
How do Competitors solve the problems?
Mapping the user flows
Creating the low-fidelity prototype & conducting the 1st round of usability testing
Refine the design after the 2nd round of usability testing
Key function 1: A holistic way to view subscription
Upon launching the app, users will be directed to the home page, featuring three panels: the chart panel, watchlist panel, and full subscription list. This layout allows users to efficiently track key information related to their subscriptions.
Key function 2: Stop a subscription
Upon launching the app, users will be directed to the home page, featuring three panels: the chart panel, watchlist panel, and full subscription list. This layout allows users to efficiently track key information related to their subscriptions.
Flow 2:
Review the spending for entertainment and cancel one subscription temporarily
The summary feature: Users can view the subscription summary here by month, season, or year so that they can know how much they will spend in different categories for each month, season, or year if they do not unsubscribe from any subscription.
Unsubscribe: Users can type “unsubscribe from the website” to land on the subscription website to cancel one subscription. After typing this button, they will be asked if they want to move the subscription to the archive list in this app to pause calculating the spending and keep the account history.
Red route 3:
Being notified when a subscription is about to be due
Set an alert and receive notification: When users add a new subscription to this App, they can set an alert for it. Also, they can later set an alter in the detail information screen for each subscription. They will receive a notification from their app as the alert time comes.
View the upcoming bill on a calendar: Users can use the Calendar feature to view the due dates of their bills. The bills on their watchlist are marked with a bright green color and the regular bills are gray, so that they will be guided to notice the most important pieces of information for them right now.
What do my users think?
8.25/10
This App provides a comprehensive view of the subscription spending
7.8/10
This App helps me unsubscribe from a needless subscription to reduce spending
9.4/10
The App notifies me of upcoming subscription renewals, allowing for informed decision-making.
What have I learned?
Stay focus on crucial problems instead of adding cool features
Despite receiving feedback from users during interviews regarding the addition of "cool" features, I acknowledge that I cannot address every possible issue and must prioritize the most pressing ones. This approach allows me to efficiently identify and refine solutions with each iteration. As a result, my current feature set may not be the most extensive, but it functions well and receives high ratings from users.
Avoid adding too many colors and styles for icons
Initially, I utilized several colors in my high-fidelity prototype, such as red for warning, yellow for alarm, and yellow-green for highlighting. However, during user testing, three out of five participants expressed feeling overwhelmed by the abundance of information presented. Upon reflection, I decided to reduce the number of colors used and opted to designate green as the primary color, with additional colors only utilized for distinguishing different subscription types. This approach not only resulted in a more visually appealing interface but also improved user-friendliness.
Make the outcome of every action super clear for users to comprehend
My original design for canceling subscriptions was well-received by some users, but half of them found the "Remove" button to be misleading. They were concerned that if they clicked it and the money continued to be deducted, they would lose trust in the app and never use it again. This was a valuable lesson for me, and I have since revised the design to make it clearer, using the phrase "Remove from the app." Users have expressed that this makes the cancellation process more transparent and they feel more confident in using the app. I realized that it is essential to ensure that every action a user takes is easily comprehensible to prevent confusion and promote a seamless user experience.