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

Ban & Block

Icon of book open

Design a moderation control surface for banning and blocking users or content. Treat this as a settings screen, not a warning modal: users should be able to review current restrictions, add a new restriction, and remove one without losing context.

Separate the two actions clearly. Ban and block should not feel interchangeable; show what each one applies to, what it affects, and how long it lasts if duration is supported. If the product supports both people and content, make that distinction visible in the layout and labels.

The main screen should surface the current list of restricted accounts or items with status, reason, source of action, and date applied. Include a primary action to add a new ban/block, plus secondary actions to edit, lift, or view details. When the user starts a new action, show a confirmation state that spells out the consequence in plain language before they commit.

Include list empty, loading, and failure states. If an action succeeds, show immediate feedback and keep the updated item visible so the change is easy to verify. Make the hierarchy readable and the recovery path obvious.

Icon of book open

Infuse empathy into your design by offering users a reversibility option or a cooling-off period, making the interaction less final and more user-centric.

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.