Background
Progressive Leasing
Progressive Leasing is a fintech company that partners with retailers nationwide to lease products to the credit challenged consumer.
User Personas
Who is using this product?
"Michael" & "Maria" (Our main demographic) frequently posture a confident air, but often find themselves overwhelmed with their financial reality.
With spending priorities and behaviors that can seem undisciplined, they frequently become financially overcommitted.
Despite confidence in their financial skills and knowledge, they struggle with awareness of funding options(research), approval requirements(get denied), and affordability (late & missed payments).
Role
A team of 6
1 Product manager, 3 Developers, 1 QA, 1 Product designer
Tools: Figma, Usertesting.com, Google Analytics, Usabila
Problem
How to help users understand a very complex lease program?
• Leasing can be a complex thing to newcomers, and we aimed to build a new product that involves even more complex concepts on top of the regular leasing program.
• This new program involves 3 types of items (Leasable, pay in full up front, pay monthly to retailer). Each of these items are paid to different companies, in different ways, and at different times.
• On top of all this we need to explain how a virtual card works.
• We need to explain all this to the customer in a way that they would understand only by scanning the info. (Spoiler, it turns out its not possible to do all this)
Research
Competitive analysis
• No one that I know of is doing this type of program so there wasn't any other companies to look at for inspiration.
• I did some basic competitive analysis looking at basic checkout and virtual card shopping flows.
Solution
Clever design & information organization
• This much complex info needs to be organized and parsed out in such a way that makes sense to the consumer.
• Splitting out each type of item into its own page helps with comprehension for example; Items paid for over time every 2 weeks, items paid for in full up front today, and item paid for monthly to the retailer later would all be on their own page.
Constraints
Ambitious goals
• The business had a very ambitious goal to get this whole product built from scratch in 3 months. (This also involves a very ambitious engineering solution that would make this whole product to be installed on a retailer website with just 2 lines of code). (Spoiler it turned out to be many more lines of code)
Design and testing
Many, many tests, and iterations
I asked users the following questions about each item.
1. Who do you pay for X item?
2. When do you pay for X item?
3. How do you pay for X item?
Here are the results from each design and how I resolved them.
Current design
• The current experience had many problems with it.
• The Pay with P page (1) isn't necessary with this new product because we would be pulling in the cart in the back end and we wouldn't need the user to verify it.
• The current lease summary page(2) could explain the costs better. Currently its missing some line items, which makes its hard for the user to understand how everything is calculated.
• The payment due today info(3) is not needed cause its on the next screen.
• The Payment due at signing page(4) would need some updates to handle non-leasables.
Iteration
Version 1
This version didn't test well at all for the following reasons.
• The cart review page(1) had low comprehension, because people didn't understand the Non-leasable section (2) and how it related to the Payment due at signing (4) page.
• There was a disconnect between the leasable items on the Cart review page(1) and the Cash price on the Review terms page (3).
Iteration
Version 2
This version had some improvements in comprehension, but still had some issues.
• People weren't sure who they were paying for each item and when. Turns out people scan info and don't read everything even if its only 1 sentence(2).
• People understood that some items were Leasable, Non-leasable, and other, but didnt understand much beyond that.
Iteration
Version 3
• With this version I tried to include a carousel with little animations that explained how everything worked. Long story short trying to explain how the virtual card works to a consumer is impossible without having them read a whole novel.
• After trying a few different iterations trying to explain this, I realised its not important for the user to understand exactly how the virtual card works. What's most important is that they understand how to use it to complete their purchase.
Final iteration
• This iteration had the best comprehension results out of all the designs. 80% of users understood who to pay, when to pay, and how to pay for all the different types of items.
• Adding quick scan info (4) along with an icon that explained the main ideas of each type of item was the key to improving comprehension.
• Separating each type of item onto its own page along with all the info needed really helped also.
• Including an agreement box(6) that they need to read and check before moving on not only was a requirement from compliance but it helped improve comprehension of the wireless plan.
• After listening to users talk about each item I changed the page title and the section title to vocabulary that users used themselves.
Results
Sealed a deal with AT&T
• This product was crucial to winning over AT&T and after showing them a demo and how everything worked we finalized the deal.
• This product is now live with AT&T and so far conversion rate is great.
• Not only that but I was able to take a very complex idea and get 80% of users to understand it all under 5min.