Logo of UI Challenges
Sign in
Wireframe example for Pull-to-Refresh Feed
An example interpretation of the prompt
Icon of target

Pull-to-Refresh Feed

Icon of book open

Design a mobile feed or list screen with pull-to-refresh as the main gesture. The view should feel like a real content feed, not a demo panel: items continue under the top edge, and the refresh interaction starts from that scroll position.

Show the moment the user drags down from the top and the refresh indicator appears. Make the motion feel native to mobile, with the content stretching or shifting just enough to signal that a refresh is being pulled in.

The indicator should clearly communicate progress: idle, pulling, armed, and refreshing. If the user pulls far enough, the state should flip from hint to action without needing extra explanation.

Keep the feed context visible during refresh so the user knows what is being updated. The design should make it easy to tell whether new items arrived, the list stayed the same, or the refresh is still in progress.

Icon of book open

Use the topmost content item as the anchor for the gesture; if that item slips too far out of view, the pull feels disconnected from the feed.

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.