Your one-stop app to motivate and instill positive change to life
WICK is a motivational app start-up that aims to induce high-performance mindsets in its user through quick-hitting video sessions. We were part of the kick-off team that designed the MVP for the app, and we were responsible for creating the onboarding and sign-up flow for the product
Role
Research, UX/UI Design
Tool Used
Figma
Time
8 Weeks
Project Overview
Wick is a startup that intends to build a mobile product with its in-house content that aims to serve users who work in high-stress and high-performance professions. Our design team was commissioned to design the user experience and interface of the MVP of the product. Because of time constraints, the project scope is limited to onboarding and paywall procedures.
Problem
We all have times when we feel low, dull, or stuck in a procrastination rut and could use a little push. Unfortunately, there is a very limited choice of motivational apps with in-house content. How can we help people who need that push and develop a usable and appealing tool to get people to fulfil their motivational needs to endure tough times?
Solution
An app that satisfies your motivational needs with in-house content. Motivation is about getting into habits and lifting yourself; the experience should be seamless so people would want to keep returning for more motivational content.
Competitive Analysis
To get the project started, we compare different motivation apps out on the market and see what made them popular. Since the client provided the in-house content, we primarily focus our research on the flow and structure of similar products. There are three aspects that we focus our research on; the onboarding experience, paywall and sign-up/login options.
The first step of competitive research is to look at the kind of content the most popular motivational apps offer. Our findings show that most products are goals and routine planners, or motivational feed senders. Our client is set to fill the gap and provide users with various original video content to meet their motivation needs.
The design team has researched similar products with high scores on reviews on the market and studied the options for onboarding, paywall and free trials, and sign-up/login process. From the research findings, we look at the advantage and disadvantages of each option and decide what works best for our product and best matches our goal.
Subscriptions
The team looked into examples of similar products that use different subscription types and paywall strategies. Each strategy provides distinct advantages and user experiences of the product depending on the design team's goal. The most common practices are:
​
-
Free for all - contents are free for all without restrictions, apps that don’t profit from the content subscription but from ads and other means.
-
Paid - all content are gated, users can only access the content after paying.
-
Freemium - free content available to user without restrictions, but users have to pay to unlock extra features or gated content.
-
Free Trial - users will have full or partial access to the content for a limited time before they need to pay.
How did the others do it?
Freemium: Headspace
One of the more well-known meditation apps aims to promote mental wellness. Their subscription approach is the freemium strategy. Users are offered free basic content but need to pay to access the premium content library.
Advantages:
- Great for user retention, users will stay for the free content.
- Get to show the users what the app has to offer.
Disadvantages:
- Most users will only stay for the free content.
- Premium content has to be substantially better than free content to provide an incentive for users to pay.
- Content needs to be constantly updated for users paying.
Other apps that uses the same strategy:
- Motivate, Calm
Free Trial: I am - Daily Affirmation
A motivation app that sends out daily affirmations. Their subscription approach is the free trial strategy. Users are offered full access to the content for 3 days, and users need to pay to continue their access to the content at a price after the free trial.
Advantages:
- Users can experience the app's full potential within the free trial period.
- Users who opt to pay to use the app are most likely to become long-term users, which is ideal for generating stable income in the long run for the app.
Disadvantages:
- The paywall will pose a barrier to users. Many of the users will quit after the free trial is done.
- Content needs to be distinct and better than their free and paymium competitors for users to be willing to pay.
Other apps that uses the same strategy:
- Reflectly
Free: Motive
Motivation app that sends motivational quotes at a scheduled time. The app is free to use with no gated content.
Advantages:
- Great for user retention, users will stay for the free content.
- Low upkeep, users don't expect original content from a free app
Disadvantages:
- No paywall; the app have to generate revenue from other means like advertisements.
- Fewer resources to provide quality content.
Other apps that uses the same strategy:
- Always Positive - daily quotes
Learnings - Subscription Strategy
After the competitive analysis, freemium would be a better subscription strategy for our product takes advantage of the continuous flow of new in-house content. To maximize the value of the new content, it makes sense to place more recent content behind the paywall while free users can still have a taste of what the product can offer. Free content will help with user retention and build the product's name, while paid users will get the product's full potential.
Onboarding Approach
We have also looked into a variety of different apps and subs up the most common type of onboarding approach:
​
-
Sign-on first - registration and collecting the user's information comes first in this approach, mainly used by products offering free content, which only need user information.
-
Customize and set user goals first - this approach, characterized by obtaining user goals with questions, aims to provide a highly customized experience for the user by matching the content with their end goals.
-
Try the product first - a gradual engagement approach intended to have users build reliance on the product by offering a free trial.
How did the others do it?
Gradual Engagement: Duolingo
One of the most well-known apps for language learning, they have the best example of using gradual engagement in their onboarding flow. This onboarding strategy allow users to try the product first. Duolingo asks a few simple questions to understand user goals, then lets the users dive right into the content before asking for personal information. Users can finish the first lesson as a guest and experience what the app offers without registering for an account.
Advantages:
- Goes right into the content, provides no resistance for users to give the app a try
- Once the user started using the app they will have incentive to stay.
Disadvantages:
- Only works for product with lessons or multiple sessions, not suitable for functional apps
Other apps that uses the same strategy:
- BetterMe, Blinklist
Sign-on First: Strava
Strava is a popular running and cycling tracking app that adopts a sign-on first approach in their onboarding flow. Users must sign up or sign in to their account before accessing the app's functions. Strava also has a simplified sign-on/sign-up process to minimize user resistance to the onboarding flow.
Advantages:
- Works well with paymium subscription strategy, users have to give out their personal information to access the free content.
- Necessary for apps that need user information for content optimization; in this case, geo-location.
Disadvantages:
- Users won't know what content the product has before signing on
- Users might be reluctant to sign-on without knowing what they are signing on to.
Other apps that uses the same strategy:
- Headspace, Insight Timer, Shine
Customize First: Calm
Calm is a popular mediation app that uses the customize content first approach in their onboarding flow. Users will be asked a series of goal setting questions to optimize content catered to user goals. The onboarding flow ends with an optional sign on reminder screen, then it will bring to user right into the free contents.
Advantages:
- User information is optional, posing less user resistance to access the content.
- Content will be tailored for each user according to their goals.
Disadvantages:
- A less seamless navigation for users requires multiple clicks before getting to the content.
- Needs to be concise about the questions; lengthy questions might deter users from using the product.
Other apps that uses the same strategy:
- Balance, Mindset, Sanvello
Learnings - Onboarding Flows
​Our product features in-house content and doesn't require much customization. For that, we decided to opt for gradual engagement and allow users to try the product first before asking for user information. We also want to minimize user resistance by keeping the onboarding flow short; for that, we avoid lengthy goal-setting questions in the flow.
Sign-On Options
We have also looked into Single Sign-On (SSO) options and see if it is suitable for our product.
Advantages:​
- Frictionless sign-on for users by skipping past cumbersome registration procedure.
- Doesn’t require excess credentials from users.
- One-stop verification - streamline the verification process for developers.
- Providing more reliable access to user data for personalization.
Disadvantages:​
- Becomes dependant on SSO service provider; when SSO system is down, access to all connected sites is stopped.
- SSO can become a single point of failure; if one account is breached, all accounts under the same SSO become vulnerable.
Learnings - Onboarding Flows
SSO provides a seamless sign-on option for products that do not require stringent data security. And in this case, our product does not work with sensitive data, so SSO is a suitable sign-on option for us.
Project Goals
The project sets out to induce change to users with our client's in-house content. However, how the content is being delivered to the users is how the product does the magic. Upon studying other successful products on the market, we conclude that our product needs be engaging and easy to use so that users would keep using the product.
What This Product Aims To Deliver
Change Inducing
Positive changes stem from building positive habits. Therefore the product is designed to have minimal resistance and be part of users' daily habits.
Engaging
To create an experience that the product is catered to the user's needs and continuously induces positivity in the user across all circumstances.
Connectedness
Froster the sense of community for users by connecting users through chats, comments and sharing. It helps users to build a support system and hints they are not alone in the journey.
How do we induce the impacts intended for users?
1. Introduce impactful content upfront
2. Personalize content delivered to user
3. Create a frictionless navigation
4. Set a positive mood and feel
5. Provide users with space to express and share
What We Have Created
With our project goals established, our next step is determining which essential features to include in the first MVP. We start with the profile and setting section, which is crucial for every product and paves the way to establishing the onboarding and subscription strategy of the product. To avoid reinventing the wheel, we cross-referenced Calm and Headspace, the 2 most renowned wellness apps on the market, and created a list of essential features in the profile and setting section. Below is how the profile and setting section of Headspace is being studied.
From the research on Calm and Headspace, we have created our own list of essential features for the profile and setting section with their respective priority code.
The list formulates the backbone of the product and these screens were designed in respective iOS and Android UI format.
Incorporating User Goals
In the first wireframing stage, we created an onboarding flow for first-time users. At this stage, we focus on features that help to incorporate user goals.
i. Welcome video to showcase our impactful content to new users
ii. User needs questions for personalized content
iii. Minimal resistant navigation for a frictionless environment
iv. A style guide to set a positive mood and feel
v. Share and comment function to prompt connectedness
1. Welcome Video
The welcome video gives new users their first impression of the product and gives them an idea of what positive change the product can bring. It is a key feature in the onboarding flow and corresponds with the user goal of engaging users with impactful content right at the beginning of the user journey.
Welcome screen followed by the welcome video for first-time users
If the user lands on the app by receiving a referral link from a friend, the product will bring the user straight to the referred video instead of the welcome video.
Referred video for first-time users receiving a referral link
2. User-needs Questions
Personalized content allows better user retention as the featured content is made to fit the users' motivation goal. We have placed two questions in the first-time user onboarding flow to understand the users' goals and motivation levels.
The 2 onboarding user goal questions after the welcome video
The questions will help WICK understand the user's motivation level and their desire to achieve. The result, in turn, will help customize the featured video they see on the main menu.
Engaging Users on Onboarding Flow
​The onboarding experience dictates a user's first impression of the product and a first glimpse to get users acquainted and comfortable with the product. At this stage, the welcome video and personalized content are the strategies to incorporate the product goal of engaging users early on and helping users understand what the product offers. We will see increased user retention if the product successfully engages users early in the onboarding flow.​
3. Frictionless Navigation
WICK is designed based on frictionless navigation. It enhances the user experience by minimizing the number of clicks and actions required to move from one video to another. The design ensures that users can easily access featured videos, watch them seamlessly, and return to the home page after completing a video. This streamlined experience will likely lead to positive feedback from users and encourage them to keep using the app, leading to a habit of getting motivated by WICK.
WICK is designed based on frictionless navigation. It enhances the user experience by minimizing the number of clicks and actions required to move from one video to another. The design ensures that users can easily access featured videos, watch them seamlessly, and return to the home page after completing a video. This streamlined experience will likely lead to positive feedback from users and encourage them to keep using the app, leading to a habit of getting motivated by WICK.
4. Style Guide
​WICK intends to give off a positive, young and energized vibe as a motivation app. The color and typography should strike a bold, distinct, yet familiar feeling to users, like turning on your favorite song or show, fresh, new and exciting, something you can’t wait to use every day. The Wick brand’s primary colors are dark purple and saturated red. These colors are bold, memorable, and unique, working well together to help distinguish Wick.
Style guide used for the project
With the selected typography and core colors of the brand, I turned them into workable components of the product. These components will standardize the product's visual coherence and ensure the mood and feel are consistent throughout the products.
Induce Change to Users Through Look and Feel
The product's navigation and design were made to create an engaging and inspiring user experience. The whole experience keeps users committed to the app and, in the long run, induces motivational changes in users. Navigation in the app is made seamless to reduce user frustration and help users to find what they need quickly and easily. At the same time, the look and feel of the app create a sense of excitement and enthusiasm in users, which motivates users to take action and stay committed to their goals. Bright colors, playful typography, and inspiring imagery help to capture users' attention and create a positive emotional response.
5. Share and Comment
To foster the sense of community of WICK users, I have placed comment and share icons on every video to make it easy for users to access these functions. The share and comment features serve the purpose of connecting different WICK users. It helps users to achieve their goals by getting validation and support from other users in the comment section. The share video function also facilitates idea sharing between users or even non-users. These functions help create a community of users motivated to achieve their goals together.
Share and comment button on every video, also at the end of the welcome video
6. Paywall
From the learnings on the competitive analysis, the freemium strategy works the best for our product. Based on the research on other apps, we have designed the paywall flow to incorporate our user goals of minimizing resistance in navigation. Users will not come across the paywall in the welcome or subsequent featured videos. For first-time users viewing the welcome video, a paywall prompt will be activated when the users click on the comment button. Users will need to subscribe to access full functionality of the product.
Paywall activated by first-time users clicking on the comment section on welcome video
After the welcome video, the paywall prompt is passive when users try to access specific functions or content in the product. Users will trigger the paywall prompt when they click on the WICK pro videos on the main menu or access the content library by clicking the library tab. A paywall link also shows when users click on the profile tab.
Paywall activated by first-time users clicking on WICK pro videos, the library tab and the profile tab
This paywall strategy allows users to have access to free content uninterrupted and build trust and reliance on the product while users can still easily come across the paywall and subscribe to the premium content.
Retrospective
This project was done on a time crunch, and our team didn’t have time to do user interviews and derive a journey mapping at the early stage. Also, much of the market research was done by another team. For that reason, much of the decisions were derived from secondary research. Although the secondary research did serve its purpose, the lack of time and resources greatly limited our ability to conduct detailed user research and user testing. If there was anything to be done differently with the project, I wish we had the resources to follow through with the proper design sprint and make better-informed decisions on the design.