A few UI nits #8
Robin Shen opened 7 years ago

I like the broad strokes of the UI, but noticed a few small things I thought were worth drawing attention to. I've used fairly narrow screen widths mainly for screenshot size, and used a rule to separate distinict thoughts.


Screen Shot 2020-01-18 at 9 02 48 AM I see 2 things here:
  • The spacing, alignment, and color of the "queries" button and the search box could better communicate their logical relationship.
  • The visual harmony can be improved a little by placing the search box and project table on the same vertical line.

Here's an example of what I mean:

Screen Shot 2020-01-18 at 9 12 24 AM
Screen Shot 2020-01-18 at 9 13 09 AM

I took this screenshot right before the breakpoint that hides the "Last Update" column just to point out how much space is still left. I think the column is useful, so it may be worth preserving at smaller widths. To that end, I see a few optimizations that might help carve out space for it at smaller widths:

  • Hide the owner avatar
  • Use "Updated" instead of "Last Update"
  • Drop the "ago"
  • Use a terse time format that abbreviates days/weeks/months/years, like <1d, 5d, 6m, etc.

The "Last Update" column items might be easier to achieve by just generating and hiding a duplicate version of the column and switching between them at narrow widths.


Screen Shot 2020-01-18 at 9 46 25 AM

I see two things here:

  1. The highlight when we hover over a commit row has an uncomfortably tight right/left margin.

  2. The buttons on each commit row can turn into a mess with longer commit messages. Some things that may help:

    • Collapse the commit-ref copy button into the commit button (tap/click the commit button to see a pop-up choice between copy and visit?)
    • Collapsing the buttons into one menu
    • Collapse tags into a pop-up menu that lists all tags when clicked/touched
    • Truncate commit titles (perhaps at 50 characters, as a kind nudge to users?)

Finally, the only thing I went looking for that I found confusing was something like the github "releases" page for a project. It may be that you intend builds or tags to do that duty (and that may be more obvious with more releases in the system?), but I think it provides a useful signal about a project.

1/1
Type
Enhancement
Priority
Normal
Assignee
Issue Votes (0)
Watchers (1)
Reference
OD-8
Please wait...
Connection lost or session expired, reload to recover
Page is in error, reload to recover