Redesigning a mental health counseling website - Betterlyf

People are increasingly becoming aware of mental health issues in India and mental health counseling website have played a major role in this. The digital age has provided us with ample comfort and easier access to resources but at the same time they have bestowed upon this humankind undue stress of living up to society’s expectations by comparing lives on social media, a constant dopamine rush of the phone buzzing and getting a notification which has led to a a spike in mental health issues across the globe. Counseling websites play an important role in reducing stigma around mental health and providing therapy to the people and Betterlyf is one such website.

My Process

1. Understanding the problem
2. Customer Analysis
3. Information Hierarchy
4. The first skeleton-Navigation Flow & Style Guide
5. Wire-framing
6. Prototyping

How does the website works?

This website provides mental health counseling and as the creator quotes, it was created by him to reduce the stigma around mental health and mental health counseling.

• It has various articles on its home page related to mental health, it’s importance and how therapy is going to help a person overcome his challenges.
• To increase it’s brand value, they have shown many celebrities endorsing the website and makes an effort to reduce stigma by asking celebrities their story of therapy and how it has helped them in their personal and professional lives.
• There’s a page which enlists various counselors, their background, ratings and their specialization and lets the user choose which therapist they want to consult.
• They have also tried to segregate the issues of people by asking them which area of their life they need help in. For example — related to relationships, building confidence, career related issues and various significant others.
• Once the user decides on challenges he wants to overcome and the therapist he wants to get matched to, he can proceed to register and book a session.

Why redesign?

• Once you enter the dashboard, you are stuck. You cannot go to the homepage again. You will have to find a way to go to the homepage through the feedback option.
• The Homepage has too many distinct topics in it. It is not properly segregated.
• The navigation bar does not contain the page which has details about the counselors which makes the process of finding that page confusing and cumbersome.
• There are multiple buttons on some pages which redirect you to the same payment page which makes the presence of so many buttons redundant.
• The website neither tells you who is the best rated counselor nor does it recommends the most suitable counselor for you.
• All the pages except the homepage have too much text which makes the website less attractive.
• There is no feature of refund on the website, the users have to call on the customer care number and talk to the executive for refund.

Customer Analysis

Knowing the customers of your domain is of primary importance when it comes to the success of any initiative. The product is always centered around the need of customers and their expectations.

We started the customer analysis by creating user personas :

• They all have a common goal — to improve their state of mind.
• The issues we came across were majorly related to social stigma, expensive service and a dissatisfied customer.
• This indicated the need to reduce the charge of the sessions, creating a safe space for the customers to open up and finding a reliable service provider who can cater to the needs of the customers.

The next step was to validate the assumptions we made. We created a google form to validate our assumptions and understand the domain better. The assumptions we made were mostly correct so we moved on to find how the customers like to interact and use the services provided to them -

As indicated by the charts above, we can see that a major chunk of customers (64.3%) preferred mobile applications over websites. In finding out which mode of communication is desirable, video calling seemed to be a clear winner.

Information Hierarchy

1. COUNSELING

• Select a session
• Session Type
• Session duration
• Date
• Time

2. COUNSELOR

• Specialty
• Specialized in
• Number of sessions taken
• Rating
• Review
• Experience
• Certificates

3. PAYMENT METHOD

4. SELF HELP SESSION

• Meditation
• Music
• Freebies

5. KIDS COUNSELING

6. REVIEWS

7. FAQ’s

The First Skeleton

1. Navigation Flow

Website navigation allows the flow from one page to another. It gives us an idea of how pages are organized in an application which makes the design process easier and efficient.

2. Style Guide

A Style Guide basically sets the theme of the website. It is a one-stop place to see all visual styles of the site such as buttons, color pallets , typography and any visual language that is used on the site. Our primary colors and colors of buttons were influenced by the gradient in the original logo of the brand.

Wire-frames

Wire-frames are low fidelity representation of a product that can be tested with users so that changes can be made in the initial stages. If we come across changes that have to be made earlier in the designing process, it’s much easier to change in terms of effort, time and cost but as we move ahead in the designing process, accommodating change becomes increasingly difficult. Wire-framing hence, is a very important step in the designing of any product.

Prototype

Website prototypes are interactive demos of a website. They look exactly like the website and is mainly used to gather feedback from the users and stakeholders to accommodate any changes or improvements.

1. Home Page

Now the sections in the home page are arranged more properly and are segregated. It has an option of self testing which tends to diagnose the patient through a questionnaire and helps in getting matched to a therapist who specializes in the issue he/she is facing.

2. Login and Sign up page

The original website asked for a 10 digit pin which the user can easily forget. The redesigned login and sign up page asks for concise information which can be easily remembered by anyone and helps in comfortable login and sign up.

3. Counselors page

The new feature added in this page is that we have enabled a search function and we are also allowing users to filter the counselors based on rating, popularity, specialization etc. Once the user taps and selects a particular therapist, he can see all the details related to him, book a session with him or rate him based on his services.

4. Dashboard

We have added some new features in the dashboard like tracking the progress of a person, provided him with a mood journal which enables him to record his feelings on a particular day and lastly a calendar feature which can keep track of his appointments and send him reminders regarding the same.

New Feature

5. Self Help

This is a completely new feature which has been added by us in the website. This is for people who think they have mild anxiety or depression and a counseling might not be needed for him/her. This has several meditation practices to ground someone and provides a playlist of soothing music which helps the person to calm down and relax when he does not feel good.

Conclusion

This was a college project I worked on during my 5th semester in the UX module taught by Professor Abhrojit Boral who has been a constant source of guidance, motivation and support.

I enjoyed learning UX design and will love to do more projects related to it. I really enjoyed doing this case study. I wonder how it would be to work with a team on a UX project.

Last but most importantly I would like to thank my team mate Dhwani Garg for working constantly and motivating me through the course of the project. Anyone would cherish having a team mate so enthusiastic and honest towards her work.

In all, it was a very amusing experience of learning and applying those in my work!

The team members of the project are :

Ayushi Amit & Dhwani garg (Dhwani Garg)