Subscription Tracking Competitors
Sarah Jackson - SEliz21
UX designer
SubScripter
Mobile App for Subscription Tracking Website
SubScripter - A Subscription Tracking App
A startup company with an existing website wanted a mobile app that would provide the ability for users to complete 3 essential tasks not previously included on their website.
For users to see all of their subscriptions in one place.
For returning users to have the ability to unsubscribe from a subscription.
For users to be notified of any subscriptions about to be auto-renewed.
My Process
Research
Competitive Analysis
Affinity Mapping
Personas
User Stories
IA
Wireframes
High Fidelity
Mockups
Branding
Visual/UI Design
Prototyping
Remote User Testing
Discover
As a UX/UI Designer for the company, I needed to understand the goals provided by the company and come up with possible solutions that align with both the company and user goals. This meant:
Identifying and coming up with possible solutions for the business’s goals provided by the company.
Looking at major competitor websites to see what they provide for their users.
Main Competitor
Using Truebill as my main example source, because it seemed to provide some better user reviews, I continued on!
Issue #1
Give current users the ability to see all of their subscriptions in one place so they can get a comprehensive view of their spending on subscriptions.
Notice How Truebill
Offers a lot of information to its users.
Subscriptions are all in one place on their website, but if shown on a mobile app, it would be cluttered with too much information for one screen.
SubScripter's Solution
Is minimalistic with a clean font that has softer edges.
Adds distinction between transactions via drop shadows for softening.
Uses shades of darker colors to soften the overall look.
Issue #2
Provide the ability for returning users to unsubscribe from a subscription so that they can reduce needless spending.
Truebill Recurring Transactions Overview
Tends to Overwhelm
While I really like how consistently intuitive Truebill is throughout their website, again, for a mobile app it would be difficult to provide so much information without overwhelming the user.
Truebill Cancellation Failure
Cancellation Frustrations
The biggest complaint I had with Truebill, was that most of the subscriptions I tried to cancel through their website, didn’t allow me to do so, being told that I needed to cancel through the company website for the subscription I was trying to cancel which was frustrating.
SubScripter's Solution
To remedy this issue, SubScripter
Only provides the option to cancel via the app if the option is available so it’s not misleading to the user.
Once a cancellation is requested, the user is further advised to be on the lookout for a confirmation email and given a number to contact if the email is not received within 24 hours.
SubScripter Issue #2 Solutions
Issue #3
Consumers are to be notified of any subscriptions about to be auto-renewed so the user can decide whether they want to renew the subscription and continue spending money.
Truebill's Alerts & Notifications
Truebill's Alerts & Emails
Truebill sends out emails along with a small red notification alert to catch the user’s attention when they’re in their account. They’ve also provided the ability to turn on or off all notifications as well through the user’s account settings page.
SubScripter's Solutions
While I like the ability to turn off notifications via a settings page, I’ve found through user testing that users benefit from being able to be selective in which notifications they receive from specific apps and don’t necessarily need or want reminders of all of their subscription renewals.
SubScripter's Issue #3 Solutions
Keeping This In Mind
I created 2 settings pages: General and Subscription settings, allowing users to turn on or off notifications for some subscriptions while allowing other notifications to still get through to the user.
I included bold, red text showing the subscription renewal coming up soon when users are viewing all of their subscriptions.
In addition, if cancellation via SubScripter isn’t available directly, SubScripter provides a link that takes the user directly to the cancellation page for the subscription.
My Process & Key Phases
I typically begin my process with a survey to verify that I’m keeping the right mindset and goals of the user. Then, based on the business goals and findings from the surveys, I create wire-frames with a quick user testing of a prototype.
SubScripter Design Brand Guide Moodboard Page
1st Round Down!
After the first round of user testing with the wire-frames, I begin adding more creativity and style to the app. Keeping the business’s goals as the main focus, creating a mood board and design brand guide for each project I work on really helps me keep the company goals in mind and stay consistent when deciding on the colors, fonts, and overall design attributes I’ll be using.
For SubScripter, I included the company attributes that were provided in the assignment and went from there to create a complete mood board.
SubScripter Fonts & Color Palette
Keeping the Classics
With the company stated target user being middle class, at least 30 years of age or more, using a phone and desktop equally, and trying to be more budget-conscious, I wanted to keep the color scheme and theme simple with a classic look similar to that of a modern 50’s look. This meant softer font choices in hues of black, grey, and white with a dash of a soft, but bold red to draw attention to alerts or notifications.
Next ~ Planning
I drew up a quick plan for the rest, finding it helpful to be flexible on time frames and dates to include human factors.
High-Fidelity Mock-ups & Prototyping
One of the main goals was to keep a clean and simple, but intuitive layout and design.
Final Testing & Results
Aside from one or two small revisions after another round of user testing, I ended up with an app clean, simple, and inviting while intriguing and intuitive in layout and design.
What I learned from this project is
Complexities can always be simplified by breaking them into as many pieces as needed.