Gitpod design examples

Gitpod

Sign-in screen where the user authenticates with GitLab, GitHub, or Bitbucket alongside a grid of product feature highlights.

• Sign In

Gitpod

List view where the user configures their workspace environment by selecting a preferred IDE like VS Code or IntelliJ from a modal.

• Model Selection
• Settings

Gitpod

List view of workspaces with a modal overlay where the user selects their preferred IDE, such as VS Code or IntelliJ, and can opt into the latest unstable release.

• Select

Gitpod

List view where the user is prompted to create their first workspace because none exist yet.

• Empty State

Gitpod

Dashboard where the user lands to manage their workspaces, currently showing an empty state with a prompt to create a new one.

• Empty State
• Files

Gitpod

Creation screen where the user enters a name to set up a new team for managing multiple projects and group workspaces.

• Add & Create
• Team Management

Gitpod

Projects list view in an empty state, prompting the user to create their first project or invite members to the workspace.

• Empty State
• Invite Teammates

Gitpod

Creation screen where the user is prompted to configure the Gitpod app for their GitHub account before they can import a repository.

• Account Setup
• Add & Create

Gitpod

Create page where the user selects a Git repository from their connected GitHub account to start a new project.

• Add & Create
• Select

Gitpod

Creation step where the user selects a personal account or team workspace to host their new project.

• Workspace Switcher
• Add & Create

Gitpod

Success screen confirming a new project was created, with a prompt to start a new workspace.

• Success
• Dashboard

Gitpod

System error page indicating a repository was not found, prompting the user to grant Gitpod access to private repositories, alongside a helpfulness feedback widget.

• Error
• Confirmation