🛒 Smart Checkout Prototype
Barbara Melloni
🛒 Smart Checkout Prototype – UX Case Study
💡 Overview
This project improves the e-commerce checkout experience by introducing real-time item updates, dynamic pricing, and a smarter shipping method selector. I focused on using Figma’s variables and conditions to simulate a fully functional, user-friendly flow — perfect for showcasing product thinking and interaction design.
❗ The Problem
Users often find it frustrating to:
Adjust quantities and track price updates in real time.
Understand how shipping methods affect total cost.
Make changes without disrupting the flow.
The lack of dynamic feedback leads to friction and drop-offs in the checkout funnel.
🧩 Key Interactions
🔁 Real-Time Item Updates
Users can increase or decrease item quantities, with totals updating instantly. If an item reaches 0, it's automatically hidden — keeping the cart clean and focused.
🚚 Smarter Shipping Selection
Users toggle between Normal and Pro modes. Each mode displays different shipping options and benefits with a seamless transition.
✅ Results & Takeaways
This project demonstrates how thoughtful UI/UX design can reduce friction during checkout and increase user satisfaction. By using Figma’s advanced features like variables and conditional logic, I created a prototype that feels dynamic, clear, and ready for development handoff.
If you're looking to improve your product's user flow or simplify complex interactions, I’d love to help bring your ideas to life with clean, intuitive design.
Like this project
Posted Jun 5, 2025
A smart checkout prototype with real-time updates, dynamic pricing, and intuitive shipping selection, built using Figma variables and logic.
Likes
0
Views
2
