Repository navigation
Keyboard shortcuts are not not easy to parse visually #368
Description
In the bottom bar we have the keyboard shortcuts like
[q] Quit [s] Search [←↓↑→,hjkl] Navigation [↵] Open bug [n] New bug [i] Pull [o] Push
Due to the even spacing, when you look into the middle of the bar, their associativity is not easy to read, e.g. is it Open bug [n] or [n] New bug?
Some simple ideas how the UX could be improved:
- Use alternating text colours (subtle is OK), e.g.
[↵] Open bugin white and[n] New bugin grey. Background colours would also do. - Use 2 or more spaces, like:
[q] Quit [s] Search [←↓↑→,hjkl] Navigation [↵] Open bug [n] New bug [i] Pull [o] Push - Use multiple lines, like:
Quit Search Navigation Open bug New bug Pull Push [q] [s] [←↓↑→,hjkl] [↵] [n] [i] [o] - Use a connecting symbol (possibly also some unicode thing), like:
[q]_Quit [s]_Search [←↓↑→,hjkl]_Navigation [↵]_Open bug [n]_New bug [i]_Pull [o]_Push[q]·Quit [s]·Search [←↓↑→,hjkl]·Navigation [↵]·Open bug [n]·New bug [i]·Pull [o]·Push - Use a separator symbols, like:
[q] Quit · [s] Search · [←↓↑→,hjkl] Navigation · [↵] Open bug · [n] New bug · [i] Pull · [o] Push
Activity
[-]Keyboard shortcuts are not not easy to read[/-][+]Keyboard shortcuts are not not easy to parse visually[/+]MichaelMure commentedon Apr 11, 2020
That's a good point. Not sure which one to choose, screen space is expensive there ...
Another solution would be to move them over a special keybinding popup but that does make it less discoverable.
nh2 commentedon Apr 11, 2020
I would definitely keep it on by default, for new users it is super important to learn what they can do pressing what, I would not have had as good as an experience trying
git-bugwithout it.If you are concerned about screen space, the approach with colours or "Use a connecting symbol" are the most conservative. They use exactly as much space as what's there currently.
For symbols, I think my current visual favourites are dots or triangles
I haven't tried the colours yet because that's more effort.
MichaelMure commentedon Apr 11, 2020
I used "bold" for the last one. It's hard to be subtle with the 16 colors palette of VT100.
I'm leaning toward the triangle one. What do you think?
nh2 commentedon Apr 11, 2020
Some more ideas using background colours (I wrote this gist to make them):
Of this I like row 1 most, row 4 second-most.
MichaelMure commentedon Apr 12, 2020
Row 1 implemented in #372
What I'm wondering is if it makes it easier to read the first time but more obnoxious/invading after ...
nh2 commentedon Apr 12, 2020
I'll use it a it and report back, but I personally find it much less invading if with 1 eye flick I can double-check the key binding -- I find it more distressing/distracting if I have to start searching, so 👍
MichaelMure commentedon May 23, 2020
@nh2 How do you feel about it now ? Looking back at it, it feels a bit aggressive to me with the hard blue/black transition. I also liked having the whole help bar colored instead of just the section with text.
MichaelMure commentedon Aug 25, 2020
Fixed with #372