Logo of UI Challenges
Sign in
Wireframe example for Welcome Badge Screen
An example interpretation of the prompt
Icon of target

Welcome Badge Screen

Icon of book open

Design the mobile onboarding screen that introduces a new achievement or welcome badge. It should feel like a small celebration, not a reward ceremony: a clear badge graphic, a short title, and a supporting line that explains what the badge means.

This lives in the first-run flow, so the user is still orienting themselves. The layout should make the badge the focal point while keeping the surrounding UI calm enough that the message lands fast on a phone screen.

Treat it as a lightweight moment after a milestone or account setup step. The screen may be a full-screen interstitial or a modal-style dialog, but it should still read as part of onboarding and not as a separate feature page.

The interesting part is balance: make it feel special without blocking progress. The composition should support a quick acknowledgment and a clear way to continue into the app.

Icon of book open

Use scale and spacing to make the badge feel earned; even a simple icon can feel celebratory if the title and body text are tightly grouped and the primary button sits just below them.

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.