Todoist design examples

Todoist

Sign-in screen where the user authenticates with Google, Facebook, Apple, or email and password.

• Sign In

Todoist

Password recovery screen where the user enters their email address to receive a reset link.

• Forgot Password

Todoist

Signup screen where the user can create an account using Google, Facebook, Apple, or email, alongside social proof statistics.

• Sign Up

Todoist

Full-screen loading state displaying the application logo and a spinner before the interface resolves.

• Loading

Todoist

Onboarding step where the user uploads a profile photo, enters their name, and toggles team usage before continuing.

• Account Setup
• Profile

Todoist

Onboarding step where the user enters their name, uploads a photo, and chooses whether to use the app with a team.

• Onboarding Checklist
• Add & Create

Todoist

Onboarding step where the user selects their role and opts into extra help while viewing a preview of their workspace.

• Onboarding Checklist
• Setup Wizard

Todoist

Onboarding step where the user selects their role and opts into extra help setting up the app.

• Onboarding Checklist
• Account Setup

Todoist

Onboarding step where the user names their new team workspace, accompanied by an illustration showing how team projects appear alongside personal ones.

• Setup Wizard
• Team Management

Todoist

Onboarding step where the user invites teammates by entering their email addresses, copying an invite link, or skipping for now.

• Invite Teammates
• Team Management

Todoist

List view where the user manages active projects within a team workspace, featuring a search bar, filters, and an onboarding popover explaining the workspace concept.

• Team Management
• Filter & Sort

Todoist

List view where the user can browse, search, and filter active projects within a specific team workspace.

• Browse
• Team Management