Redesigning a FinTech SaaS for customized and seamless loan experiences

Fiwerx offers a solution capable of intelligently identifying and managing the specific regulatory requirements and loan policies necessary for commercial deals. This tool allows the lender, lending teams, and the institution to get deals done faster and eliminate post-closing exceptions.

  • Fiwerx
  • UX Strategy
  • Userflows
  • Wireframes
  • UX/UI Design
  • Web Design
  • HTML
  • CSS

Fiwerx approached us with a goal of revamping the existing product to design a simplified, and intuitive user experience for loan officers and admins from different banking institutions to let them manage loan applications and process them seamlessly. In order to transform the existing SaaS product, we started off with an interview meeting with the stakeholders to understand their goals and objectives of the product as well as the business, frame the problems to be solved, gather enough information and evidence to initiate on the design process.

  • UX Audit
  • Competitor Analysis
  • User Personas

With the input and understanding from the discovery phase, we started to investigate the problems faced by the users by conducting important research strategies like auditing the user experience in the current product, benchmarking the competitors and creating user personas to get to the root cause of the problem.

  • User Journey Maps
  • Wireframe
  • Visual Design
  • Clickable Prototypes

To make sure the brand’s presence reflects its capability of serving globally, we ensured that we created a design language that reflects scale, trust, capability and success. We also ensured our interaction design and visual design stages went through repeat reviews and validations from first-person users, as well as internal and external stakeholders. The end validated outcome demonstrates Marvelloux capabilities of scaling brands globally, a legacy the studio is known for.

A: UX Audit

We deployed our team of researchers to perform heuristic evaluation, overall findings and enterprise design validation for the UX audit. Once the research was completed, we started to see the problems clearly and with accurate explanation. Three of the main issues found in the product were:

  1. There were too many steps to reach an user’s goal such as adding a new deal.
  2. The overall navigation was elongated with unnecessary steps.
  3. There was no tool for communication between the loan administrators and loan officers.

B: Competitor Analysis

We then started to analyze some of the client’s competitors to examine their user flows and possible actions that users may need to take when interacting with their products. We identified the most effective and common features across the products and analyzed them further to compare their user experience and functionality.

C: User Personas

With the features in-hand, we built user personas of a loan admin and a loan officer to identify their problems and devise product strategies for better understanding of their goals, behaviors and pain points.

56, Male, Chicago
Jerome is a recent college graduate and a marketing lead. He has a growth mindset and is passionate about his career, but struggles to save money and isn’t fully satisfied with the allowances given by his company. So, he plans to invest his hard earned money into crypto in multiple blockchains to earn profits. He is also looking to invest some portion into NFTs as well. He’s looking for a multi-chain wallet app to manage his cryptos.
  • Invest in multiple blockchain quickly
  • Save his wallet passphrase securely
  • Browse across multiple chains easily
Pain points
  • Bad at finding high performance cryptos
  • Forgets the passphrase in multiple blockchains
  • Finds it hard to juggle between multiple blockchains

A: User Flows

After getting an insight of the loan admins and loan officers, we created two separate user flows (one for each loan admin and loan officer) for decision makers and stakeholders a better understanding of the user experience architecture behind the revised product. This helps to minimize misunderstandings and speeds up the overall process. The only key difference in the product is for loan admins. Their interface is created in such a way that they can assign tasks to the loan officers and view the overall operations in a bird’s eye view.


B: Wireframe

We focused on simpler and scalable wireframes with precise keywords in the flow of the user’s journey in the product. This, in turn, would help users to find the necessary goals quickly. We laid down the wireframe from Login to Messaging, meeting all the business requirements in the SaaS. Features like messages and notifications were introduced to make it interactive between the loan admin and the loan officers.

C: Visual Design

We adopted a minimalistic approach while designing the interface of the product. The reason behind was to keep the product extremely seamless to use, so that the users don’t feel frustrated when dealing with lots of documents. The core idea was to help the users to finish an action in just a few taps. Adding subtle color tones worked well to keep the interface light and intuitive. The typography style has been chosen keeping legibility in mind.

D: Clickable Prototypes

We presented a final sample of the product, showcasing how the product works and how each page is interconnected.

What did we pull off in this project?
  • Built seamless, customized experience for loan admins and loan officers.
  • Introduced communication feature between the users.
  • Improved the overall navigation for users to reach their goal quickly.
  • Provided Intuitive UI and smooth viewing experiences.
  • Seamless delivery of complex contents in an organized pattern to make users less overwhelmed.
What did we absorb from this project?
  • We learned how to simplify a complex process into a smooth, few tap process for professionals dealing with a collection of documents.
  • Easy accessibility and usability are the main characteristics to be considered while designing a complex SaaS application.
  • We recognised different documentation methods in the banking industry.