CSF Loan overview. A desktop window shows a loan application form with fields for personal details and a progress indicator.

Overview

CSF is a web app for GL-AMMK, an SME loan and leasing company in Myanmar. It covers six modules: Underwriting, Contract Management, Accounts Receivable, Accounts Payable, Collection, and Bank Reconciliation. The development team worked far from the staff in Myanmar, and many of those staff had little computer experience. So the interface had to be simple, and training was part of the job. I worked on it as UX/UI Designer at Group Lease.

Achievement

The number of customers grew by 60%.

Business Goal

CSF gives staff in Myanmar a clear, step-by-step way to collect customer information, even if they rarely use computers.

Opportunity

  • Phase 1: Underwriting, Contract Management, and Accounts Receivable
  • Phase 2: Accounts Payable and Collection
  • Phase 3: Bank Reconciliation

Information Architecture

I started by mapping the service and process flows. Then I used card sorting and Treejack in Optimal Workshop to group the information and test the navigation, using the Collection module as the test case. CSF Loan information architecture. A tree connects the application start to personal details, employment, the loan request, documents, and review. CSF Loan personal-details step. The form asks for name, phone, and address, with a next button. CSF Loan employment step. Fields ask for employer, job title, and income, with back and next buttons. CSF Loan request step. Fields ask for the loan amount and term, and a summary shows the monthly figure.

Final User Interface

After watching how staff organized customer details and loan applications, I prototyped in Sketch and presented it in InVision for management sign-off. CSF Loan document step. Upload boxes are labeled for an ID card and income proof. CSF Loan review step. The entered details are listed in sections with an edit link on each and a submit button. CSF Loan confirmation. A message says the application was submitted, with a reference number.

Training & Implementation

Training slides: download an example

GL-AMMK website