Panacea Financial UX/UI Pages Revamp
Panacea is a bank exclusive to doctors, created by doctors.
In this project, the focus will be on redesigning the digital experience of Panacea Financial's pages. The goal is to enhance user interface and user experience elements to create a more intuitive, efficient, and visually appealing platform for users.
What design strategies and best practices can be implemented to improve the visual appeal, navigation, and organization of the website, thereby increasing the credibility and trust of the bank among users, enhancing their experience, and increasing the chances of them becoming customers?
Understanding the scenario
Panacea Financial is a startup bank created for doctors, by doctors. The bank's founders, who are both physicians, understand the difficulties medical students face when trying to get a student loan or refinance their current student loan. As a result, they have developed a new way of banking for doctors by facilitating the borrowing process for medical, dental, and veterinary students.
However, like many startups, Panacea Financial's website was simple and not very user-friendly or visually attractive. The website was created by a marketing company without the help of a UX/UI Designer and a deep understanding of the target user. Despite the website's shortcomings, the bank began to grow due to the appeal of its concept and idea.
To address these issues, Panacea Financial hired a UX/UI team, which myself and another UX Designer. By using tools such as Hotjar and performing tests with users using Loop11, we were able to identify the pain points of users and redesign the website pages based on our findings and experience as UX/UI Designers. We used Hotjar to analyze where users were clicking the most on the pages, giving us an idea of what was catching users' attention. Heatmaps helped us understand where the main sections of the pages should be placed, as the percentage of users drops significantly when scrolling.
As a result of these redesigns, the user experience improved, traffic increased, and more sales were made for Panacea Financial.
Creating the CSD Matrix
The certainties, suppositions, and doubts that were developed were the result of an analysis of the Hotjar data, an analysis of the competitors, and based on my expertise as a UX/UI Designer. The Hotjar data provided insights into the pain points of users when navigating the website, such as difficulty finding information and confusion when performing tasks. The analysis of the competitors helped to identify areas in which Panacea Financial's website could improve in comparison to others in the industry.
My expertise as a UX/UI Designer was then used to interpret the data and identify potential solutions to the identified issues, such as redesigning the website with a focus on user-centered design and best practices of UX design. The certainties, suppositions, and doubts were formulated based on this analysis and expertise, to provide a comprehensive understanding of the issues and potential solutions for improving the user experience on the Panacea Financial website.
Building the CSD Matrix is important in this case because it allows for a thorough understanding of the issues and potential solutions for improving the user experience on the Panacea Financial website. The certainties provide a clear understanding of the current problems that users are facing when navigating the website, such as difficulty finding information and confusion when performing tasks. The suppositions provide a clear understanding of the potential solutions for addressing these issues, such as redesigning the website with a focus on user-centered design and best practices of UX design.
The doubts, on the other hand, provide an understanding of the areas where further research and analysis may be needed after implementing a solution. This allows the team to have a more realistic and well-rounded perspective on the problem and potential solutions and make better decisions.
In addition, this approach allows the team to identify and prioritize the most important issues to address and to have a clear vision of what the team is trying to achieve with the redesign. By having a clear understanding of the problem and potential solutions, the team can make more informed decisions and increase the chances of success.
Current Results
The redesign of the website resulted in a significant increase in website traffic, with a daily average of 100 visitors increasing to 1,500 visitors per day.
There was a notable increase in revenue and loan applications, with a 25 million dollar breakeven point being surpassed to reach 200 million dollars.
A new "Practice Solution" page was created, which became the primary source of revenue for the company.
The redesign also improved the consistency of the website's branding with that of the company's social media presence.
Using Hotjar, we analyzed various negative feedback and were able to address over 90% of the issues through the redesign.
We also conducted user testing after the redesign, utilizing Loop11 to conduct sessions with real users, with 90% of participants successfully completing all tasks.
The redesign also allowed us to create landing pages for conferences and events, which when paired with Facebook and Google ads, resulted in a high conversion rate.
It's worth mentioning that Panacea Financial is a division of Primis, a larger bank, and as a result of our redesign, Primis bank also decided to redesign their webpage, utilizing a lot of our research, information, and feedback from our UX Design team, despite having a team four times larger than ours.
Heatmaps
The heatmaps were a valuable tool for understanding how users were interacting with the page and making data-driven decisions to improve the user experience.
As seen in the images below, it can be observed that only 50% of users were viewing all options of PRN and the majority of clicks on the page were on buttons to obtain more information about the product options, which caught our attention to put this information more in evidence in the redesign.
The heatmaps showed us that the users were not scrolling down to see all the options, which means that they were not finding the information they needed. That's why we decided to prioritize the most important information on the top of the page, making it more visible and easy to access. Additionally, we also used the data from the heatmaps to optimize the placement of the buttons, making them more visible and accessible to the users.
Product Page “PRN” before:
Scrolling
Clicks
Practice Solutions Before:
On the Practice Solutions page, the percentage of users who view all product options and their information drops by half, to only 25%. The heatmaps showed us that users were not scrolling down the page to view all the options, which means that they were not finding the information they needed.
This highlights the importance of making the most important information more visible and easily accessible on the page. Based on this data, we decided to prioritize the most important information at the top of the page, making it more visible and easy to access on the new page.
Scrolling
Clicks
Redesigns
Based on these analyses, redesigns of the pages were made. The heatmaps provided valuable insights into user behavior on the website, allowing us to identify issues and make data-driven decisions about the layout and design of the pages. By prioritizing the most important information and making it more visible and accessible, we were able to improve the user experience and increase the chances of users finding the information they need. Additionally, we optimized the placement of buttons and made them more visible and accessible to the users. Overall, the redesigns were successful in addressing the issues identified through the heatmap analysis and improved the user experience on the website.
PRN Page
As previously mentioned, on the PRN page, we highlighted and placed the most important and frequently searched for information at the top of the page. We also reorganized the content for better visibility and user experience on the page. This approach was successful in addressing the issues identified through the heatmap analysis and improving the user experience on the website. By making the most important information easily accessible, users were able to find the information they needed more easily and navigate the page more efficiently.
Additionally, the redesign made the website more aligned with the brand identity and visually more attractive to the users, which contributed to the overall success of the redesign.
Redesign
Old Page
PPS Page
On the Practice Solutions page, we also restructured the page to prioritize the content that users are most interested in, making the page visually more attractive, imposing more credibility, and maintaining the visual identity of the brand.
Redesign
Old Page
Home Page
The home page was completely restructured and organized according to the needs of our target audience, with the addition of top tabs to direct each group of users (medical, dental, and veterinary) to their respective pages, with more objective and organized information. By providing a clear and direct path for each group of users, they were able to find the information they needed more easily and navigate the page more efficiently. The overall goal was to make it more user-friendly, visually attractive and trustworthy, which was accomplished with the redesign of the home page.
Redesign
Old Page
Conclusion
In conclusion, the redesigns of the Panacea Financial website were a success in improving the user experience and increasing the chances of users finding the information they need. By utilizing Hotjar heatmaps, we were able to identify areas of improvement and make data-driven decisions about the layout and design of the pages. The redesigns of the PRN, Practice Solutions, and home pages were focused on highlighting the most important information and making it more visible and accessible, and also on making the website more aligned with the brand identity and visually more attractive to the users.
This approach led to an increase in website traffic, revenue, and loan applications, as well as an improvement in the credibility and trust of the bank among users. The redesign also allowed us to create landing pages for conferences and events, which led to a high conversion rate when paired with Facebook and Google ads. The redesigns were able to address all the issues that were identified through the heatmaps analysis and test sessions with real users through Loop11, to make the website more user-friendly, visually attractive, and trustworthy.