top of page
Bright Gradient

Subscription Tracking app

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

Problem

 

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

Goal

 

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.

whatsub_mockup.png

Timeline

2 weeks / 2020

Tools

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.

Ideate

Phototype

 

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

whatsub_survey.png

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

whatsub_interview.png
whatsub_persona.png

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

Whatsub_journeymap.png

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.

Whatsub_CA.png

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.

whatsub_sketches.png

Sketches

 

 

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. 

Whatsub_DWF.png

Dashboard

Explore

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.

Phototype

Dashboard displays existing and expiring subscriptions all at a glance

New promotions and most popular subscriptions are available in Explore page

whatsub_lofi.png

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. 

whatsub_lofi_taskflow.png

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.

Whatsub_matrix.png

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

Whatsub_styleguide.png

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.

whatsub_test_iterate.png

Transitioning to Hi-fi Prototyping

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

whatsub_tutorial.png

Tutorial screen for a quick walkthrough​

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

Whatsub_testing1.png
Whatsub_testing2.png
Whatsub_testing3.png

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

Conclusion

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