Lendified —a FinTech UX Project
Intro
When I was approached to lead a team of UX and UI designers on a project with a financial tech company, my initial reaction was skepticism because I knew nothing of the domain. Because I love a challenge, I jumped right in.
What you are about to read is a case study about my role as a product designer working with a FinTech company and what it was like overseeing every step of the design process. After our first day of research with Google Analytics, it was clear to us that we needed to design for mobile first. But to have more of a focused case study, I am going to talk about the desktop redesign.
The Research
Lendified is a company that offers short term business loans. In order to complete this project the team needed to do extensive research to understand the purpose of the product we would be producing. We needed to understand the people applying for loans and why they needed it. This included:
- Hours of youtube, google, and financial blogs
- User interviews
- Hanging with the team at Lendified and asking a lot of questions
- Spending loads of time on their existing site
The Diagnosis
The next step was to see why Lendified needed a redesign. We spent two days tearing apart their current website piece by piece. There were some obvious issues that needed to be solved. Here are some of the items we discovered:
- Information Architecture — during our usability tests, people were not able to navigate a given task within a set threshold of 6 seconds.
- Eye Path — Most people didn’t know where to look on the site to find certain CTA’s (call to actions) or content.
- Competing Icons and CTA’s— It was difficult for users to tell the difference between buttons and icons. Colors, sizes, and placement choices contributed to this.
- Color scatter — Users complained about too many different uses of color and being distracted.
- Latency Issues — Using Google’s site speed test, the current site ranked 27/100. Just like in school, that’s an F.
- Users felt concerned about the credibility as a result of the above. This is a major problem when dealing with a financial site.
Prototype First Approach
We started prototyping and testing as soon as possible. We had our first wireframes done the second day of the project. As the data trickled in, we made new versions and continuously iterated upon those. This became the day-to-day norm of the project.
In order to make the right design choices, we did massive amounts of research on UX/UI patterns. We focused on what works and what doesn’t work for financial companies. Early on in the design process, we established that we needed to be particular in building a product that expressed trust and credibility.
The Information Architecture (Sitemap)
Because of the poor usability testing results with the current sitemap and navigation, we restructured their existing ones that would eliminate duplicate content, increase SEO opportunities, and most importantly enable the user’s ability to find what they need quicker. We gave the mobile sitemap a lot of attention. Through analytics and user testing, data showed that people were using the mobile site very differently than the desktop site. The data also suggested we needed to build a specific IA for mobile. To match the mobile sitemap, we built a mobile only site.
The Usability Tests
This is easily one of the most important parts of the design process. It comes down to seeing if your designs suck or not. We decided to do one on one testing as well as remote. Testing provided us actionable insights, enabling the team to design better experiences. When presenting to the client, user testing was at the forefront of every conversation. One of the most influential tools we used to defend our design was the eye path test. We used a simulation software to develop a comparative analysis of their current site and our redesign.
The UI / Colors
Lendified has a signature green that we needed to work with to stay within brand guidelines. To address the problems of color scatter and competing icons, our lead UI designer created the following style tile. It was important to compliment the signature green and not clash with it.
The High-Fidelity
With all our research and pieces strategically placed, we had enough to back our design choices and have our UI team develop high fidelity mock ups. Here is what the redesigned product looks like in the wild.
Words About The Design Team
I want to give a shout out to the team I was working with and how much our chemistry had an impact on our project. Working with the right people can make or break the experience of collaboration. The group I worked with was stellar. Our ability to communicate, adjust, and shift at any moment was key to our success. Ultimately, trusting each other is what makes the difference between designing a great product or a mediocre one.
The Summary
On a cold Friday, we presented all our data and prototypes to the client. Simply put, they loved it. Success.
Our success came from our granular approach to validating every step of the process. That’s what UX is all about. Every pixel has a purpose.
Reflecting back on the diagnosis section of this case study (IA, eye path, color scatter etc), we provided a solution for each problem. We also went above the expectations of our client by providing future insights for growth.
The end.
