CitiBank Supply Chain Finance connects three parties in a transaction— buyer, seller and the bank — in order to lower financing costs and improve business efficiency. Supply Chain Finance provides short-term credit that optimizes working capital for both the buyer and the seller.
I collaborated with the client's marketing and product management teams to streamline information architecture, usability, brand identity and UI design.
Award: Global Finance World’s Best Supply Chain Finance Providers 2019
Duration: 5 weeks for phase 1
Design year: 2017-2018
My Role: UX & UI Designer
I followed IDEO’s Human-Centered Design Thinking process to make sure that my design decisions were supported by understanding the users and feedback from usability testing.
Based on the study of manual provided by the client and discussions with the teams, I gained a better insight about the end users, including their main tasks, needs, pain points and imperatives to deliver a better user experience.
By looking into the current sitemap and user flow, I gained a better understanding of the main features that needs to be delivered, and found out the deficiency in the current design.
By sorting out the current site, I defined the problems that we would need to solve:
I conducted a concise feature analysis of the competitors of Citibank's Supply Chain Finance platform in order to get an insight into the common practice and identify their strengths and weaknesses.
I categorized the features in an affinity map and summarized that all the competitors' features fall into these five categories: Dashboard/Summary Page, Financing Request, Notifications/Alerts, Account Management and Customer Support.
We started a round of brainstorming and came up with potential features to solve the problems and achieve the design goals.
We created a new sitemap by sorting the information and features. This gives a clear picture of the navigation and information structure of the site.
The new task flow focuses on user completes the tasks of quick funding, dynamic discounting and discounting request.
I created hi-fi wireframes in order to test the prototype and user interface design.
The objective of the test is to identify
● whether users can quickly learn the new features of the site
● whether users are able to navigate the site
● whether the users are able to smoothly complete the tasks of quick funding, finance request, check status and reconcile receivables.
The usability study showed the following problems:
● Some of the terminologies have led to confusion
● some of the features should be rearranged/redesigned to improve the efficiency of the fund request
The team had another discussion based on the study and came up with a few ideas to improve the terminology, navigation and feature adjustments.
I finalized the color palette, fonts, icons, input fields and other miscellaneous elements based on the Citibank's brand and its current existing products.
