Designing a Subscription Management App, Subskeep— a UX Case Study

Subskeep, Keep your Subscriptions efficiently.
Subskeep

Subskeep is a mobile application that manages your media subscriptions more efficiently by providing an end-to-end experience — from the moment you subscribe till the day you cancel. I mainly contributed to the branding, problem-solving, user ideations, wireframing, UI designs and prototyping aspects of the project.

now it’s really about access as the new imperative.

ㅡ Tien Tzuo, Zoura

Background.

The Subscription Economy has been grown every year.

‘Subscription’ is a business model in which a customer must pay a recurring price at a regular interval to access a certain product or service. From a company’s perspective, the ‘Subscription process’ allows constant and stable financial benefits, as well as data and information upon the media that will contribute to creating new services or plans for the future.

On the other hand, consumers tend to seek for alternative ways that could benefit them financially. The process of ‘Subscription’ builds an efficient connection between the two perspectives which provides a profitable deal for both companies and consumers.

The subscription market has been increasing every year in various industries including E-commerce, music, video streaming, and utility. As the business era of subscriptions is slowly emerging, the consumers need a way to efficiently manage and organize their consumption in subscribing to a media.

Research.

User Survey

To seek the user’s opinions and problems about the subscription process, I conducted a survey that targets 50 people who are actively using the subscription services. The main goal of the research is to understand the goals, motivations, and pain points of the users within their services as well as resolving any problems by designing a better solution for them.

What is the current subscribing experience?

Through the survey, we were able to analyze the current subscription experience of the users:

1. Consumers subscribe to two or three paid subscription services on average (85%)

2. Users tend to check their repayment date through bank accounts or text messages. (78%)

3. The user’s decision upon keeping their subscription or canceling is mostly depended on their spending. (70%)

4. Users miss the appropriate period to cancel their subscription because they tend to forget the date of their payment. (54%)

5. Consumers tend to find the cancellation process difficult and have a hard time finding the cancellation button. (86%)

Insight.

Problems

1. The list of subscribing services is scattered, so they can’t see and manage at a glance.

2. Consumers have difficulties in exploring new subscriptions and comparing them with other services.

3. It is difficult for the users to be notified of the billing period of their subscription and keep in control of their spending.

Solutions

1. Manage and compare subscriptions efficiently in a glance — keep in control of the spending and explore new services.

2. Provide an end-to-end experience: from subscription to cancellation

3. Remind people of the billing cycle due date in advance.

Key Features

With the solutions above, we articulated and simplified Subskeep’s main features of providing convenient subscription management service through simply designed visual lay-outs and end-to-end services from the start of the subscription until the end.

Key Feature — End-to-End Experience

Ideation.

User Persona

Based on the generative user research I gathered, I created two user personas that capture the essence of my target users. Meet Dan and Naria.

The purpose of this user persona is to compare and contrast the two main features of the subscription process: the subscription and the cancellation. The two personas were individually situated in contrasting environments. Dan’s case will demonstrate a subscriber’s perspective, and Naria’s case will be displaying the situation of canceling a subscription without Subskeep.

User Persona

User Journey

By creating a journey map of the personas, I wanted to visualize the feelings and the behaviors of the users that are trying to accomplish their goals without using a subscription managing application.

In the case of Dan, it establishes the process of searching for new media to subscribe to. On the other hand, Naria’s case was created to distinctly display the cancellation process without the application. Through the two persona’s cases, I was able to identify that consumers tend to find inconvenience in subscribing and unsubscribing procedures. The journeys of the two users demonstrated that the problem with the progressions was due to the absence of an ‘end-to-end experience’, and therefore, I designed a plan to resolve this difficulty.

User Journey

User Flow

To display the most ideal and user-satisfactory experience in the two consumer’s situations, user-focused flows were generated given that Dan and Naria were able to utilize Subskeep to organize their subscriptions. Through this virtual flow, the user’s experiences were established as an essential feature within the app.

Through Dan’s flow, I provided a system that will allow the users to search for new subscription services, as well as reminders that will notify the statistics and the repayment date of the current subscriptions. Based on the process of canceling Naria’s service, we provided a ‘canceling guide’ to distinctly direct the consumers to unsubscribe to any media with ease.

User Flow

Site Map & IA

I created a sitemap that will portray more details of the user’s journeys upon 5 main stages: Onboarding, Home, Subscriptions, Stats and Discover. While building the sitemap, I took into consideration all the researches I have gathered, including user personas, journeys, and flows. This process contributed to justifying the structure of my information architecture and showing how my primary features should be mapped out.

Lo-Fi Wireframe

Firstly, we gathered our individual ideas upon the service and the UIs through sketches and wireframes. Through multiple sessions, we combined these different ideas and designed the main UI.

Ideation Session

Hi-Fi Wireframe

We created a Hi-Fi Wireframe based on the Lo-Fi designs and indicated the overall flow to grasp a connection between each section. This wireframe helped us to seek for a few flaws on the initial Lo-Fi plan. Whenever such flaws were discovered, we tried to view this matter from the users’ perspectives so that we can provide a more consumer-friendly design.

Hi-Fi Wireframe

Design.

Let’s get started!

The Onboarding procedure will guide you to start with creating an account while explaining the key features and methods upon how to use this app. You can easily sign up through the onboarding flow or log in through your favorite social media accounts such as Facebook and Google.

Onboarding

Scanning your phone

When you use Subskeep for the first time, it will automatically scan your phone and gather a list of applications and media that you are currently subscribed to. You can simply just add whatever else you are subscribed to as well.

Scanning :)

All your subscriptions in a glance

We know that your subscription payments are divided into a yearly and monthly basis. Therefore, we divided the tabs in two so that you can observe more information about your subscriptions with ease. We will also notify you of the next repayment date.

Home Screen

Remind Me.

You don’t have to be afraid of forgetting your payment dates. Rely on us to remind you about your repayment date in advance.

Reminding Notification

Gain insight from the Stats.

Keep in check of your monthly and yearly spending habits so you can be more efficient with your expenditures. Subskeep will provide the statistics of the media by categories of services and your total spending upon different accounts.

Stats

Browse and Subscribe to Different Services.

If you are looking for a new service to subscribe to, you can compare them to your current service plans. We will find and connect you to more efficient service for you to subscribe.

Canceling Guide

If you wish to unsubscribe to any of your services, we will ease that process for you through a ‘Cancelling guide’. The guide will simplify your canceling process by showing you how to unsubscribe to your current services.

Search and Customize.

You can search for any other services/applications within our app. If we don’t have the app that you need, you can always add the services and their information (such as names, plans, icons, categories and etc.) and freely customize your collection of services.

Design System.

Overall while designing Subskeep, I’ve used a design system for an effective working process and consistent context of the brand story. I’ve categorized and labeled all components by referring to Google Material Guides and the features we’re defining. These components could be consistently developed and will produce another significant one that fits for the better user experience.

Design System

Prototype.

I’ve created a clickable prototype via Marvel so we could receive users’ feedback instantly. Through this prototype, we’ve asked some users to give us any feedback on this app. We were able to figure out the actual users’ flow when they explore this app and find that there were a few flaws in the process of searching and exploring subscriptions. Therefore, we were able to decide what should be developed in the next step.

Prototype

What I’ve Learnt.

While researching the market to start this project, I realized that a lot of people have already recognized the need for subscription management apps and have created various projects. For me, the biggest concern was to consider how it should be differentiated amongst the countless services. After careful consideration, the project was launched with the aim of providing users with an end-to-end experience that connects the entire exploration-subscription-unsubscription process in line with the subscription economy.

Although I’ve been working on a variety of graphic UI-oriented tasks, it was the first personal project in the form of case studies to design and prototype in logical steps. It was very interesting to specifically set the Persona according to market changes and needs. In addition, I was able to solve the inconvenience in the user’s journey and articulate it into the main features. I’ve also learned to design the UI based on the user while excluding unnecessary factors. Furthermore, the design systems were also applied in this project, enabling efficient component-based design. It’s a shame that we didn’t implement it as a real app, but we were able to do some usability tests while receiving feedback from a clickable prototype. I will constantly develop this project so that it can be launched publicly in the future.

** Update: Luckily our app has found a skillful and enthusiastic developer and it’s preparing its way out to the world. :)

Thank you for reading my article :). I will really appreciate any comments and feedback below or just feel free to contact me via hello@vivishin.com.

You can also find me @ http://vivishin.com/work/subskeep

Digital Product Designer in Sydney 🇦🇺 www.vivishin.com