top of page
Lenme mobile application
Lending and borrowing money just got easier.
2020
Redesign golden path
Role
Timeline
Team
Tools
Product Design, Visual Design
A month
Lenme Product Desing team, Develop team, Marketing team
Figma, Adobe illustrator, Invision Studio
Lenme is a mobile application that facilitates peer-to-peer lending. The intuitive design easily connects borrowers in need of a small loan- up to $5000 and lenders who are looking to make a profit.
While we were doing rebranding and redesigning for the application, I was in charge of redesigning the golden path. I redesigned the menu by using the most current design system, restructuring the functions based on the users’ feedback.
Project background
01
Redesigning the mobile application
After 2 years in business, Lenme wanted to introduce its redesigned user flow and visual designs. Before I go into the specifics I want to briefly touch on Lenme’s decision to revamp the product as well as my role within the project.
What is Lenme? How does it work?
Lenme is a peer-to-peer lending mobile application. Investors use it to lend money and make extra profits through the app by customizing interest rates, while borrowers use it to get money conveniently and pay it back later. The mobile application makes lending and borrowing money easier, as it allows anyone to invest without a fee or any professional experience/background, and it lets borrowers access the money instantly/and it gives borrowers instant access to the money.
On the mobile platform, individual users can be either investors or borrowers. As a borrower, users can borrow from $50 up to $5,000. When borrowers set the loan amount and pay period, investors then assign a customized interest rate to each loan, depending on the borrower’s credit rating and other information known about the borrower, and then send an offer.
Why redesign?
For the past 2 years, Lenme’s services have been well received by customers and its performance has been comparable to other industry leaders. The product provides data specific to each user and allows us to make our own insights. In accordance with that, we have added more functions and we felt that we needed a better design solution that has more versatile and flexible forms. We also felt that it was time to introduce a new design that could spark interest in a wider audience and allow us to implement more current design trends.
My role within the project
For a year and a half, I’ve been in charge of developing Lenme Enterprise, a project catering specifically to enterprise investors, on a web-based platform. Due to my work on that project, the team leader thought I would be the right person to handle the mobile application’s investor side. The foundation for the new design system had already been laid, but there were still many holes that needed to be filled such as the ‘details’ pages, loan processing color-coding and other components.
My role was to redesign the golden path by implementing the most current design system while creating new design components based on that. At the same time, I updated some pages based on the users’ feedback. I redesigned most of the flow/pages and consulted with the product design liaison who helped me finalize the design.
Background
02
Problems & goals
This project presented certain challenges. I needed to take some time to accurately pinpoint the problems and how I could solve them using my design strengths. After that, I was also able to build the right goals which sent me in the right direction.
Identify challenges and map solutions
Problems & goals
Problem statement
1. Loan management forms were in disarray
2. Inconsistent in borrower details display
We’ve diligently collected reviews from the users since the launch of the service. The golden path, from processing the loan offer to the completion of the loan, has gotten much feedback as well. One of the most common requests from users was to have better loan management forms. When the investors offer loans, each one is operating on its own timelines within the golden path ranging from pending, waiting for the borrower to sign, sign the document, etc. In the previous design, it was often tedious for users to judge the status of a loan at a glance.
Moreover, when the investors reviewed the borrowers’ details, the detail page displayed less and slightly different information and forms as the stage of the loan process progressed. This was done to minimize clutter on the pages that displayed multiple pending loans. However, investors wanted to see consistency in the amount of information offered on the borrowers’ details pages.
Goals
1. Design distinguishable loan process cards with the new design system
2. Show consistent borrower details no matter the stage of the loan
Based on the given problems I set two clear goals. I wanted to make distinguishable designs for different loans so it will help the investors manage their loans easily. Also, I wanted to create consistency in the borrower’s details page. All these are developed with the new design systems in mind.
03
Research
After I identified the problems and goals, I conducted user interviews and analyzed the user reviews to get a grasp of their impressions and interactions with the platform. I also researched fintech companies’ to see how they approached organizing such complex data into a simplified form.
Conducting user interviews and competitor research
Research
User interviews & reviews
The interview targeted investors who have been using the service for a while. They have experienced managing different loans and may have some opinions to develop better user experiences. I already had two big problems in mind but the interview helped me focus on other specific concerns.
Insights from the users
These are the reviews that reflect the most commonly received concerns that we encountered during the interviews.
“The loan cards on My Loan pages are tedious when it comes to distinguishing between different loans.”
The first one was about the different loan cards. There are 5 different pending loan processes and in the previous design, we distinguished them with different text colors but it seems like it was not enough. People are still confused about categorizing the different loans and sometimes miss taking appropriate and timely actions because of the unclear design. I needed to make it more efficient so it would show different loan processes so the investors can respond to requests more effectively.
“I feel like there is too much information to read on one card on the My Loan page. So sometimes I end up overlooking some important things.”
Also, according to the users, each card on the My Loan page looks complicated. My team and I revisited the design and we brainstormed in regards to the problem. Since that is the most important information, we cannot remove or merge it but we identified that there are too many font sizes and colors so we agreed that we need to reduce the number of font sizes and make the card more consistent with the initial card that they view on the Homepage.
“I still want to see the borrower’s financial details during the loan process but they seems to disappear once the loan is initiated.”
Lastly, the users still want to see the borrower’s financial details after they have offered the loan. At the time, the borrower’s details pages displayed different information according to the stage of the loan. When the investor makes an offer they can see the borrower’s financial details including payment history, total accounts, and financial health, etc. However after they made the offer and start the loan process, the borrower’s detail page only shows the stage of the process itself and not the overall information of the borrower. We designed it like this because we didn’t want to make the details pages too long but now that we got an idea of what the investors want we will merge all of the relevant information on one details page.
The competitive landscape
Thanks to a variety of different apps, it’s become easier to manage financial situations and lending information. I researched three apps which were: Robinhood, Coinbase and Credit Karma. These are essential in different categories but they are all in the same fintech industry so it was helpful to see how they organized the complex numbers which have different hierarchies.
The current design styles are based on the same goal of Lenme which is to make financial activity effortless by providing efficient and easy to use tools. I like Robinhood’s utilization of the graph for each company’s stock allowing people to understand the current situation at a glance. Coinbase put different kinds of assets on a page and organized them in a very clear way. Credit Karma provides the same financial information as Lenme so it was very helpful to see how they present multiple Credit factors in one page.
Review the golden path
04
Optimize user flow
To make the investment experience seamless, I revisited the user flow and brainstormed on how I could improve it. I aimed to identify the different loans and their status to make the flow smoother and easy to manage.
Golden path
User flow and loan stages
The information architecture below shows the golden path and I highlight what I redesigned with the pale orange color specifically. Since most of the feedback was about how the information was organized rather than the user flow itself, we didn’t change it but we just added a few more notifications on loan status changes.
After I identified the overall flow, I worked on the different loan stages and their statuses. There are four main stages of loans which are Pending loans, Current loans, Completed loans, and Corrections. The last two don’t have a different status because it’s clear that the loans are completed or are sent to the Corrections. However, for the first two- Pending loans and Current loans, these have 5 and 6 different statuses, respectively. So I added subtle colors for each to distinguish between them. The next step shows how I presented the colors with the status information on the mobile screen.
05
Design process
As I have mentioned, Lenme mobile has the foundation of the design systems, especially borrower specific design components. My job was to apply the new design system to the investor pages while also incorporating other new components to the investors side of the mobile application. Along with that, I worked on revitalizing the borrower details page and My loan screens.
Apply new design system
Design exploration
As part of my design process, I started from hand sketches to generate as many ideas as I can. I sketched out different structures for the borrower details card as well as all the pages for the My Loan menu. After the sketch, I built the wireframe to arrange the items on the pages. Then I created different design options and I brought it to the meeting and we sorted it out to finalize the direction. When I worked on the My Loan menu screens, I organized them in a happy path and overall structure making sure that all parts are well connected.
Design exploration sketch
Borrower detail card & My Loan wireframe
Borrower detail card design exploration
My Loan flow & redesign
Happy path & redesign
Design process
06
Solutions
Based on the research, exploration and iterations, I reached the solutions on how to display distinctive designs for effective loan management and borrower’s details pages.
Introducing the new look
Solutions
1. Redesign distinguishable My Loan page for different loan statuses
My Loan page plays an important role when the investor manages their loans. Since the loans had different stages and statuses, we needed distinctive designs that can help differentiate between multiple loans on one screen.
Differentiations of My Loan page
First of all, we changed the loan card format. In the past, the loans were separated in rectangle cards which resulted in unnecessary spaces between the elements. Therefore, we removed the rectangular shapes and separated them by using color bars or lines.
Secondly, in the previous design, the Pending loan card had a format that was unique from all the other loan cards. In the current one, we unified all the loan cards including Pending loan to ensure fluidity in the design.
Also, loan statuses used to be portrayed through simple text or thin colored bars, in the latest version they are emphasized by using more prominent colored bars.
Differentiations of other loan statuses
Pending loans: Pending loans: In the previous design, the pending statuses were displayed by using text. However, it wasn’t the best way to divide them because they could easily be overlooked. So for the current design, we added the color bar for each loan card and explained the status through text. So people can see the statues by seeing the colors even if they do not read the text.
Current loans: The past design’s processing color bar was tedious so it wasn’t very effective in presenting the loan process and the card had too many unnecessary spaces. So for the current design, we emphasized the processing bar by making it bigger and using distinctive colors. So the users can immediately be aware of each loan’s process.
Completed loans: For the completed loans, we thought that the cards don’t need to be very specific because they're already completed. So we made it simpler than it was in the past so we can display more loans on one page than the previous designs.
Correction: Collections has the same design as the Current loans status bar because it’s basically an extension of that. That’s why we didn’t make a unique design for Collections in particular and use the same format to reduce any confusion.
2. Redesign borrower’s details page and apply it to other details pages
Borrower’s details page is very important because the page makes the investors decide whether they will offer the loan or not. This page also needed to be redesigned as the other pages were so I needed to figure out how I would apply the new design system to this page. To maintain consistency in information throughout the loan process as was requested in user feedback, I made sure to implement the same design changes to each section that had Borrower’s details.
Differentiations of the detail page
Firstly, as in other pages, we removed the rectangular card format and separated each item using lines, reducing unnecessary spaces.
In the past, the Investment Amount and payback period were on the bottom of the page, with the customizable interest rate bar. However, we thought this information should be on top of the page along with the Credit score and Lenme score which were also set during the previous step of the process.
For the interest rate bar, we made it bigger and readjusted some elements so it looks more powerful and simple.
Other detail pages
Borrower’s details pages are used when the investor wants to check the loan stages or statuses. In the past, these detail pages only presented the status and monthly breakdowns. However, in interviews and reviews, we’ve been told that they still want to see other information throughout the process. So we merged the initial information which is in the Borrower profile and Financial health section to the process details pages. So now the investors can see the accumulated information of their borrowers.
Final design and flow
I broke down the happy path into three steps. First, make an offer, second, initiate the transaction and third, complete the loan. I present the three steps below and explain each process.
Make an offer
Investors can see various loan requests on the Homepage and select one of them. When they select a request that they are interested in, it shows the borrower’s details page. The investor can decide whether they want to offer a loan or not by analyzing the information about the borrower. If they like it, they make an offer with a customized interest rate and the offer process ends here. Now, the investors need to wait for the borrower to accept the offer that they have proposed.
Initiate the transaction
Once the borrower accepts the offer, the investor needs to sign a Terms & Conditions document to officially start the transaction. After signing, the transaction is immediately initiated and the money will be sent to the borrower within 3-5 business days.
Loan completion process
When the transaction is started, the loan information moves from Pending to Current and it shows the loan process as it continues on a monthly payback timeline. Each loan status, such as upcoming, paid, late and missed, has their own color legend so it’s easy to track the process. After the loan’s completed, the loan information moves to the Completed menu and the loan ends.
Conclusion
07
What I have learned
It was an experience that helped me admire the intricacies of redesigning a fast-growing mobile application. I was happy to have the opportunity to work on the core function of the app, witnessing it take it’s fully functioning form. Through this project, I have learned how to redesign an app while maintaining the existing design systems. Although the design systems were the foundation, I still needed to create other design components based on the usage, expanding on existing systems. Sometimes I struggled with how I can present multiple numbers on a page with a clear cut look but based on the systems, feedback from many meetings and design iterations with the team, I was able to develop many key design components.
The new design version will be published within 1-2 month and I can’t wait to see the users’ reaction and new feedback so that I can refine the app further. One thing is for sure, perfection is an ongoing process.
Thank you for watching
Conclusion
bottom of page