Problem:

The original Thrive website was not used to it’s potential because of its low conversion rate and inefficient user experience. Loan Officers (referred as LOs) doesn’t want to use the provided LO pages, and their mortgage customers are often lost on their website, not knowing where to look for information or how to navigate the website.

Thrive doesn’t have any in-house developers to maintain the website so they had a hard time updating their original website as well.

From the LOs’ perspective, there was not enough exposure for them or their services on the main website. Our recommendation was that Thrive needed to provide more and equal opportunities for all of their LOs, as well as to provide a smooth process for mortgage customers to find a loan officer/branch to help them.

Team:

2 Creative Directors, 1 PM, 1 Web Designer/Developer, 1 Software Developer

My role:

When I joined this project as the Web Designer/Developer, the old website was there for years, and it needed to be re-branded to the new style that Thrive’s Creative Director provided. So I needed to re-design the UI to match the new style and needed to work with a Software Developer to elevate the user experience for both LO users and mortgage shoppers. Additionally, I needed to design a backend CMS system that’s user-friendly enough for their internal team to update and upkeep for the long-run.

Deliverables:

User Journey
Wireframes
Re-design UI&UX
Live site & editable CMS backend

Project study:

As a mortgage lender, Thrive can only offer mortgage packages to customers within their own lending ability. Other mortgage brokers on the other hand, can provide packages from different lenders or banks. To compete with other lenders and brokers, Thrive needs to prioritize mortgage shoppers’ website experience, making sure that they can find information clearly and quickly, and the very second they need answers from a LO, they can click to connect with one within the frame:

Easiness to start
‍Borrower or mortgage shoppers need to know where to start and how to find answers or relatable knowledge within seconds.

Easiness to understand
‍For general mortgage shoppers learning about Thrive mortgage products, the titles, taglines, and website copy all need to be tailored towards someone who does not know Thrive or mortgages well, instead of using industry jargons or abbreviations of terms only known to the company.

For Loan Officers at Thrive, their main service is to help borrowers choose the best mortgage product from Thrive, instead of helping them compare rates from different lenders. The LOs will need the Thrive website to help them establish a high level of confidence, expertise, and reliability. So for them:

More traffic
‍The LOs need to have exposure, and more importantly, equal amount of opportunities to be promoted on the website to all the mortgage customers, instead of a simple alphabetized list of names and profile pictures.
More resourceful
‍The LOs need to be able to provide relevant content on their own page to engage with website visitors, and to retain online traffic.
More exclusive
‍The LOs want to be able to use their pages on the official Thrive website as their own business card and hub, so when they share their unique link with their own clients, they need to make sure that the clients won’t get lost after a few clicks and somehow landing on other LOs’ page.

User Journey:

Thrive’s online traffic can be grouped into 3 categories: current mortgage customers, Thrive loan officers, and mortgage shoppers/potential Thrive customers. From prior years’ data, 20-25% of the website visitors were Thrive clients, entering the site from ‘Make a payment’ page; 30% were potential customers entering the site from its home page; 20% of the traffic visited from Thrive LOs’ pages; and the rest 10% are job seekers landing on its careers page.

From the online traffic data analysis, we saw many visitors scattered on the website, visiting a few pages and left the site, without going back to their original LO’s page, or ending the session on an LO’s page. We think the reason was because the website did not have a clear and organized site map, and had outdated UX design. Another drop off point is when they try to find a lo, most of user will want to find one close to them, but they can't decided which one to go, so after a few visit on different lo pages, they just left without reach out to any one. And the visitors came through LOs’ pages not only can’t find relevant information, they sometimes can’t find the original LO’s page after a few clicks, and had to search in LO directory to find their LO. Some visitors changed LOs in this step and others exited the website.

Users landing on Homepage

Users landing on Loan officer's page

Goals:

Increase website traffic and client conversion
 Make the loan application process easier 
Serve loan officers better, make it easier for website visitors to connect with loan officers for services instead of contacting the company
 Improve the loan officer pages to give them individual ownership of their leads and make it easier for them to use and share

Design:

Clearer Hierarchy & better Navigating

Highlight the most important pages, make buttons for them on sticky navigation, fold all other secondary content in a hamburger menu. When we met with the Thrive team, the feedback was that typically their customers care about interest rate more than anything, so they want to talk to a LO directly as fast as possible, rather than searching for the information on website themselves. Based on this finding, we prioritized the “Get Started” buttons as the most important call-to-action so visitors can connect with a LO easily wherever they are on the website, and this way we can decrease the visitors’ drop off rate as well.
On the mobile version with limited screen space, we prioritized LO exposure and kept only the “Find a LO” button.
We improved the categorization of content, so online visitors can find relevant information more easily.
We added elements that are directional and in line with the design style on the different pages to improve engagement.
In order to attract people to stay on the website longer, we added interactions and animations, they are not only make the website more dynamic, also helps navigating.

‍

Leave a trace

The special function we added to the Thrive site was a trace-tag feature. We designed a tag on the sticky navigation of LO pages. If a customer first visited this LO’s page, the sticker will follow the customer and show up on the sticky navigation of all the following pages that they visit. Even if the customer exit the website for a brief moment, as long as they are using the same device, the sticker will show up again if they come back to the Thrive website. This way whenever they are ready to connect with their LO, the contact button and their LO’s picture is right there on the page.

Improve the functionality and content placement of LO pages

To make the LO pages more user-friendly to the LOs, we added Blogs and Mortgage Calculators which are the two most requested features/functions from the UX research survey. This way the LOs are more encouraged to use and promote their pages, and more importantly, to retain online clientele.

Add a interactive branch page

In order to let borrowers feel more comfortable to contact, we add branch pages into the website, so when users not sure about who to contact, they can contact the manager of the branch, on the branch page, we also listed loan officers list, therefore, branch page can increase the exposure for loan officers.

‍

CMS System Optimization:

We Stored most of the content in CMS system, so it would be easier for Marketer to update:

Branch + Loan Officer work together

We designed Branch page and Loan Officer page as templates, ones thrive designer/marketer fill out information from backend, corresponding branch page and lo page will be generated automatically. Since we use branch information and loan officer information across, it avoid requesting put the same information multiple time in different place.