top of page
Bright Gradient

Subscription Tracking app

User Interviews -  Surveys - Persona - Sketch- User Interface- Prototype



Consumers love to subscribe to many memberships and services. How do they manage to fully utilize them?



Build an application that allows users to organize, prep to renew and cancel, and notify their abandoned subscriptions. 

More importantly, a tool to simplify user's life.

Building a brand new tool that resolve issues of managing multiple subscription services in our fast-paced digital world.



2 weeks / 2020


Adobe Illustrator, Adobe InDesign, Figma, Google Form, Google Slide, Miro, Trello

User Research

User Persona

A user persona is created to represent the goals and characteristics of users.

Here is Jenna, a tech-savvy living in Bay Area, Ca.




WhatsSub's Interview and survey reflect the common issues and pain points of what users are dealing with.


Users provided more in-depth thoughts about what they are dealing with, such as having too many subscriptions at a time


Jenny's persona is created to show her behavior in managing her subscriptions


Jenny's up and down emotion is shown in the journey map; She was happy when signing up a new subscription but very upset when figuring out how much money she spent on something she rarely used.


The Competitor Analysis showcased the strengths and weaknesses of our competitors. 

Value Proposition

The management app that keeps you in control of all of your subscriptions and helps you save time and money! View all of your subscriptions at a glance, schedule payments for the services you care about most, discover the best deals or promos on new or existing subscriptions, and effortlessly cancel the ones you don’t need.

Mission Statement

WhatSub simplifies your life and frees you from your worries about where your money goes.





The below sketchings display how smart notifications allow users to explore more options. This is the first visualization for trying out the ideas and iterating before settling on the layouts. 




Editable content

Digital Wireframe

Digital wireframes were created based on paper wireframes. However, the dashboard seemed to be static and card size occupied too much space.


Dashboard displays existing and expiring subscriptions all at a glance

New promotions and most popular subscriptions are available in Explore page


Product page in detail and call to action for subscriptions

Can't make any decisions right away? add them to the wish list and revisit them later

Lo-fi Prototyping

My lo-fi prototype displays how smart notifications allow users to explore more options. This is the first visualization for trying out the ideas and iterating before settling on the layouts. 


Task Flow - Due Date Tracker

A more in-depth task flow for the due date tracker

Guerilla Testing/ Prioritization Matrix

The prioritization matrix displays what features would be implemented.


The color logo is set, and black and white is for future dark mode development


Plugin Icons give users a standardized impression and User Interface.

Din Pro is chosen for representing a versatile, modern style San-serif with natural feeling.

UI Design

My task is to enhance the design with colors and fonts. We are inspired by macOS's light mode;  white background with simplicity.


Transitioning to Hi-fi Prototyping

It is getting closer to what the actual product is like. Visualization and Content are the keys.


Tutorial screen for a quick walkthrough​

A 5-step quick walkthrough prompts once launched. Users can quit or relaunch it anytime.


Usability Testing

I tested with 2 users for task flows:

1. Onboarding

2. Add a new subscription

3. Place a subscription to the waste bin

Final Prototype

A clickable with a fully UI implemented final prototype is ready


Research is fundamental. It is essential to start from a user's point of review and 

don't start with any assumptions.

Multiple problems in the app cannot be resolved at once. It takes step by step to address all the problems.

Working with a team of 5 was such an experience. We bounced ideas over and over and learned how to stay focused and compensate for each other's flaws.

More ideas were referenced and mentioned. Even though the final prototype did not represent all the features or ideas we came up with, it was still quite an accomplishment.

What's Next?

Conduct a Usability Test to identify any post-launched issues.

Collaborate with front-end developers.

Conduct more interviews and surveys, and listen to user's feedbacks and expectations.

bottom of page