UX/UI User Reaserch Prototyping

Client information collection made simpler and friendlier using data scraping.

01 -

Project Overview

This project was commissioned by a wealth management company looking to update their designs. They wanted to encourage employees' usage of the company’s internal system when identifying potential clients. Our goal is to get users to complete a full profile multiple times a day.

 Tools Used

Figma

 Roles

User Experience User Research Visual Design Micro Animation

 TImeline

4 Weeks, Fall 2022 

Problems

The tool for client logging is not being used by the employees of the agency, resulting in incomplete client information being recorded all over the system. The tool is outdated, requires full manual inputs for information to be logged, and users have to type while on the phone with potential clients. Redundant information is often required. As a result, agents were barely using the tool; an ecosystem where records are poorly kept was created.

Goals

 Improve Retention

"Tackle the issue of agent retention to the system and ensure that proper records are logged of potential clients."

 Easy to Navigate

"Providing completion status and asking simpler questions to help level set expectations, boost transparency, and reduce cognitive burden."

 New Look

"A clean and simple interface makes this otherwise overwhelming process much more manageable."

 Drop and Pick Up

"Allowing agents to pause and resume progress so that users input the most critical information."

02 -

User Research

The data shown demonstrated that agents 1 to 7 years into their careers only logged about 20% of the Leads they talked with. This statistic only barely rose with the expansions of their client base. Our goal is to get users to complete a full profile multiple times a day.

Reduction of Information Through Automation

Primarily, the low adoption rates come from the outdated design of the Lead system. The original design was only a list of text boxes that had to be filled manually. Most of the information served no purpose other than to take up agents' time. I needed to transform the tool so that it is more effective for both the agency and the agents.

The client developed a new tool, Efact finder, that can scrape the web to help speed up the process of recording client data. This new tool only requires users to enter basic information to complete a client profile. With just a name, phone number, and address, all relevant data of a prospective client could be gathered with the help of Efact finder. The scraped data is sourced from publicly available websites such as social media. This tool has potential to greatly increase agents’ productivity.

Then, we needed to get to know our users. We observed the user feedback to understand where the pain points were.

User Personas

To help with the user flow, we created 2 user personas based on our research, a Financial Representative and a Client Services Associate. These two positions represent the primary occupations that would be interacting with our solution. Both have familiarity with backend tech products, yet they have different years of experience in the finical world. James would be doing more of the cold calling to potential clients and trying to get sales, while Kim would be compiling prospective clients for James to reach out to.

Pain Points

Journey Mapping

Then, I created a journey map that included our intended users’ pain points. I considered how work would be handed to other users for James and Kim. I considered how unfinished work would be handed to another Associate since sending work to another representative is a vital part of the a user’s day-to-day work.

Product Goals

With knowledge of the users’ and clients’ needs, we had a clear idea of what was desired from both. This allowed us to push forward into the creation of the new Lead Suspect Management system.

03 -

Kim needs a system to log all of the Leads she has had an eye on. Efact finder could automate some of that work. My job was to design around Efact finder to help speed along that process.

After consulting with the client’s tech team, we found that we could gather most of the information about a Lead with only a name, phone number, and an address. With these information, Efact finder would scrape the web to find all publicly available data relevant to the Lead. Sources of data could include LinkedIn, Glassdoor, and other social media websites. This is a backend system, so we did not need to design an interface for Efact finder. We just needed to design a flow where agents input the information.

For the user interface, we needed to simplify the complicated old system to something streamlined and efficient to use.

We took inspiration from TurboTax because of its great design that simplifies a complicate task and lead users to the next step. We preformed a design audit of TurboTax and these are the key themes we wanted to follow.

Large Type

TurboTax had excellent typography that condensed what the task was on each page into a few words.

Simple Tasks

To help with agents’ process of filling out complicated information, we learned from TurboTax and limited the tasks on screen to 1 or 2 at a time.

Progress Tracking

Making users’ progression clear is a big part of making sure that users know where they are in a flow and that they are approaching a finished state.

With this inspiration, I built the wireframes with our users’ need in mind. I began by wireframing a simple name entry page. This would give me a starting point for building the rest of the product.

01 - Agent Name

Displays the name of the agent filling out the Lead.

02 - Progress Bar

Shows completion status of the logging of the Lead.

03 - Questions

Questions are kept bolded and concise to keep the agent moving, preventing them from getting overwhelmed.

04 - Text Boxes

Text boxes are larger to make scanning simple.

05 - Continue

Calls To Action (CTA) are in a consistent location at the bottom so that quick muscle memory takes over and speeds up the Lead logging process.

04 -

Final Solution

With our research and feedback on the wireframes, we moved onto our final deliverables.

For the Client Services Associate, they would start by selecting the “Create New Contact.” This adds a new profile in the Leads Suspect Management system and moves Kim onto the flow to fill out basic information.

Adding the Lead’s basic information, i.e., name, contact information, and address, into the Leads Suspect Management system allows the system to search the web for the Lead’s complete profile.

Autofill was added to speed up the process of entering basic information.

A mobile version was also asked for because some associates prefer to type on their phones, or they may have to update the Lead’s information on the go.

If an associate enters the information of someone who is already in the Leads Suspect Management system, they can see if that Lead already exists. If that is the case, then the associate hands their profile over to the Financial Representative.

If the Lead is not in the system, then the associate will create a profile for them. With the power of Efact finder the Leads Suspect Management system will add as much information that it can find on the web. Afterwards, it is up to the Financial Representative to cold-call the Lead and make the sale.

James, the Financial Representative, starts by picking up where the Client Services Associate left off with the profile creation. He clicks on the “Update Existing Contacts” link.

Once James clicks on “Update Existing Contacts,” he looks through the list of Leads in the contacts list. James scrolls though the list and picks the one he was instructed to update by the Client Services Associate.

James cold-calls the Lead in the hopes of asking them to help him complete their profile.

Filling out the additional data brings the user back to the TurboTax-inspired design where James enters in the additional information.

Once a new section is completed, the Lead score is updated. Users can keep working on the updating process until the score reaches 100, at which point, all fields are completed.

Now that the profile has been completed and saved, it is up to the Lead and the agency to discuss arrangements of the deal and how they want their money to be managed.

05 -

One of the most important skills I got from this engagement was the ability to use Figma’s micro-animation system. We wanted our solution to stand out and complement our visual design statement (as mentioned in Overview - Goals).

I went on YouTube to learn to make a progression bar animation so that the user can get a stronger sense of achievement when they clear each step.

Next, I wanted to give the user a dopamine rush when they finish filling in a section. I added confetti to create a sense of celebration.

Icons were animated to spark up flat designs, making them friendlier to users.

When a section is completed, a rolling counter and confetti appear.

06 -

 Time to complete Lead profile

 Average Adoption Rate by Agents

Gains

This project taught me how to use and conduct user research with actual users while communicating with the client. It was an excellent opportunity to analyze who was using a product and how to tailor the experience for them.

Through this project, I learned about both the backend technical details of financial management systems and how to empathize with users in the wealth management industry who have their unique needs and feelings.

I also learned to use the Figma prototyping tool better, adding more clarity to any future prototypes I make. As a former animator, I enjoyed applying my animation skills in completely new contexts.

Check Out More

Lead Suspect Management

Global Mobility

Metaverse Initiative

NECT

Forbes Interactive Article

Weekly Renders

© 2023 John Keefe