SubTrack: Creating an End-to-End Application
Overview
Challenge: There are a lot of banking/budgeting/subscription tracking apps that provide a multitude of services, one of the lesser services being subscription tracking. There are apps that solely focus on tracking subscriptions however, they all require users to manually enter all their existing subscriptions. A key motivator in having a subscription tracking app, is for the app to flag any subscriptions the user might have overlooked or forgotten about. When having to manually enter subscriptions, this overlooks the possibility of forgotten subscriptions.
Solution: A single feature app that tracks users subscriptions, showing detailed insights of payment method, subscription expiry date, subscription price, and payment cycle. The app will require account sign up as the user syncs their credit cards/ debit cards in order to automatically identify any subscriptions.
Project Goals:
Design an end to end application focusing on an MVP
Create and present a case study outlining the creation process
User test & iterate
User Interviews
User interviews were conducted in order to test the initial product and observe what aspects of the user flow worked and what did not. Where blockers occurred, what features users thought were necessary vs. a nice touch.
Results:
4/4 participants have at least 2 subscriptions
2/4 participants don’t currently have a way of tracking subscriptions
Other 2 participants track subscriptions not with specific subscription tracking apps
3/4 participants would want an app that just tracks subscriptions
4/4 participants noted wanting a simple and single use app
4/4 participants say they would want the app to sync to their bank account/ credit cards to automatically pull in all subscriptions
3/4 participants want the ability to categorize subscriptions
4/4 participants want to have graphic data visualization
Required features (as stated by participants):
Cashback/promotional incentive
Ability to cancel subscriptions through the app
Show what card is charged for each subscription
Shows how much user owes per subscription
Provides suggestions on how to lower subscription costs
Payment options through the app
Renewal dates
Feature Roadmap
Based upon user research a feature roadmap was created to determine which features were considered necessary vs could be implemented in later deployments. It was imperative to determine which features were necessary without trying to overcompensate and add as many features as possible. A successful product is one that identifies a gap in user needs and solves that need in an efficient and easy manner. The detriment in today’s society is the continuous push for evolving and adding to apps in order to “stay up on the latest trends.” By categorizing which features were necessary vs a nice add on, it helped to ensure the intent of the app is not diluted by unnecessary features.
1. Must have features:
Filter - allow users to filter subscriptions by “due first” or “due last”
Auto-syncing to bank/credit card - app will automatically pull all subscriptions
Add subscription - allows users to manually add subscriptions that might have gotten missed in auto-sync
Subscription categorization - organize subscriptions based upon categories (entertainment, lifestyle, productivity, etc)
Upcoming payment notifications
Cancelling subscription via app
Payment in app
2. Nice to have features:
Dashboard graphics: illustrates subscription categories that have been costing the most
3. Surprising & delightful
Promotions: incentives for users to use the subscription tracking app (similar to credit card rewards)
4. Can come later
Auto cancellation: App cancels subscriptions for you
Ideal User Persona
After completing user interviews I felt it was imperative to determine the ideal user persona, as this would help to define the intent of the app and ensure it fulfills the needs it was created for without straying too far from the initial intent in an attempt to appeal to all potential users. The saying “A master of all is a master of none” is something I remind myself of constantly when working on features, apps, or ideas.
User Flow
After defining the ideal user persona, it was imperative to determine what problem SubTrack is trying to solve and how a user would go about navigating the app to reach their end goal. To help understand the steps that would need to be taken, a user flow map was developed with three tasks in mind:
Pay a subscription
Cancel an existing subscription
Add a new subscription
Site Map
After determining the intent and goals of the app it was time to develop the layout of the mobile app. What screens there would be, how each screen would be accessed, and what pages were on the bottom nav. Having the user flow already determined helped to understand the natural flow through which a user might try to access various pages. The intent was to mitigate the number of interactions and screens a user would have to navigate to get to their end goal, while also ensuring the information hierarchy and structure of the app made sense and was easy to navigate.
Branding & Logo Design
Competitor research of other financial apps determined that a majority of companies in the Fin-Tech space had a very simple, geometric, yet distinctive logo. Usually with two distinct colors and a third color that marries the other two together.
Another important component was determining the color palette. Based upon color theory research, blue and purple were chosen as the primary colors based upon what they convey to users. Blue was chosen due to its association with security and trust. Purple was chosen for its associations to wealth. Both of these are sentiments and definitions that align with an app based around saving and tracking money.
Blue = loyalty, dependability, trust, security, logic, melancholy, calm, soothing, authoritative, and trustworthy
Purple = luxury, wisdom, wealth, sophistication, honor, courage, bravery
Sign Up & Payment Input
A secure sign in process where new users are able to sync credit and debit cards to their user profile. The app will automatically identify any re-occurring payments.
Subscription Management
A sleek and efficient home screen that categorically lists all subscriptions as well as a visual representation of the breakdown in subscriptions.
Clicking into a subscription allows the user to look at more advanced details of each subscription as well as set up payment options or cancel a subscription. Subscriptions can be filtered based upon various preferences.
User Testing
Participants were asked to complete two tasks:
On the home screen navigate to your Spotify subscription and make a payment.
Add a new Netflix subscription.
Participants were observed via screen share as they navigated each of the requested tasks, noting down how each participant chose to initially log in/sign up, how the participants navigated the tasks, their success with completing the tasks, and their success with navigating to and from the sub screens.
Task One:
4/4 participants successfully navigated to the Spotify details screen via the “Details” button.
3/4 participants successfully navigated the “Pay” button.
4th participant first tried clicking the “Edit” button but then was successful.
4/4 participants successfully confirmed their payment.
4/4 participants struggled to close the payment screen once the task was complete by trying to click the “Edit” button rather than the back arrow. (Noted this down for iteration).
Task Two:
4/4 participants successfully navigated to the “+” icon to add a new subscription.
2/4 participants got stuck for a few seconds on the subscriptions screen trying to locate the “Netflix subscription”. Took them a minute to notice the “Popular” tab vs the “All” tab. (Noted this as a point of iteration).
Once on the Netflix add new subscription screen, all participants struggled to confirm and close the add new subscription screen once the task was complete by trying to click the “Add” button rather than the back arrow. (Noted this down for iteration).
Before & After
Based upon user testing feedback, iterations were made to make the app more usable and clear.
