Flows
Components
PATTTTERNS - An open catalog of design patterns | Product Hunt

Made with 💙 by Pablo Armenv2.1.17

/
/
Home
/Patterns
/83. Rewards Notification on Topbar

Rewards Notification on Topbar

 DesktopAwarenessAppreciationWeb

Displays a notification badge on the topbar (navbar) to alert users of new rewards. Clicking the badge reveals a dropdown menu with reward details, enhancing user awareness and appreciation for earned benefits. Notable behavior: Click to open dropdown; Hover to reveal details (optional); Unread notification (badge visible).

Was this useful?
Device (Tabs)
Desktop
System (OS)
Web
Language (i18n)
English
Description
Displays a notification badge on the topbar (navbar) to alert users of new rewards. Clicking the badge reveals a dropdown menu with reward details, enhancing user awareness and appreciation for earned benefits. Notable behavior: Click to open dropdown; Hover to reveal details (optional); Unread notification (badge visible).
VotesUp
VotesDown
Pattern ID
83
UX Flows
Awareness
Appreciation
UI Components
Notification Badge
Dropdown Menu
Navbar
Version
2.1.14
StackExchangeFirst usageSigned inWhy is this a good pattern?
 

StackExchange

First usage

notion image
notion image
 

Signed in

notion image
 

Why is this a good pattern?

â–² Contextual banners do not interrupt user focus on content.
â–² Users are able to dismiss banners without reloading or affecting current content.
â–² Once logged on first-time user get rewarded for using other networks.

Still searching?

Tell us what's missing, and we'll help you find it.

Send feedback