Logo of UI Challenges
Sign in
Wireframe example for Like & Upvote
An example interpretation of the prompt
Icon of target

Like & Upvote

Icon of book open

Design a like/upvote control for a content feed item. Pick a clear interaction pattern: icon only, icon plus count, or a compact vote stack. Show the default state, the active state, and what happens when the user taps it again if the action can be undone.

Make the feedback immediate. The icon, label, and count should change in a way the user can read at a glance. If you use motion, keep it short and subtle; the state change still needs to work without animation.

Place the control where it can be reached without interrupting the feed. It should hold up in tight layouts, on touch screens, and with keyboard focus. If there are separate like and upvote behaviors, make the difference obvious in the visual treatment and wording.

Icon of book open

Humanize the experience! Add a touch of whimsy or delight with an animation that reacts when the like or upvote is given.

Better at UI design with every challenge

Select complexity and generate challenge.

Pick a platform.

You can always choose to receive scheduled challenges. A unique design prompt will be sent to your email daily for the duration you select.

Get design challenge updates in your inbox

New prompts and challenge updates. It’s free.