Improve the readability and ux of gitlab project overview (landing) page

Description

The first page of any project marks the first impression and often times sets the precedence for users/contributors of the project. I have noticed a number of improvements that can be made towards a better user experience.

Proposal

This proposal is to improve better usage of whitespacing, numerical metric highlighting. Disclaimer, this is based on my screen width of 1600px which is what most engineering teams use in Enterprise & Startups.

1. The amount of white space seems inconsistent between the different pages or even in the same page but different state. See reference section below
2. The project information header links can be a bit overwhelming, at a glance it feels like it's one sentence all together. I feel that I have to spend more time glancing at it before I make a choice of selection.
3. The project directory structure view can provide more info to the user at a glance

• The commit information often times contain ellipsis and does now show the full message. Github seems to pack in more information. See comparison below
• We do not show the user a hover tooltip - alt text when the text is too long. This can be annoying, not only is the information not available, the user needs to do an extra click to get that information.
• Increasing the white space width may create more screen real estate to better represent the information.

4. The project url text box shows only 50% of the url most of the time. The width is small that most of the time the url cuts off at the beginning of the username. See below

Links / references

Inconsistent whitespace between the pages

This is a comparison from Overview/details empty state and populated state and Overview/activity page The details page which is the landing page has a lot more white space.

Better readability on project header links

I think this can be solved with using background highlight on numbers/metrics on the page. File size, commit, branches and etc.

vs

Project directory structure / commit view

For some reason I feel that Github's structure is more readable and I was able to get all of the information that I need at a glance. The commit message is wider and I see less ellipsis (...)

I also compared the width of the table, Github's is definitely wider (taking more advantage of the white space)

We also do not show tooltip Gitlab vs Github

Showing full or most of the repo path

The project url text box shows only 50% of the url most of the time. Most of the time the url cuts off at the beginning of the username. To see/read the url I would have to scroll sideways in the text box or copy and paste it in another location.

vs