Wrap design examples

Wrap

Sign-in screen where the user authenticates with Google or via email.

• Sign In

Wrap

Sign-in screen where the user authenticates with Google or email and password, currently showing a loading state for the Google login.

• Sign In
• Loading

Wrap

Sign-in screen where the user attempts to authenticate with Google or email but encounters a visible Firebase popup closure error.

• Sign In
• Error

Wrap

Signup screen where the user can start a 7-day free trial via Google or email, currently showing a loading state on the Google provider button.

• Sign Up
• Account Setup

Wrap

Paywall screen where the user selects between a yearly or monthly subscription to start a 7-day free trial.

• Pricing
• Trial

Wrap

Settings page where the user manages their account with options to upgrade, change password, or log out, alongside an empty state for downloaded items.

• Account Settings
• Empty State

Wrap

Password recovery screen where a modal confirms that a reset link has been sent to the user's email address.

• Forgot Password
• Success

Wrap

Onboarding step where the user selects their preferred browser—Chrome, Brave, Firefox, or Edge—to receive specific installation instructions.

• Setup Wizard
• Getting Started

Wrap

Application download page where the user is prompted to install the Wrap extension for Brave via the Chrome Web Store.

• Media Editor

Wrap

Sign-in screen where the user authenticates with Google or an email and password.

• Sign In

Wrap

Signup screen where the user is prompted to start a free trial via Google or email, currently displaying an authentication popup error.

• Sign Up
• Error

Wrap

Signup page where the user attempts to register via Google or email but encounters a Firebase popup error.

• Sign Up
• Error