Making deposit requirements clear across POS and customer facing displays (CFD).
* Best viewed on desktop*
Persistent Deposit Visibility
A tiny tweak, a massive impact. By reusing a proven component, we made the flow effortless for merchants and seamless for customers ā proof that the simplest UI changes can drive the biggest wins.
*Due to Non-Disclosure Agreements, specific details and visuals from this project are omitted to maintain confidentiality
The Problemo
The threshold amount was only visible on the main layaway screen, disappearing when the payment modal was opened. This forced sales associates to navigate back to the invoice screen to confirm amounts, adding friction, increasing the chance of error, and slowing checkout.
Business Goals
Ensure deposit requirements were visible at every step of the layaway payment process to reduce transaction errors, improve checkout efficiency, and maintain policy compliance across stores.
Persist threshold information in the payment modal and customer-facing display (CFD)
Minimize navigation between screens for store associates
Increase transparency for customers during transactions
Maintain consistent messaging across POS and admin tools
Support faster training and onboarding for new associates
My Plan
Create a frictionless deposit experience by making the layaway threshold amount visible at every step of the transaction. This included adding a clear, persistent banner in the payment modal and mirroring the information on the customer-facing display.
BASICALLY:
⢠reducing navigation⢠preventing errors
⢠increasing transparency for both associates and customers.
My Role
Lead Designer
As the sole designer, I partnered with the product manager to lead the UX and visual design for the deposit threshold feature, ensuring the minimum deposit amount was visible in both the payment modal and customer-facing display. I iterated quickly based on stakeholder feedback, focusing on clarity, consistency, and a seamless engineering handoff.
Systems Thinking:
Created a unified design across multiple touchpoints, ensuring logic parity and predictable interactions between cashier-facing tools and admin settings. Established scalable patterns for error handling and validation.
Design Ownership:
Led the UX and visual direction for the deposit threshold feature across POS and configuration dashboards. Focused on simplifying logic-heavy workflows while maintaining consistency, accessibility, and data accuracy.
Cross-Functional Collaboration
Partnered directly with the product manager to translate development requirements into a cohesive, user-friendly experience. Focused on ensuring the new threshold information is integrated seamlessly into the existing modal and CFD flows without increasing visual clutter.
Execution Oversight
Delivered high-fidelity prototypes and specs for both modal and in-flow interactions. Partnered with engineers to align on behavior logic and ensure smooth implementation of threshold limits and summary states.
My Process
-
Reviewed the current product to identify similar existing components or UI patterns across other verticals.
Collaborated briefly with other lead designers to ensure alignment and prevent duplicate work, maintaining design system integrity and scalability.
-
Led UX and visual design for the deposit threshold feature across POS and CFD. Created high-fidelity prototypes and interaction flows that balanced clarity with technical feasibility, ensuring consistent user experiences across both touchpoints.
-
Partnered directly with the product manager to interpret business requirements and market insights. Maintained open communication with engineers to validate design feasibility and ensure accurate implementation of threshold logic.
-
Adapted designs in real-time based on evolving requirements and stakeholder feedback. Streamlined visual hierarchy to surface the deposit requirement without clutter, and standardized messaging for easier associate training and customer understanding.
The
Before Pictures
Identifying Opportunity Areas
Hidden Deposit Requirements
1.Main POS
2. Main POS > Payment Modal
In the previous design, the minimum deposit threshold was not visible within the payment modal. Sales associates had to leave the modal and return to the invoice screen to confirm the amount.
Why was this a problem?
Slowed transactions ā extra navigation during checkout created delays, especially during peak hours
Increased errors ā higher risk of associates collecting the wrong deposit amount
Reduced transparency ā customers were not informed about the deposit requirement unless told verbally
Inconsistent experience ā threshold information was available in some parts of the POS but disappeared in others
Info Hidden from the Customer
The Client-Facing Display (CFD)
In the previous design, the Customer-Facing Display (CFD) only showed the total due. The required deposit threshold amount was not surfaced, leaving customers unaware of the payment requirement unless verbally explained by the associate.
Why was this a problem?
Lack of transparency ā Customers had no visual confirmation of the minimum deposit needed to proceed
Increased reliance on verbal explanation ā Slowed transactions and risked miscommunication
Missed opportunity for self-service clarity ā Customers couldnāt verify requirements on their own
Inconsistent UX ā POS had threshold info in some areas, but the CFD never displayed it
Instead of reinventing the wheel, I identified an existing component that could meet the deposit payment need with minimal development lift. By reusing a proven design, we maintained visual consistency, reduced QA time, and shipped faster, delivering value to both POS users and their customers without introducing unnecessary complexity.
Reuse + Repurpose
Finding the opportunity
While reviewing the existing POS flow, I noticed we already had a clear, user-friendly payment component. Instead of creating something entirely new, I proposed adapting it for the deposit flowāsaving weeks of design and dev work.
Applying the Solution
I worked closely with other lead designers to confirm no similar UI existed in other verticals, ensuring we werenāt duplicating efforts. This allowed engineering to reuse patterns, keep behavior consistent, and speed up the handoff-to-build process.
Making Deposit Requirements Crystal Clear
Ensure associates and customers stay aligned during checkout by surfacing the minimum deposit requirement across the payment modal and customer-facing display. This creates a seamless, transparent flow that reduces errors, speeds transactions, and builds trust.
What the Cashier sees
What the Customer sees
Reflection
*
Reflection *
How I grew
Strengthened my ability to identify reusable components, reducing design and development time.
Improved cross-vertical collaboration by consulting other lead designers to avoid duplicating work.
Gained confidence in making quick, strategic decisions that balance speed with long-term scalability.
What I learned
Reusing proven UI patterns maintains consistency and reduces user learning curves.
Cross-team alignment early on prevents wasted effort and ensures cohesive product experiences.
Even small, strategic reuse efforts can have a big impact on delivery speed and engineering efficiency.
What Iād do differently
Integrate earlier feedback from engineers to uncover constraints sooner.
Explore more potential reuse opportunities across other verticals before locking designs.
Conduct quick usability checks to confirm reused components still fit the new context without friction.