Mocha design examples

Mocha

Signup modal where the user creates a Mocha account with Google, Github, or email.

• Sign Up
• Welcome

Mocha

Signup modal over the Mocha homepage where the user creates an account with Google, GitHub, or email.

• Sign Up
• Account Setup

Mocha

Signup modal where the user creates a Mocha account via Google, GitHub, or email.

• Sign Up
• Account Setup

Mocha

Signup modal where a new user creates a Mocha account via Google, GitHub, or email, shown with an empty-email error toast.

• Sign Up
• Error

Mocha

Signup modal where the user creates a Mocha account with Google, GitHub, or email, after submitting an empty email field that triggered a validation error.

• Sign Up
• Error

Mocha

Signup modal where the user creates a Mocha account with Google, GitHub, or an email address, overlaid on a blurred marketing landing page.

• Sign Up
• Welcome

Mocha

Verification screen confirming that a magic login link was sent to the user's email address products@nicelydone.club.

• Verification

Mocha

Empty apps dashboard where the user creates their first Mocha app, with navigation for All apps, Recent, Starred, and workspace settings.

• Empty State
• Add & Create

Mocha

App list view where the user manages their built apps, currently empty with a prompt to create their first app.

• Empty State
• Add & Create

Mocha

Apps dashboard with an empty state inviting the user to create their first app, plus sidebar shortcuts to Recent, Starred, General, and Subscription & Billing.

• Empty State
• Add & Create

Mocha

Dashboard where the user manages their Mocha apps but sees an empty state and an open account menu with credits, theme, notifications, and sign-out controls.

• Empty State
• Add & Create

Mocha

Empty apps dashboard where the user creates their first Mocha app, showing an apps table with Name, Status, and Visibility columns and no records yet.

• Empty State
• Add & Create