Coda design examples

Coda

Signup modal overlaying a public document, prompting the user to authenticate with Google, Microsoft, SSO, or email in order to copy the document.

• Sign Up
• Account Setup

Coda

Signup modal with an email validation error, offering OAuth and SSO options to copy a public document.

• Error
• Sign Up

Coda

Sign-in modal where the user authenticates with Google, Microsoft, Apple, SSO, or email and password to copy a document.

• Forgot Password

Coda

Sign-in modal with validation errors for email and password fields, offering Google, Microsoft, Apple, and SSO authentication options over a document view.

• Error
• Forgot Password

Coda

Password recovery modal overlaid on a document where the user enters their email address to receive reset instructions.

• Forgot Password
• Confirmation

Coda

Password recovery modal where the user is prompted to enter their email address, currently displaying a validation error for an invalid email format.

• Forgot Password
• Error

Coda

Interactive learning guide where the user reads a welcome introduction and can duplicate the document to start their learning journey.

• Welcome
• Tutorial

Coda

Content editor where the user searches for 'welcome' in the sidebar and previews a specific page result before copying the document.

• Search
• Browse

Coda

Form page where the user can report content for spam, harassment, or rules violations and provide additional comments.

• Report
• Confirmation

Coda

Form where the user can report content for spam, harassment, or rules violations, currently showing a validation error.

• Report
• Form

Coda

Community homepage featuring a prominent search bar, top categories, maker highlights, a recent discussion feed, and a full category directory.

• Browse
• Search

Coda

Community forum homepage where the user searches for topics, posts, and users via a central command palette overlay.

• Global Search
• Navigation Menu