About Loop
Challenges
User Persona
Customer Journey
Design Knowledge
Summary
Bibliography
Do banks
hate...
ecommerce?
Here's how we designed an experience that helps users get through looped
e-commerce credit procedures.
Do banks hate...
ecommerce?
Here's how we designed an experience that helps users get through looped e-commerce credit procedures.
Client
Loop Financial Inc.
Platforms
iOS mobile app
Desktop web app
Responsive web app
Deliverables
User stories
Wireflow
UI for web and mobile
Design systems and UI kits
Illustrations and animations
Did we enjoy it?
You bet. But ask clients too.
Ecommerce needs dedicated financial solutions

In 2021, the number of ecommerce businesses ranged from 12 to 24 million. Even though there are more and more people and companies selling on the internet, banks still do not provide them with dedicated and transparent credit services.

Existing products come with low limits and are often just personal products that have nothing to do with the needs of online stores. This is where Loop comes in – a card created especially for ecommerce businesses.

Each product experience has its own rules

Due to the complexity of the procedures, the process of creating UX required us to thoroughly explore Loop’s services and rules for applying for various types of loans dedicated to different users - depending on the size of the businesses they represent.

The key was to guide users step by step through the process of linking the card to the account, as well as transparently explain to them the unique function of the application - creditworthiness, which is displayed in real time and increasing with the growing ecommerce business.

What’s so special about Loop?
One card.
Multiple currencies.
Pay and repay your balances in the currency you actually spend and repay.
Multi-currency support
An extended repayment grace period
Points on Points 
on Points.
Earn points on purchases 
in every currency.
Credit limits based on sales, not
personal assets
Enough money 
for your needs.
Credit limits that automatically scale 
as your expenses grow.
Points program providing additional
perks
Multi-currency support
One card. Multiple currencies.
Pay and repay your balances in the currency you actually spend and repay.
Stop loosing sleep over cash flow.
55 days of interest free purchasing.
An extended repayment grace period
Points on Points on Points.
Earn points on purchases 
in every currency.
Points program providing additional perks
Credit limits based on sales, not personal assets
Enough money for your needs.
Credit limits that automatically scale 
as your expenses grow.
1
2
3
4
/4
Stop losing sleep over cash flow.
55 days of interest free purchasing.
Multi-currency support
An extended repayment
grace period
One card.
Multiple currencies.
Pay and repay your balances in the currency you actually spend and repay.
Points on Points on Points.
Earn points on purchases 
in every currency.
Points program providing additional
perks
Credit limits based on sales, not
personal assets
Enough money for your needs.
Credit limits that automatically scale 
as your expenses grow.
Designed specifically for ecommerce business
The problem with many fintech apps is that the multitude of functions can overwhelm users. And you are surely well aware of it if you have ever tried to find a module in your bank's mobile application that allows you to change credit card limits or conveniently share the account number with your buddies for whose pizzas you paid at the restaurant.
Goal 1: move away from complicated banking procedures.
Goal 2: design a clear and transparent interface, thanks to which the user can fully focus on the distribution and control of money.
Goal 3: build the visually stunning and simple app, keeping the wide-ranging functionality.
Short loops in tune with Miller's Law

While in computers we can expand RAM when the amount of operating memory is insufficient, in the case of the human brain it is not so simple. Miller's Law says that human short-term memory has a capacity of 5 to 9 elements. We followed this principle by designing onboarding and individual sections making sure that each group of components is limited to these specific values.

Jacob’s Law: People like what they know

When we started working on Loop, we devoted a lot of time to an in-depth analysis of popular products created for the financial industry. The forms were prepared on the basis of the mental model of users who could use other applications with a similar purpose. Thanks to this, they could focus on their needs, instead of learning new patterns they were previously unfamiliar with.

Meet user persona
A handsome gentleman with a beard below is one of the many personas created as representatives of the Loop application target group based on the analysis of existing users. Bringing them to life made it possible to see the product with their eyes.
Jeremy Jameson
Occupation: Founder at Amazon Wholesale Company
Saw market opportunity and began to source products from retailers and sell them on Amazon. Running for 3 years now. Rely on Amazon’s marketplace to bring consumer to them.
Problems:
• How does this fit into my current financing structure?
• How quick will you be able to adapt with me?
The uniqueness of Loop is that the more revenue your sales channels generate, the greater your creditworthiness. After connecting the account to the application, the this relationship will be calculated in real time.
solution
Gamification funds
Connecting more stores to the account (Etsy, Ebay, Amazon etc.) or linking the tax profile further increases the credibility of the customer, which once again allows you to raise the limits of the amounts on the credit card.
Gamification of funds

Connecting more stores to the account (Etsy, Ebay, Amazon etc.) or linking the tax profile further increases the credibility of the customer, which once again allows you to raise the limits of the amounts on the credit card.

Customer journey straight from Super Mario and Monopoly

When playing Monopoly, it often takes a new player one round to understand all the rules. In Super Mario, the levels are based on the same mechanics, except that each next one is more difficult. This works great for UX too!

A user who goes through the Loop app once knows the basic rules, and we can add additional layers of complexity. Dozens or even hundreds of such small cycles make it possible to understand the entire complex system. It is the loops that make users smarter and not discourage them from further exploring the product.

First rule: don't annoy the user!

Banks' applications must be inclusive, so that they can be easily handled by people representing different levels of digital competences. In the case of Loop, we are dealing with much more complicated product but designed for a specific group of recipients.

On the other hand, compared to other applications for credit cards, Loop stands out with its transparency and we wanted to show it well. The user has convenient access to information about available funds, credit limits that change in real time and additional costs that have to be paid. What is usually written in small print in the farthest corners of banking products, here is available immediately after logging into your account!

By analyzing our personas, we quickly realized how burdensome the Know Your Customer procedure known from extensive investment applications could be for them. People do not like complex validation procedures, which is best demonstrated by the popularity of cryptocurrency wallets. That is why onboarding had to be as easy-to-use as possible.

Drag me!

Loop stands out with its transparency, and we wanted to show it well. The user has convenient access to information about available funds, credit limits that change in real-time and additional costs that have to be paid. What is usually written in small print in the farthest corners of banking products, here is available immediately after logging into your account!

By analyzing our personas, we quickly realized how burdensome the Know Your Customer procedure known from extensive investment applications could be for them. People do not like complex validation procedures, which is best demonstrated by the popularity of cryptocurrency wallets. That is why onboarding had to be as easy-to-use as possible.

The hidden power of progress bars

Progress bars fulfill their psychological function when they inform the user exactly how much time is still needed. A person running their own business can go through onboarding in minutes, but a large company with a management board had to complete the required data and documents, which could take up to several days.

We used simple names of the stages and optimized onboarding for different types of clients. The process had to coincide with the actual time of passing through the forms and could not be overpromised at the same time.

The implementation of progess bars also allowed to achieve the Goal-Gradient Effect - getting closer to the goal motivates users to action.

Driven by best principles

Promise fit
‍
We wanted to emphasize that Loop lives up to its promises. In this case, our promise fit refers to the creditworthiness information visible in the main views of the interface. If the onboarding was successful and the client qualified for a loan of a certain amount, we wanted to assure him that he was actually entitled to it - without any hidden content or legal pitfalls.

"Aha!" moment
‍
Forcefulness of product experience can be regulated on 4 different levels: what we [DO], what we [SHOW], what we [SAY] and what [INCENTIVE BOOSTS] we will use. In the case of Loop, we are dealing with a high threshold of knowledge. In this case, "Aha!" the moment is when the user realizes that his creditworthiness grows with the development of the business, it is a much more transparent solution than in the case of bank loans, and also that he has a chance to receive a larger loan.

💡 AHA!
‍
Here's what to do to make the users exclaim a revolutionary "AHA!" In their head:
We [DO] slim down experience and show only the UI elements that directly guide to filling in credit application form.
We [SHOW] one clear CTA at each step to force the users to submit details before entering the dashboard.
We [TELL] users what to do with explicit tips.
We [MOTIVATE] users with progress bars, timers and checklists.

Knowledge fit
‍
Designers have their knowledge based on experience, sources and analyzes. However, it must be remembered that users are the main variable of products. Their knowledge is also based on experience and interactions with other services. Knowledge fit includes all the assumptions related to how to design a product to best adapt to their competences.

Drag me!

Knowledge fit
‍
Designers have their knowledge based on experience, sources and analyzes. However, it must be remembered that users are the main variable of products. Their knowledge is also based on experience and interactions with other services. Knowledge fit includes all the assumptions related to how to design a product to best adapt to their competences.

"Aha!" moment
‍
Forcefulness of product experience can be regulated on 4 different levels: what we [DO], what we [SHOW], what we [SAY] and what [INCENTIVE BOOSTS] we will use. In the case of Loop, we are dealing with a high threshold of knowledge. In this case, "Aha!" the moment is when the user realizes that his creditworthiness grows with the development of the business, it is a much more transparent solution than in the case of bank loans, and also that he has a chance to receive a larger loan.

💡 AHA!
‍
Here's what to do to make the users exclaim a revolutionary "AHA!" In their head:
We [DO] slim down experience and show only the UI elements that directly guide to filling in credit application form.
We [SHOW] one clear CTA at each step to force the users to submit details before entering the dashboard.
We [TELL] users what to do with explicit tips.
We [MOTIVATE] users with progress bars, timers and checklists.

Promise fit
‍
We wanted to emphasize that Loop lives up to its promises. In this case, our promise fit refers to the creditworthiness information visible in the main views of the interface. If the onboarding was successful and the client qualified for a loan of a certain amount, we wanted to assure him that he was actually entitled to it - without any hidden content or legal pitfalls.

Fitt’s Law

When designing individual UI screens in the Loop app we put the buttons right under the form. Everything in line with Fitt's law, which is about optimizing user-device interaction and proper ergonomics. A short movement from the last input and the use of standout buttons allowed for an optimal compromise between the accuracy and speed of movement, reducing error rates.

Get to know more about Loop Card

It looks like they liked it! 😊
Positive feedback from the client is the icing on the cake when we finish an engaging but also extremely satisfying project. We know we've given our best, but who doesn't like praise?!
The Loop team was particularly pleased with the in-depth product analysis that led to rethinking certain platform features. A set of custom illustrations, even though initially outside the scope, was our love letter to the Loop team.

Get inspired

Finally, we have some useful links for you to articles, books or publications from which we gained some inspiration while working on a product for Loop. If you want to deepen your knowledge related to UX / UI design, make sure to write this case study in bookmarks, Reading List Pocket or your favorite RSS reader. Your valuable bibliography will then always be at hand!
Outcome-based onboarding for users vs customers
www.reforge.com/brief/outcome-based-onboarding-for-users-vs-customers
Why the best products only do one thing
www.reforge.com/brief/why-great-products-only-do-one-thing
When Customer Journeys Don’t Work: Arcs, Loops, & Terrain
stephenanderson.medium.com/when-customer-journeys-dont-work-arcs-loops-terrain
read the whole review on Clutch