Feedback Issue: New dashboard 💬

[gtsiolis]

Objective

The aim of this issue is to gather feedback on the recent changes of the dashboard design to be released at the end of this milestone (March 2021). Any feedback is welcome! 💭

Background

We've implemented the first iteration of the new dashboard design while a) rewriting the frontend part using utility classes, b) building our own components from scratch, and more. We're approaching the development of the dashboard using an MVC (Minimum Viable Change) approach and we plan to iteratively improve existing or add new functionalities in the upcoming milestones. See also component: dashboard label in the issue tracker.

Feedback

Any feedback is welcome but we're primarily looking for the following types of feedback:

1. How could the new dashboard be improved? 💡
2. What didn’t work as you expected it to? 💭
3. What do you like best about the new dashboard? 🧡

Feel free to send in any comments, thoughts, emojis, screenshots, or screencasts as well as open any new separate issues with a concrete problem statement for further discussion.

[erasmuswill]

Where did the dark mode go 😭
Other than that, looks pretty good!

[filiptronicek]

Where did the dark mode go 😭
Other than that, looks pretty good!

That's the only thing missing so far for me, love the new UI and the new logo!

[filiptronicek]

Ok, found a couple of things that I think can be improved:
I would love to have the VS Code logo colored when I hover over it or have it selected. I know that Theia only has a darker logo, but I'm sure there's something that can be done to make it stand out when it's selected, maybe lesser opacity or a stronger grayscale effect.

Right now	My proposal

Also, the billing popup has the old color scheme and logo, just noting that if it got swept under the rug somehow

/cc @gtsiolis

[erasmuswill]

I'm on Chrome OS and ctrl-C and ctrl-shift-C don't work to copy in the terminal any more. I also miss the repo link in the bottom left corner.

[gtsiolis]

Thanks @filiptronicek @erasmuswill! ❤️

1. Dark theme is on our definitely on our radar for the upcoming releases, currently planned for the next milstone (Q2'2021). Added [dashboard] Dark theme #3806 to track this.
2. @filiptronicek regarding the icon colors, we decided to dim the colors from third-party integrations like other git providers and editors but we can certainly consider turning the lights on for the editor preferences.
3. @filiptronicek brand logos will be gradually replaced including the ones in the billing pop-up (see Update Logo / brand #3771). Stay tuned for some more updates on www.gitpod.io tomorrow. 😇

[filiptronicek]

Not sure if this is intended (probably not), but when I search for a workspace, and no results are found, for some reason the New Workspace button disappears.

There is a search result	There is no search result

[gtsiolis]

Thanks for noticing @filiptronicek! This is known, see #3639. Feel free to search for bug reports or feature requests using the component: dashboard label for anything related to the dashboard. 💡

[filiptronicek]

@gtsiolis sorry, my bad, thanks for redirecting me.

[jabuwu]

Hiding unpinned/inactive workspaces is a good change. I'm happy to see dark mode is a priority. Removing the target="_blank" from "Open" is a nice change - I don't think there's much benefit to leaving the workspaces page open. Switching to VS Code by default is a good change, but I won't be using it, since there's no working Vim plugin (or if there is, maybe someone can point me in its direction?) Unfortunately, this rollout seems to have broken the Vim plugin in Theia, but that's a separate issue.

I wish that the Open/Stop operations were more easily accessible. Those two operations are the primary reason I visit the /workspaces page so I think it would be better if they were not behind a menu that takes up so little space on the page.

Edit: I just noticed you can click on the name to open the workspace, but this really wasn't obvious to me. I actually expected clicking it to rename the workspace. Wasn't that an option before, or am I misremembering?

[raghubetina]

If the default filter is going to be "Active", maybe we should expand the definition of "Active" from only "running or pinned" to also include workspaces that were interacted with within, say, the past week? A couple of reasons:

• I just starting reviewing a PR yesterday (I usually create the workspace using the Chrome extension directly from the PR) and will be using the workspace for the next day or two. Now I need to remember to visit the dashboard to Pin the workspace (but I don't really want to keep it); or I have to switch my filter from Active to All every time I come to my dashboard to find it over the next few days.
• If I want to restart a workspace, I have to (click) ellipsis menu, (click) stop, wait for it to stop, it disappears from my list of workspaces, (click) "Filter", (click) "All", find workspace again in the list, (click) to start workspace.

[pattacini]

Edit: I just noticed you can click on the name to open the workspace, but this really wasn't obvious to me. I actually expected clicking it to rename the workspace. Wasn't that an option before, or am I misremembering?

@jabuwu yep in the old dashboard there was the possibility to click on the workspace for renaming it, which is an option I was using a lot and that I'd like to have available again if possible 😀

[shaal]

When clicking on the 3 vertical dots🚦 on the right side of each workspace - the menu opens up (as expected).
If I don't click on the 3 vertical dots again, to close the menu, the menu will show up opened every time I hover above the workspace row.

[gtsiolis]

Thanks @shaal @pattacini @raghubetina @jabuwu! ❤️

1. Regarding the more actions button (🚦), this is known, see relevant issue in Keep hover state and dropdown visible when more actions dropdown is expanded #3731. /cc @shaal
2. Regarding workspace renaming, we refrained from porting this functionality in the new dashboard and focus on improving discoverability and awareness of all the relevant information as well as any new terms that surface when working with dev environments (see Context, etc.). /cc @pattacini @raghubetina
3. Regarding hidden actions in the more action dropdown menu, we're also considering of using the new show-on-hover interaction introduced during implementation phase to surface a button to open or stop each workspace which could help here. /cc @jabuwu
4. Regarding filtering, @raghubetina you're right! The filtering options is something we're up for improving over the next iterations.

FWIW, here're also some thoughts on relevant points that were brought up in the community forum which could be helpful for anyone following this issue, see relevant comment.

[davemecha]

Hi, thanks for this issue for discussing potential changes to the new dashboard UI.

Here are some suggestions:

1. Replace the filter with a simple toggle.
   It only has two states and I have to use it very often. - Otherwise I have to pin every workspace I work with. Till now, I used pinning for workspaces I didn't want to be garbage collected. Now I would have to pin every workspace I actively work with. I want to avoid this, because it leads to more work for cleaning up the dashboard and get rid of all the pinned workspaces.
2. Leave recently closed workspaces as active for some time as @raghubetina suggested. (same reason as above)
3. Please add status labels for the current workspace status to improve accessibility for colorblind (and new) users.
   For me as a colorblind user it is very hard to see and remember the colors for workspace status. I have to hover over the status dot, to find out if the workspace is running or in stopping mode. It happens quite often that I have a short break and come back to work right when the workspace is stopping. I have to wait then, still this is finished to restart the workspace. It would be easier for me to be able to just read the current status.
4. Search through all workspaces when searching
   When I start searching for workspaces, it would be an improvement if the filter would be disabled by default so I every search ist through all workspaces.
5. Display the number of hidden workspaces somewhere.
   When a filter is applied or when I search for workspaces, it would be helpful to know that how many workspaces are not displayed due to filtering.

I'm also really looking forward to the already mentioned hover-buttons for starting, stopping, pinning workspaces. This will be a major improvement.

For those of you who can't wait for a dark theme: I suggest Dark Reader chrome extension as a workaround. It helped me.

Thanks for your hard work on GitPod. The new developments are great and I really like the use of VSCode as default IDE.

[filiptronicek]

Found an interesting one that would probably improve the UX for me:
When the user is logged in (determined by the gitpod-user cookie being loggedIn), the button on the homepage (/ route) still says Login, but I would much rather prefer something like Dashboard

It wouldn't be such a bad fit, too!

[tnir]

Search input box is too small. It should be fully flexible since there is no boundary (border) on this input box.

[tnir]

How can we confirm a workspace is certainly pinned on the list without opening the menu on the right side?

via https://community.gitpod.io/t/new-ui-with-vs-code-by-default/3155

[tnir]

3. Annotation of a workspace is missing. In previous dashboard, we were able to annotate a workspace to distinguish it from another one.

[alesanchezr]

Some feedback from our students and teachers:

Important:

• Bring back the workspace renaming: It's a lot harder to find the workspaces.
• Some workspaces are hidden until you filter: all specially the recently created so I don't really understand how that filter works, student are constantly saying they can find their workspace because of that filter.
• The garbage collection warning should always be visible and I can hide it as a user if I want.

Second priority:

• Specify the default IDE on the gitpod.yml: Unless the gitpod user has already specified its favorite editor on the preferences, maybe we can prioritize from the gitpod.yml
• Teams: We have 316 members in our team and it takes about 6 seconds to display the list of members, at the beginning we thought our team had disappeared.
• Before it was a lot easier to know which projects are pinned and which are going to be deleted, there should be an icon always visible without having to click on the three dots 🚦 menu.
• Remaining hours left: more visibility to the remaining hours warning.
• Dark mode.

[gtsiolis]

Hello @alesanchezr and class! ❤️

Thanks for the detailed feedback!

1. Regarding specifying default IDE on the .gitpod.yml see Allow configuring used IDE Image per workspace #2977.
2. As for the performance issues on the Teams page, this is due to some technical challenges with the current subscription management system which is highly possible to be replaced once we focus on reimplementing plans & pricing on Q3'2021.
3. We're going to work on the remaining hours and usage in [Dashboard] Usage Page #3360. ⏱️
4. Dark theme is already planned for this milestone, see [dashboard] Dark theme #3806 and an early draft design. 🌙
5. Renaming the workspace could become unnecessary once we display more accurate context information on the workspace lists, see Improve the context column information #3594. 🔍

For the rest of the points raised in #3727 (comment), see also relevant comment.

[tnir]

Both starting and stopping workspace is marked as color: bg-gitpod-kumquat rgb(255, 180, 91). Hard to see if the workspace is starting or stopping.

[filiptronicek]

@gtsiolis doesn't ∞ look better than Unlimited?

---

[jankeromnes]

3. Annotation of a workspace is missing. In previous dashboard, we were able to annotate a workspace to distinguish it from another one.

Indeed, thanks for reporting @tnir! I've opened #3946 about bringing this back.

[markfirmware]

https://gitpod.io/plans remaining hours - does not indicate for what date the hours are remaining.

[axonasif]

There are these weird round corner lines appearing for the search bar and only visible when new dark theme is being used.

[tnir]

While 6 weeks passed after the New dashboard, NO improvements on production (not only in GA but also beta or alpha)? 🤔

[erasmuswill]

I feel like it's getting to the point where I'm getting used to some of the annoyances. I'm starting to see a gap for a chrome extension implementing fixes to the dashboard though.
On the bright side, the dark mode is appreciated!

[gtsiolis]

Hey everyone! 🧡

Both starting and stopping workspace is marked as color: bg-gitpod-kumquat rgb(255, 180, 91). Hard to see if the workspace is starting or stopping.

@tnir I've added #4225 to track this feature request. 🍊

@gtsiolis doesn't ∞ look better than Unlimited?

@filiptronicek I like the ∞ symbol but this could make it inaccessible to some users. We'll also get back to this when we'll start working on the plans and pricing reimplementation, see roadmap item. 🗺️

https://gitpod.io/plans remaining hours - does not indicate for what date the hours are remaining.

@markfirmware, agre, I've added #4223 as possible solution for this issue. 💬

There are these weird round corner lines appearing for the search bar and only visible when new dark theme is being used.

@axonasif I couldn't reproduce this with any browser. What system and browser are you using? 🐧

While 6 weeks passed after the New dashboard ...

@tnir the team has worked on fixing smaller issues in the last milestone. While you may have not noticed any big visual changes in the new dashboard besides the dark theme (#3901), we've worked on some functional issues that didn't make it in the previous milestone, that affect user experience at large, self hosted, and more. If you are interested, you can go through the closed PRs or Issues that made it through April or May using the ~component: dashboard label. For example, here are some of these improvements: #3693, #3740, #3756, #3760, #3830, #3869, #3950, #3995, #4051, #4078, #4084, etc. 🏀

On the bright side, the dark mode is appreciated!

@erasmuswill good to hear this! If there's any specific annoyance that wasn't mentioned in this issue or one thing that you'd love to see us fix or improve please let us know! 🌙

[axonasif]

I couldn't reproduce this with any browser. What system and browser are you using? penguin

@gtsiolis I'm using Firefox-v87 on KdeNeon Linux-5.4

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[alesanchezr]

Hello, I'm adding this comment here for reference to #5402

[kiselev-nikolay]

I'm missing the "send incident report" and the indicator of gitpod status. Because of #5594 I've been running into this problem since early this morning, and you seem to have only found out about it an hour ago. 💔

[gtsiolis]

Thanks for the feedback @kiselev-nikolay!

❓ question: Is the missing send incident report referring to the file an issue link that used to be found on the loading screen during an error?

Not sure if we ever had a gitpod status indicator in the dashboard but we recently discussed how system status visibility within the dashboard could look like in #4160 (comment).

We're also considering adding a quick link to the new support page (www.gitpod.io/support) in #5399, which includes a link to file bug in the issue tracker.

[kiselev-nikolay]

@gtsiolis I didn't know there was the support page. Tried to find it but didn't find it before. Thanks, that will be enough, leave a link to the support page on dashboard. The badge idea is good, that would be great. Thank you very much

[gtsiolis]

Closing this as 🅰️ it has been open for more than a year without any new feedback and 🅱️ most, if not all, feedback has been addressed or moved to follow-up issues! Additional feedback is always welcome. Thanks everyone! 🙏