Completed purchases
+74.7%
+11,452
15,326 → 26,778
Compared with the previous month
Impact overview
Checkout completion time
85.7% faster
42s → 6s
Time to complete checkout
GA4 funnel · Monthly comparison
May15,326
completed purchases
June26,778
completed purchases
Ready to buy. Still working to pay.
Picture a 47-year-old VIP member opening the app at 11 pm. She’s picked her item and has points ready to spend.
She taps Buy and then spends 42 seconds scrolling through a form to confirm things she already knows.
72% of shoppers who reached that form never finished paying.
Why we started
The purchase conversion rate was 28%, and customers were dropping off during checkout.
Our goal was to reduce checkout friction and help more customers complete their purchases.
Before
What we found
The existing purchase journey took an average of
42 seconds, from selecting a product to
completing payment. Analysing this journey revealed that customers
were dropping off at the payment stage.
Purchase journey
APPROACH
How I tackled
the problem
STEP 01
Shipped a bottom-sheet checkout in three weeks instead of rebuilding the form
Why this direction?
Development constraints
The existing checkout was tightly coupled with membership and payment logic. A full redesign would have increased development time, cost and the risk of disrupting existing payment flows making it impractical within the launch timeline.
Benchmarking and design direction
Informed a bottom-sheet approach that would let customers check out without leaving the product page. I prioritised speed and a simpler flow over a complete restructuring of the checkout experience.
Why Choose Option B ?
Preserved Structure PDP : Fixed check out btn
Retain the existing form structure and keep the
Pay button fixed at the bottom, so customers can
access the payment action without scrolling to the end.
Trade off
Lower implementation effort and risk, but usability
remains largely unchanged.
Bottom sheet, Reduced information
Added a Buy Now button to the PDP.
Tapping it opens a checkout bottom sheet with only
the essential information, allowing customers to complete their purchase.
Trade off
Prioritised a faster, simpler checkout experience at the cost of additional development time.
STEP 02
Interviewed 10 customers and found we’d ordered the information backwards
Why this direction?
After we introduced the simplified payment UI, customers were still hesitating. So I interviewed 10 of them.
User interview insights
Interviews indicated that customers primarily focused on the final payment amount, applied discounts, and delivery information when confirming payment.
We interviewed 10 users in their 20s–40s, with a range of usage frequencies for the simplified payment service.
Insight 01
3 people prioritise the final payment amount, followed by product info and discount details.
In their 20s–30s(5 participants)
Total amount → Product info → Discount details → Shipping confirmation
Insight 02
Customers usually confirm shipping details quickly unless it’s a special case, such as gift delivery.
In their 40s(5 participants)
Total amount → Discount details → Delivery date → Refund method
Changes based on user interviews
Through customer validation interviews,
we
restructured the information hierarchy around
customer priorities and
eliminated UI friction points in the payment flow.
Before
Original checkout structure
- Shipping info
- Product info
- Payment method
Visual clutter
- Icons
- Boxed sections
- Discount tags
- Too many colours
After
Based on customer priorities
- Product info (total amount & discounts)
- Shipping info
- Payment method
Removed elements
- Icons
- Boxed sections
- Discount tags
- Accent colours
STEP 03
32 days of data showed customers cancelling and buying again
What happened?
Post-launch analysis over 32 days showed that 17% of completed orders involved a payment cancellation followed by a return to checkout and a new purchase. Analysis period: March 27 – April 28 (32 days).
Post-purchase behaviour analysis using GA4
Out of
250 completed
orders
Cancelled payments
43
25
To check
discount details
Users receive 5 base discount benefits, and as high-involvement products include more product discounts, VIP discount details become increasingly important.
18
To use
H.Point rewards
H.Point can be used online, in-store and
with affiliated partners.
Points can be used like
cash (₩), from 1 up to
9,999,999 points.
User interviews
(In their 20s–40s)Core users, particularly middle-aged women, showed a strong tendency to carefully recheck discounts and rewards at the final step.
Interviews confirmed that missing or unclear benefit information increased hesitation right before payment, even when purchase intent was high.
We made checkout fast.
We forgot people
came to check.
A month after launch, GA4 showed that 43 of 250 completed orders were cancelled and placed again.
We’d optimised for speed and removed the two things
our
core buyers most wanted to verify:
Their discounts and their
points.
Speed was never the
whole problem. Trust was.
Trading compactness for transparency
After testing three approaches, we chose the dropdown to keep discount details visible within the checkout flow, trading a more compact layout for greater transparency.
Tooltip
Quick glance, minimal interruption
Discount details appear in a compact tooltip within the checkout screen.
- Easy to view in one place.
- Cannot display all available benefits because it does not support scrolling.
Full popup
Complete visibility, clear messaging
A full-screen popup provides a complete view of all discount details.
- Displays all benefits with a clear information hierarchy.
- Requires an extra action to close the popup and return to checkout.
Dropdown
Detailed information, seamless flow
Discount details expand inline within the checkout screen.
- Keeps all key information visible within a single checkout screen.
- Requires no additional navigation, maintaining a smooth payment flow.
FINAL DESIGN
Streamlined Discounts and Flexible H.Point Payments
After multiple iterations, I introduced a dropdown for viewing all discounts on one screen
and added H.Point redemption, allowing users to apply their preferred amount directly at checkout.
Discount Benefits Details
Maximum discount benefits visible on
a single screen without scrolling.
Using H.point Rewards
Input field and use full amount button
for instant point application
RESULT
Completed purchases
+74.7%
Faster checkout completion
85.7% Faster
Quantitative details
Completed purchases
15,326 → 26,778
+11,452purchases
Checkout completion time
42s → 6s
−36 seccompletion time
User interview insights
10 in-depth interviews · Ages 20–40 · General to VVIP membersFlexible point value
Converting leftover gift card balances into H.Point increased perceived value by allowing customers to use points both online and in-store.
Seamless H.Point usage
Users valued being able to apply H.Point directly without moving to a separate order screen.
Clear discount visibility
Seeing discount benefits upfront reduced hesitation and helped users complete purchases more confidently.
REFLECTIONS
Overlooked
key customer needs
Discount details and H.Point usage during initial order formanalysis highlighted the need for more thorough researchvalidation and sufficient testing before launch.
-
Missing analysis of customer-preferredareas based on the initial order form.
In focusing on scroll and button fixation in the existing order form,I overlooked a more detailed analysis of the Payment Zone Information Check (Step 01)
-
Overlooked the detailed analysis of customers bymembership type on the Hyundai.com platform.
There was a lack of analysis on why customersat different membership levels.
-
Why was this overlookedin customer interviews?
The oversight occurred because the interview questions were primarily focused onaddressing the initial design issues, without delving into the existing order form’s functionality.