Credit limit
Encouraged timely payments with credit limit design.
Duration
Nov 2025 - Dec 2025
Team
1 UIUX Designer
2 Engineers
1 Product Owner
My role
Planned the feature end-to-end, including scope, requirements, information architecture, and website placement.
Developed design strategies.
Designed UI mockups.
Background
Credit limit as a mechanism to mitigate continuously deferred payments.
In a B2B trading context, customers pay after receiving goods, delaying revenue recognition and creating cash flow challenges. To mitigate this risk, we have implemented a credit limit mechanism that our sales and finance teams actively monitor. When a customer reaches their credit limit, we suspend new orders until they make payments to restore available credit.
Objective
Create a new feature to inform customer credit limits and encourage timely payments.
Our e-commerce platform currently lacks visibility into credit limits, leaving customers unaware of their payment status. This new feature will provide real-time credit limit information directly on the platform.
Design strategies
Developed design strategies to ensure consistent decision-making and alignment with the objective.
Design highlights
Designed a dashboard that visualizes key data, giving users a clear overview of remaining credit, limits, and unpaid invoices.
Created a dedicated My Credit section to consolidate payment information.
Initially, I centralized the credit limit chart and invoices within existing order pages to avoid information scatter. After learning invoices were buried in Transport Detail subpages due to consolidated shipments and shipping fees, I created a dedicated My Credit section to consolidate credit limits and unpaid invoices for better visibility and easier access.
Visualized the remaining credits to improve user awareness.
To enhance transparency, I designed visualizations comparing bar and donut charts. I selected the bar chart for its superior readability. Users can instantly grasp their remaining credit at a glance. When credit drops below 20%, the bar turns red to signal urgency and prompt payment.
Designed alert banners across key touchpoints to communicate credit status and restoration steps.
I created the alert banner to inform customers about their current credit limit, potential consequences, and guidance on restoring credit, displaying this component at different touchpoints such as the shopping cart and the Order by Excel page.
Designed positive reinforcement to acknowledge timely payment behavior.
Since payment is inherently the customer’s responsibility, we cannot offer tangible rewards or incentives for early or on-time payments. Therefore, I focused on using a positive clap icon and text to acknowledge and reinforce customers’ payment behavior.
Result
The new feature lays a foundation for timely payments by giving customers direct visibility into their credit status and due actions.
The feature also helps reduce the workload of the sales and finance teams, as customers can now access clearer information and check their remaining credit on their own.
Lessons learned
Design creates value by aligning user needs with business goals.
Through this project, I learned how interface design can create real value by meeting user needs, such as clarifying what information they require and what actions they need to take, while also supporting the business strategy of driving revenue recognition. I also gained deeper insight into the B2B buying journey, how it differs from B2C behavior, and how the trading industry operates.
