Redesigning Cultpass flow from the Cult.fit app for better conversions
I recently participated in 48 hours designathon. Wondering what designathon is? (Design + hackathon) I like to call it a designathon 😄. The Desingathon was organized by our mentor, Anudeep Ayyagari. We worked on the flow of an app to make it better and help businesses while doing so. Sounds interesting!! to achieve this much in only 48 hours.
In this article, I have mentioned all the details of how we made the flow better and all the reasons behind it. Before that, let's meet my amazing team.
Individual contribution and teamwork
As we were meeting for the first time, it was wonderful getting to know my team. Everyone was amazing, with the skill set they had, and all of us were eager to learn from each other.
All of us worked effectively towards our goal. There we at times when we all took lead at what we are good at. I majorly contributed to secondary research, primary research, and user testing. Where I read the articles and user reviews for the cultfit app. Suggested the pointers to look for conducting user interviews. Advised and took initiative for conducting user testing.
Below are the part of the process where I actively took part and worked with my team
Understanding the problem statement
Conducting heuristics, intuitive evalation
Building hypothesis statements, validating hypothesis
Ideating solutions for the validated problems
Designing the User Interface
Problem statement
Ever wondered about having a gym center or online having a wide variety of workout formats Boxing, Dance Fitness, Yoga, S&C, and HRX. These workouts focus on strength, muscle endurance, flexibility, stamina & balance. All these are available in one place you just need to buy subscriptions called cultpass in the cultfit app. Amazing isn’t it.?
“To redesign the buying cultpass flow of the cultfit app and increase the conversion business metrics by helping users to easily avail the cultpass available in the cultfit app”
From the problem statement, we understood that we needed to focus on the conversion rate business metric and help users understand the cultpass feature available on the cultfit application. By keeping business metrics in mind we started to observe the current flow and started pointing out pain points that users might face.
Reasons to select the problem statement
- As a team no one has worked on a subscription flow, we thought to select it as it will challenging for us and we will learn about the business metrics which we were targeting
- We had our fresh and unbiased mindset which would help to come up with new ideas for subscription flow and make it better
- Our one of team members had a cultfit center which helped us to get user interviews and helped to understand the cultfit app business model
🕵️♂️Lets us see how the current flow in the cultfit app looks like
Steps in the flow
- Scroll vertically on the home page and click on available cultpass
- Select the pass based on the monthly plans provided
- Select the preferred cult center and starting date
- Click on buy now
- Select the payment mode UPI/EMI and click on buy now
- The further payment steps are dependent on the payment method chosen
🖌 Redesigned cultpass flow
As now we have gone through the current screens, let's check the changes we made and why are those changes required.
Reasons for the changes made
- We added an “Explore cultpass” button on the home screen which helped users easily understand the cultpass. We found such options in competitor apps like healthify me and Fittr where all the plans are mentioned on the home screen and helping them to increase the conversion rate
- We arranged all the information available in a structured way by using Gestalt principles, making it easy for users to navigate throughout the page and flow
Reasons for the changes made
- As users were not able to understand what cultpass is, We have created an option for all cultpass to be available on the new screen, which provides the required information on the cultpass
- For each cultpass, we provided detailed information on what the features cultpass has so as to help users easily understand.
Reasons for the changes made
- We optimized the information available on the screen and provided only the required information which can help the users to take the decision promptly and proceed with buying cultpass. Which will increase the conversation rate of the cultfit app
- We removed the icons (Buy now, Pause) to avoid confusion for the users as the icons were not following the consistency and standard
- We removed the BUY NOW button so as to avoid users to take more steps during the flow, we were able to validate this from our competitor healthify me, and from secondary research
Reasons for the changes made
- Here we tried to maintain design consistency by following the cultfit app design system.
- Here we have added information about specific to Elite cultpass what are the features users will get when they buy Elite cultpass which we found competitor Healthify me was providing the same and the conversion rates of healthify me are good
- To avoid users making errors, by clicking on the No Cost EMI option as it was only showing details and not the EMI option
- We added an option to compare the cultpass as this feature was available in competitor apps which helped to increase the conversion rates by making providing users with detailed comparisons so that users could take decisions efficiently
- We removed the select preferred center button as there were two buttons for the same call of action.
Newly added screens
- In the flow, we added the new screens to improve the current user flow to buy the cult pass
- We added the compare screen which will help users to understand the cultpass based on their requirements and can quickly proceed to buy the cultpass
- Here we added an option to select another plan if the cult center is not available for the cultpass (Elite, Pro)
- If the user is looking for an Elite cult center and is not available, we added a feature where the user can go to Cultpass Pro and check the pass details. This will help to reduce the churn rate and make users buy the cultpass increasing the conversion metrics of the business
✍Building hypothesis
Identifying problems following Usability Heuristics
To understand the flow better we took all the screenshots of the flow from the cultfit app and started the heuristic evaluation. We did this all together as a group so that we can get as many perspectives. We followed the 10 Heuristics principles laid by Jakob Nielson, we also mentioned the issues with our intuition and noted them down.
We gave the priority to the problems based on their severity of it, and how they may affect the business metrics if not taken care of. We also noted issues that were making it difficult for users to understand the flow and take action.
Our assumptions of identified problems
While doing heuristics we majorly found that the information provided on the cultfit app was not properly maintained. At multiple stages in the flow same information is repeated and the required information has not been provided. Our hypothesis is the same for most of the screens as the same issue was repeated on several screens. Here I have mentioned our overall hypothesis throughout the flow and their priority based on the effect on business metrics and users
- Our hypothesis was to have the cultpass option more visible on the home screen because our assumption was users were not aware of what cultpass is. Which can be the reason for the low conversion rate of business metrics
Priority:- P3
Validate by primary and secondary research - Our hypothesis was to provide prompt and explicit information to help users understand better and have more clarity on the provided information
Priority:- P3
Validate by primary and secondary research - Our hypothesis was to maintain consistency and standard for the icons used, as users will get frustrated if they are not able to understand the purpose of the icons used and may end up making errors
Priority:- P2
Validate by secondary/competitor research - Our hypothesis was to provide the required information on the cultpass shown, helping users to take action quickly. Our assumption was due to more information provided on the screen user might be distracted from the flow and may end up dropping from the flow
Priority:- P3
Validate by secondary/competitor research - Our hypothesis is that giving users the option to edit a cult center during purchasing cultpass will give users more freedom and control. Our assumption was users might change the selected cult center if user have selected the wrong cult center.
Priority:- P2
Validate by Primary/competitor research
🧩Time to see how we validated our hypothesis from primary and secondary/competitor research
As we completed our heuristic evaluation, now it was time to proceed with research to validate our hypothesis and heuristic evaluation. From here onward we all split into groups so as to speed up our process and depending upon skill.
Before proceeding with the research I suggested to all my team members who will be doing research to discuss the pointers which we are looking for with respect to our flow. I found this important because while doing research we may end up looking for other problems which might not be part of the flow given. Due to time constraints given, I gave it importance so as to have our research done properly without deviating from our goal. We were also open to any new insights which we will get during the research.
Insights from Secondary research
For the secondary research and we started to look at the reviews of the cultift from the google play store. As it will be easier for us to understand the user's pain point from a broader perspective. We went through the articles and application review site which helped us to get a more clear idea of the issues faced by the user.
Users were getting frustrated by the information available on the screens. As it was distracting them from taking actions
Users were finding it difficult to navigate through the app, as there are many call of action buttons that will give the same results
Users were not able to trust the cultpass (subscription) as detailed information was not provided. What features and the services user will get after buying the cultpass
Users are finding it difficult to locate the icons and what they meant
Competitive research
As our aim was to focus on conversion rate business metrics. For our current flow of cultfit app, we wanted to understand why there is drop while purchasing the cultpass. We decided to look for competitors which will be based in the health sector and are providing similar services. We wanted to understand on how our competitors are performing and what is helping their businesses.
For our competitive research, we selected Healthify me, Fittr, and My Fitness Pal as competitors. From the competitors, we took the flow which will be similar to the flow which we are evaluating. We took screenshots of the flow and started to understand the structure and reasoning behind the design. We also did a heuristic evaluation for the competitor's flow for us to easily understand the flow and what insights we can get to improve the current cultfit app flow
The insights we got from the competitive research brought us clarity on how we can design the flow in a better way. Below are the overall insights from competitive research for a detailed view click on the above Figma link which will direct you to that section
- Allowing users to customize the plans as per their requirement (The healthify me app has this feature helping them in conversion business metrics)
- The progress bar is shown providing users visibility of system status (Healthify my app has the status of the flow which helps users to understand at what stage in the process the user is)
- Having the option to skip a few steps(selecting location, the date by when the user will start) whenever required shows user control and freedom (Healthify my app has options to skip the not required options)
- Having optimized and accurate information provided to users with respect to the plans they are buying, which builds more trust with users which can increase the conversion metrics (This option was available in Healthify me and Fittr which help them to gain conversion metrics)
- Having a cancel option in payment flow to avoid users from making errors that are not available in the cultpass flow (This option was available in other all competitor apps)
- More details information on the plans and coaches available for the plan selected make users buy those plans, which is not provided in the cultfit application
- Providing a filter for choosing trainers.
Primary research insights
For primary research, I and Raja from our team took lead and planned for the user interview. We conducted primary research because we wanted to understand the user behavior while buying cultpass and navigating through the app. Is the user getting distracted by other information available, Is the user having difficulties understanding the steps in the flow? As our aim was to increase the conversion rate. If users are really dropping while buying cultpass.
We wanted to focus on the working people as they will have the leverage to buy the cultpass. We targeted people from tier 1 and tier 2 cities. As we targeted our users we also decided to have a guide with us to follow while interviewing users. The guide was made for us to use as a reference only so that we can make changes as per the user when taking interviews
Below are the task given to the user for us to understand the user behavior while exploring the application and the flow
Ask the user to explore on Application as by their own Give them the task to find the Cult fit Elite pass, what other plans users can find
Ask the user explore on the Payment Flow
Ask the user to how easily they could understand the contents and offers do you notice the cultpass icon? would you check it out?
Points to observe while the user performs the given task
Did the users are nativgation on the right direction or getting any difficulties between the navigation.
Are they facing difficulties while reading the contents and offers/reward point
How efficiently they are identifying the components, CTA , recognising the icons, and where they on the page.
Will they facing any difficulties while on the payment flow.
Is it easy for user to select this flow
Where do they stop to think and what confuses them
The question we probed users were dependent on their behavior, our understanding, and discussion
What did this app make you feel? why is that?
For working women and not able to go directly to gym, then how will choose a plan which is appropriate to you.
If you want to change your profile details where will you go and change..
Are you able to understand and navigate through the application
What are the payment option you see are suitable while purchasing cultpass?
If you want avail other extra classes on specific activities where will you find?
How would you feel when exploring the app , specially cultpass?
The insights we got from the user's interviews helped us to validate our hypothesis, we got a few more pointers on how the user behaves and we noted all those.
- The user is not able to identify icons and where to go for finding particular services like cultpass
- Too much information and cluttered navigation are overwhelming to the user.
- One of the users mentioned multiple navigation pages and clicks for purchasing cultfit a pain for them to go through the process.
- The user is struggling to find the cult fit elite pass from the home screen itself, as the user got distracted by the other information
- The user got confusion between cultpass and cult class, user ended up booking cult class instead
- The user was not aware of the other services available on cultfit
- The user stated to have near cultpass center available as an option to select. If not available need the application needs to inform about it
- Even user was already a cultift app user still was not able to understand what cult pass is.
💡Lets us jump into the ideation and how we came up with a solution
After gathering all the insights from the research, we got a clear idea of how to proceed with the solution. To begin with the ideation we started to mark the elements on the current screen and mention what and how we can make changes to those elements
As for the flow, we were working it had a major issue in providing detailed information throughout. So we needed to restructure the whole information architecture of all the screens. We followed the Gestalt principles and tried to combine the section which will help user to understand the process while buying cultpass.
We gave the priority to the problems faced by the users depending upon how it will affect the conversion rate business metrics
To generate ideas for the problems we devised we asked how might we questions and tried to come up with as many ideas as possible. Our team was having difficulty providing answers to the HMW’s questions as we went through them. I took the initiative and attempted to explain how to generate HMW question ideas. We did this for a few of the major issues, trying to gather as many ideas as possible. Our main HMW questions are listed below.
How might we make users understand what is cult pass?
Action figure added
Choice of words
Demo video
Images represnting what are the activities
Popup when user opens the application
Having single card on home screen stating what cult pass explore option
How might we make information available on the home screen understandable to users?
By having containers created for information
Combining content in groups depending upon their importance and what it is relating to
By changing the card design for cultpass from screen
How might we provide more information about cult pass?
Giving details about the cult pass
Can have video representation on what cultpass is
What kind of cult pass are available specifying their features
We can have carousel giving more information on each cultpass
How might we reduce the call-of-action buttons on single screens?
By combining options on a single screen
Cluttering options that are not needed to select
By removing the CTA button which can be skipped and added later by reducing decision for users to take
After noting down all the ideas, we revised the flow. At first, we were discussing altogether and trying to ideate, which created a bit of chaos, and were not able to present our ideas. So we individually started to note down ideas on pen and paper. We kept the insight in front of us for reference which we got from all the research and heuristic evaluation.
After getting all our ideas on the flow, we decided to have one flow to go with, Which will include the following steps in the flow
In the flow, we have added an option where if a user is not able to find the cultpass Elite cult center it will state to the user as no Elite cult center available at your location it will suggest looking for another Cultpass available. This will help users to not drop from buying the cultpass. Increasing the conversion metric of the business.
🔊 Getting feedback on design (Usability Testing)
Now that we have built the design it was time to test our design. Testing will help us confirm and get feedback on all our hypotheses and solutions which we came. After building all the screens and creating the prototype we discussed what we can observe from users' behavior and action which user takes.
We gave the below two tasks given to the users for us to observe and get feedback on those
Asked user to subscribe for cult Elite pass
Asked user to select EMI option
Points to observe from the above task
How users are opting for the cult passes
What are the decisions user will make while selecting cultpass subscription?
Is the user able to understand what cultpass is
Are they able to differentiate between available cultpass
How user is selecting the cult center
After observing the user we decided to probe a few questions with respect to their decisions
Why user selected any specific pass liki (Elite,Pro or live)
Was able to understand what cult pass is
What benefits user can understand from the provided information
Feedback from users after usability testing
As we were running out of time, my team was working on a video presentation and deciding on the scripts for the presentation. I went out and did the usability testing. As it was Sunday eve, it was a bit difficult to find users and ask them for usability testing. As soon as I got the feedback from one user testing I called my teammates and gave them details of the feedback received. So that my team can start ideating solutions on how the changes given can be implemented. Which will save us time and we can do things parallelly. Similarly took the next usability test and below are feedback received.
The user was finding it difficult to click on the view more option for cultpass
The user wanted a video presentation of what cultpass are
For the user to select any cultpass, there must be reviews from earlier users who bought those passes (feedback system for cultpass available)
The user stated not able to get the EMI option easily
Below are the screen that we redesigned after getting feedback from the users
👨🔧Building UI
The cultfit app had its own design system as a guide. We followed the guidelines and created all the UI elements from scratch. As the design was based on glass morphism we need to learn the glass morphism and then start building the screen. Shreya from our team helped us to understand how to create glass morphism.
As we had only 48 hours to do UI design, we started to build the basic components simultaneously as everyone split the work during research. We tried to main design consistency by following the design guide. It was an amazing experience building screens with a glass morphism effect as I was doing it for the first time. This helped me with UI concepts like components and the advantages of using components. How using auto layout will help build cards, screen, and have proper spacing.
📝Time for learning and future work and scope
During these 48 hours the experience I got while working with people, and how much I was able to cop up was really amazing!!
We always underestimate ourselves, if we take action with intention we can do a lot of things in a decided time.
User interviews:- I remember one of my users ended the interview in the middle as he had to leave for other work. And is fine if you don’t get all the answers from all users. We can gather insights from users as much as possible and go ahead with the data we have
Discussions and debate:- Discussion and debate can be helpful at times, it is allowing your team to think and give a broader perspective. And can bring more ideas that can useful
Taking initiative and ownership by involving your teammate does help to achieve your goal in a shorter period of time
Future scope of the project
Apart from our problem statement, there can be changes done that will help the overall flow of the application.
From our research, we did find that users not able to track their workouts, need to have an inbuilt community. Having a community will also help gain conversion as competitors are already having the feature.
Users can also have the freedom for selecting training depending on their ratings/experience.
💁♂️Tadaa!! Thank you for reading till the end, if your curiosity is killing you. You can deep dive into our detailed work
