Overview
This is the story of Subeefy. A Subscription management App made during a Design Sprint of 5 days. I was lucky enough to be part of a team of 4 talented designers and researchers. Below is more details about our journey!
My Role
UI Design
UX Design
Art Direction
Problem
In today’s booming Subscription Economy, 66% of Americans juggle multiple subscription services, from TV streaming platforms like Netflix or Hulu, e-commerce sites like Amazon, and even meal delivery boxes like Freshly or Blue Apron.
Keeping track of all these subscriptions, costs, and renewal cycles can be a real challenge, and 84% of subscribers vastly underestimate how much money they spend on these service.
Challenge
We wanted to develop a solution that would help people understand the total costs of their subscriptions, while also giving them a platform to manage all of those subscriptions in one place.
Understand the problem
Our team of four began by brainstorming all possible challenges that people have with subscription management. We also conducted a survey with our potential audience to understand their use of and frustrations with subscription management.
Persona
Based on the survey data, we created personas to highlight various user backgrounds and needs. We summarized the critical needs we identified into a hypothesis statement for our app.
Subscribers want a comprehensive platform to view and manage their overall subscriptions but can’t because every app has its own distinct method to subscribe and pay.
User Flow Mapping
We listed our expectations about what the app would be able to do, including a list of questions to keep in mind throughout the sprint. Based on the key items to include in our app, we started mapping out how subscribers would navigate through the platform to successfully manage their services.
We generated some “How Might We…” statements and used affinity diagramming to group our thoughts and questions. Using dots, we voted to determine which questions in each group were most critical to keep in mind as we went through the app development.
Ideate & Sketch
Before we could start sketching, we needed to do some market research to identify the most useful features within existing apps. We spent some time conducting this market analysis and took notes on features that we wanted to consider for our own app.
Information Architecture
We started first to organise the content in a way that is effective and efficient for the users. We created a detailed user flow to show all the possible pages and steps that users could take in our app.
From all the solutions we all had, we took the best one and each worked on sketching 8 variations of our app’s pages in 8 minutes as a Crazy 8s!
Decide & Storyboard
As it turned out at this point, we had all sketched different pages of the app – so we were able to identify key features that we liked about different pages, but we were also able to combine our sketches into a more complete prototype. As usual, we used dot voting to pick out the features of each sketch that we liked, and discussed areas where our designs could be improved. After dot voting, the Decider selected one screen that was deemed the most critical for inclusion.
I started sketching a storyboard based on the journey that the user would make when using the app for the first time.
Prototype
We then conducted a usability test with 5 target audience that we recruited for the sake of getting the best result and make sure that the elements on the screens was easy for them to user and understand. We used Whimsical to build the Low fidelity Wireframe
Iterate & Test
The final phase arrived! I created the high-fidelity prototype in Figma with the help of a teammate, I started by creating the Brand Guideline of the app and the overall style.
We finished the high fidelity prototype and we now had to test it. The four of us each tested the new prototype ourselves, and also recruited testers external to our team. After receiving comments from each other and external testers, we spent the day making iterative improvements and re-testing. By the end of the day we had a polished product that we were proud of!
Use the slider below to see the final product
Below is an Interactive version for you to test and see the live Figma prototype in action.
What I’ve learned
The biggest challenge for this project was that we worked as a remote team on three different time zones, which meant that we had to be flexible with working hours and diligent about assigning specific tasks that we could work on independently.
Communication is a an important part in the success of the project, It’s also important to work with the right people that have the right mindsets and complement each others to achieve great results.
The next part of the project will surely be the development of the platform it self. We decided to add some features like the ability to subscribe / unsubscribe services right inside the app, using an API as well as scan and synchronize all the user’s subscriptions using emails and not payment methods.
I would like to thank all the collaborators for their amazing respective jobs done on this project, Thanks to Aaron Nguyen, Raghurai kulkarni and Charlotte Newman