
Drag-to-Reorder Grid
Design a mobile home screen-like grid where items can be rearranged by touch and hold, then drag. The grid may be app icons or photo tiles, but it should feel native to a phone: tight spacing, thumb reach, and motion that follows the finger.
The default state should make the grid look settled, not editable yet. Once an item is picked up, the dragged tile needs to stand apart from the rest without breaking the sense of place in the grid.
As the user moves the item, nearby tiles should shift to show the new slot before the drop happens. The challenge is to make the movement legible in a dense layout, where several items may be displaced at once.
Include the small cues that teach the gesture: how a tile is selected, what happens to the original position, and how the user knows the reorder is still in progress. Keep the interaction fast and tactile rather than modal.
Use one strong lift treatment for the grabbed tile, then make the surrounding tiles move just enough to imply the target slot; too much animation makes the grid hard to read.
Better at UI design with every challenge
Select complexity and generate challenge.
Pick a platform.
Get design challenge updates in your inbox
New prompts and challenge updates. It’s free.