gitpod-io / gitpod-io/gitpod

Replace editor empty state illustration

Open
#5,217 6 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

component: ide editor: code (browser) meta: never-stale team: IDE type: feature request user experience
Dominant language
TypeScript
Stars
13.8k
Forks
1.4k
Avg merge
17h 58m
Merged PRs (30d)
5

Description

Problem to solve

Users that have toggled off the welcome page on VS Code are seeing a generic illustration.

See also relevant discussion (internal).

Proposal

We could consider replacing that illustration with something more related to Gitpod, like using a grayscale version of the logo. See optimized SVG code below:

<svg width="213" height="233" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M126.258 11.603c6.312 11.04 2.474 25.102-8.571 31.41l-68.678 39.22a5.82 5.82 0 00-2.939 5.053v61.587a5.82 5.82 0 002.94 5.053l54.339 31.032a5.87 5.87 0 005.819 0l54.339-31.032a5.82 5.82 0 002.939-5.053v-38.3l-48.868 27.556c-11.08 6.248-25.13 2.336-31.382-8.737-6.251-11.073-2.337-25.114 8.743-31.362l69.925-39.43c21.299-12.01 47.652 3.37 47.652 27.811v67.129a43.81 43.81 0 01-22.089 38.042l-62.418 35.645a43.864 43.864 0 01-43.502 0L22.09 191.582A43.81 43.81 0 010 153.54V82.62a43.81 43.81 0 0122.09-38.042l72.74-41.54c11.045-6.309 25.116-2.474 31.428 8.565z" fill="#F3F3F3"/></svg>
BEFORE AFTER
editor-before editor-after

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

No source file or test is named; start by locating the editor empty-state illustration in the VS Code-facing TypeScript code, then compare it with the attached BEFORE/AFTER screenshots and optimized SVG. Done means the generic illustration is replaced with the proposed Gitpod-related grayscale illustration when the welcome page is disabled.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript, vscode
Domain
design, frontend
Issue type
Feature
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.