5 Interactive UI Cases That Boost User Engagement – Lessons from NAVER, Agoda, Airbnb, Zomato, and TooGoodToGo

Weekly Design Share – Issue #7

Every Tuesday we share recent online cases worth learning from, aiming to uncover inspiring designs and spark new ideas.

1. NAVER – Interactive Banner

NAVER’s homepage features a real‑time, interactive banner that uses motion cues and partial masking to attract attention. Users can swipe to reveal a marketing poster and close it to return to the original state.

Attract user attention: bouncing bubbles and arrows guide users to swipe left, revealing a contrasting marketing visual.

Scratch‑off style interaction: users control swipe progress; a simplified view appears for uninterested users, while an expanded view shows more information for engaged users, with a toggle to close.

2. Agoda – Coupon Tag Animation

When users search hotels on Agoda, a coupon animation is triggered on the results list.

Strengthen anchoring effect: motion locks the user’s focus on price information, emphasizing discount magnitude and encouraging purchase decisions.

Industry innovation: the animated design differentiates Agoda from competitors and reinforces its low‑price positioning.

3. Airbnb – Direct Review Button

Airbnb adds a book‑style icon at the lower‑left corner of each listing image. Clicking it opens a page with host details and guest reviews.

Enhance user experience: the icon adds motion and draws clicks.

Shorten interaction path: users reach key information directly without navigating through multiple pages.

Highlight product keywords: tags like “Superb Host” and “Guest‑Recommended” appear on the image, helping users locate relevant listings.

4. Zomato – Membership Prestige Animation

Zomato’s paid‑member visual style emphasizes exclusivity, triggering a ceremonial animation when a user upgrades.

Boost sense of prestige: black‑gold colors with text glow give the member module a premium feel; a flat crown icon and subtle geometric background create memorable cues.

Positive emotional feedback: metallic sparkle and confetti effects reinforce the user’s feeling of achievement.

5. TooGoodToGo – Dynamic Pricing Product

TooGoodToGo, a top‑ranked food‑waste‑reduction app, introduces a dynamic‑price product that lowers prices to sell unsold food.

Value‑oriented information design: copy and graphics avoid discount‑centric messaging, focusing on environmental value and surprise.

Motion reinforces memory and surprise: animated tags on the home page educate users, while continued motion on the product detail page strengthens recall and creates delight.

Conclusion

This issue’s design share ends here. The cases and insights come from the ZhiXing UED team’s daily work. We will keep exploring and applying these methods to improve the ZhiXing app experience. See you next Tuesday!