kevincoleman
commented
1 year ago Hi @kobakitty,
Please forward along people’s comments to me as well, if you want me to address them. One or two people expressing opinions can quickly become “everyone thinks this” or “everyone thinks that”. I prefer to work with objective feedback when possible. This iteration is just a step in the right direction, so by no means am I saying it’s perfect. I do appreciate the feedback, though, so please know I’m not upset about this!
Most comments i've seen have been about the side panels feeling too wide and there being way too much wasted space, espesially on the right side of screen with the username list.
The only screen sizes I see that suffer from excessive space to the right of the usernames in the right panel are large sizes in which the chat panel itself is unoptimally wide for the sentences it contains. The exception to this, of course, is when people scale the interface using cmd/ctrl +/-, in which case the usernames scale too and that becomes moot. For a reference regarding how wide the chat panel should be for optimal readability, here’s a link to the subject in the book I use when teaching collegiate level typography (Line Length - Butterick’s Practical Typography). This book errs on the side of wide lines, as it was written by a lawyer who doesn’t mind smaller text sizes. I usually recommend keeping line lengths shorter than he recommends (2–3 alphabets’ worth), but in the case of the chat UI we are often near double his recommendation. Suffice it to say that we have plenty of space for the chats themselves.
One upside to the wider bar, of course, is that wider usernames actually get to be seen when they occur. Granted, this is more the exception than the rule, but it is actually a nice accommodation for those with longer usernames, and arguably not an inconvenience for those with shorter names (see the above line length reasoning)
I do think we’re probably looking at a case where people have gotten used to a certain way, and thereby perceive the new way as excessive. I’d posit that it’s just a shifting of expectations we’re seeing—not an actual excessive amount of space.*
People have requested that the width of those panels could be adjusted with "click&drag" type of thing. Also some kind kind of "collapse/expand" buttons for the side panels (like what twitch has) was asked by someone.
Again, I’d like to know how unanimous this response was. “people” means 2 or more, which I’ve seen with you and @anoek. I don’t disagree with this idea, but it’s considerably more involved to implement because of several code and layout-specific reasons. PRs are welcome if you’d like to see it move faster. Also, I responded to this sentiment already here.
Many people like the the alternative background colour of panels for channels and users lists, but the colour should be darked on dark/accessible themes. Not as black as the chat background colour, but darker than pm window background. There was also some wish to have the alternative background colour for the light theme too.
Glad to hear people like it, generally! For both the light and dark themes I’ve used a color that’s already defined by our global site styles, in an effort to make light changes and follow established standards. In other words, I didn’t make this up arbitrarily. The exception to this is that I had to re-instate the off-white color in our global styling because it had been replaced with completely-white. This was noted in the PR, and it didn’t seem to get pushback at the time of merging. If it does cause issues I’m happy to discuss and revise. For the dark theme I could personally see the case for going a bit darker, but keep in mind that this level of lightness/darkness is actually very dependent on the screen displaying the site. Some people will have their screens jacked to the brightest settings with gamma cranked, and others will be chatting on old phones with dimmed night mode and color shift enabled. Making sure that the colors are substantially different errs in favor of supporting a wider list of devices and screens. Actually the thing I’m most concerned about here is the level of contrast for accessibility reasons, particularly between the blue links and the dark grey background. Darkening the background may help in cases where users have a harder time reading the linked text. Then again, so would brightening the blue or changing links out to white—or even underlining them. There’s no single perfect solution here. Again, we’re iterating in small steps for a reason.
The current spacing between the usernames on the list is liked by many, but for groups which have hundreds of users (see https://online-go.com/chat/group-25/go-basics ), and for users who are members of hundreds of groups/tournaments there is now lot more scrolling required. One idea was to reduce the spacing between channels/users on the lists whenever the list is long enough to have a scrollbar, but keep the current spacing when the entire list fits on users screen.
The spacing between usernames in the list has not changed in this revision, so I’m going to have to disagree that there’s a lot more scrolling requried. But everything is always open for discussion. In my opinion as a UI designer the current spacing is actually pretty optimal. As a typographer and type designer I’d say it’s a bit on the tight side (usually reading line heights should hover between 1.5 and 1.8 ems), but as a web dev I understand that we want to push this toward being efficient at displaying long lists. I think this has already been pushed to its reasonable limits. If this is really causing people issues it may be cause for a forum thread to gather data about it. I suspect we’d actually get far more use out of some quick-search functionality in the user list instead of line-spacing adjustments. When the list gets really long it’s very impractical to look down a list of 50+ users to find the name you need, regardless of the line spacing. Changing styling based on if there’s a scrollbar is maybe technically feasible, but it’s pretty non-standard and can actually lead to dynamic layout loops (the list size adjusts, making the scrollbar disappear, which makes the list size adjust back, ad nauseam). Changing display based on screen height might be more practical, but I think it’s likely still not the most elegant solution from a user experience standpoint. The problem is likely not the length of the list, but the ability of users to find things in it. We can ease that problem in better ways than to tighten line spacing (which may actually make it harder anyway).
Also the gap between timestamps and the actual chatlines looks really nice, now it doesnt look as crammed as it did before for users who have mod/ss icons in front of their name.
Huzzah! A tiny win, but details matter, and celebration should ensue. ᕕ(ᐛ)ᕗ
The "day separator" thingy is easy to miss when its on the left side of the chat at the same place as timestamps, people have asked if it could be centered like it used to be.
I was not really sure if this would be better or not. My intent was to semantically group the day stamps with the time stamps and keep text more findable. I was actually most worried about how it would present/perform for cases where the site is being consumed in a right-to-left reading language. From a purely-design standpoint I aimed to anchor it to the side so as to not have centered text floating in the middle of a cluttered window. By and large having no vertical rule to the side of text makes it harder to find and process. I actually think the best solution here would be to add a light horizontal rule across the chat window, whether the date indicator ends up left, center, or right. Take for example how Slack does it. It’s centered, but not without some visual motifs to help users understand what’s there. Happy to iterate on this going forward too.
Hiding the scrollbars when the user isnt scrolling anything, espesially the scrollbar on channels list is too "center of the screen" and feels like out-of-place. Tho i think this might be more depending on what browser you're using, i think chrome will always show scrollbars if they exists?
The scrollbars are indeed primarily styled by browsers, and I’m not sure if we do any intentional styling of them on OGS. I expect trying to override people’s browser styles of them may end poorly. We’d get to play whack-a-mole with every browser, and accessibility would suffer across the board. I agree that some browsers implement better than others, but I think if we wanted to address it we should do so site-wide and make a whole new discussion/request out of it. I’m not sure just what “too center of the screen” means, and I’m not sure what any given version of Chrome does by default.
"More channels" could be written in bolded text so the button pops out more.
An interesting suggestion! Bolding text is normally intended to emphasize words within the context of a paragraph where the surrounding words are of consistent (lesser) weight. Bold fonts are actually less readable, objectively, because the letters’ negative space, counters, &c. get compromised—reducing individual legibility. They do tend to get used for headings, so I can see how that would be a natural solution. That said, perhaps there are other ways to make this stand out more? I personally found a box and an arrow with more generous spacing did the trick pretty well, but I’m certainly open to trying some things! Maybe something to try in a next iteration.
When using the search box under "more channels" the list starts jumping up and down when user starts writing. Seems to be issue only for those users who are in so many group/tournament channels that they need to scroll down to see the "more channels" button.
Interesting! I haven’t seen this issue at all as I’m only in a couple groups. I also tried to get it to act up by resizing the window to some odd sizes and trying some searches. It seemed to be ok to me. Could you find a case where this happens and screen record it? I’d be happy to at least help file the bug here if not fix it once confirmed. Thanks for bringing it up.
Some people have also said that they really preferred the old look, and have wished if that could be brought back as it was. Maybe there could be some switch in the settings for choosing between new/old chat UI?
Thank you for the feedback.* As I mentioned before, I could see the case for an “old skool” or “IRC” mode, but I think if we did that we should consider making it a site-wide style.
Also, I came back to edit this to remember to say thank you! I know your thoughts on this are a donation of your time, and I appreciate it. Let’s consider making new issues over things that we both see as improvements going forward. Happy to keep these in front of mind.
* This is inevitable with pretty much any changes that occur to interfaces that are heavily used. People get used to what they use, and because we’re creatures of habit the tendency is to resist change. That doesn’t mean it’s without merit—only that designers only ever get a mix of substantiated and... eh... reactionary(?) feedback.
kobakitty
@kevincoleman there has been quite few comments and improvement suggestions about the new chat UI, im collecting those comments here under one post if you're interested on developing it further
Most comments i've seen have been about the side panels feeling too wide and there being way too much wasted space, espesially on the right side of screen with the username list. People have requested that the width of those panels could be adjusted with "click&drag" type of thing. Also some kind kind of "collapse/expand" buttons for the side panels (like what twitch has) was asked by someone.
Many people like the the alternative background colour of panels for channels and users lists, but the colour should be darked on dark/accessible themes. Not as black as the chat background colour, but darker than pm window background. There was also some wish to have the alternative background colour for the light theme too.
The current spacing between the usernames on the list is liked by many, but for groups which have hundreds of users (see https://online-go.com/chat/group-25/go-basics ), and for users who are members of hundreds of groups/tournaments there is now lot more scrolling required. One idea was to reduce the spacing between channels/users on the lists whenever the list is long enough to have a scrollbar, but keep the current spacing when the entire list fits on users screen.
Also the gap between timestamps and the actual chatlines looks really nice, now it doesnt look as crammed as it did before for users who have mod/ss icons in front of their name.
The "day separator" thingy is easy to miss when its on the left side of the chat at the same place as timestamps, people have asked if it could be centered like it used to be.
Hiding the scrollbars when the user isnt scrolling anything, espesially the scrollbar on channels list is too "center of the screen" and feels like out-of-place. Tho i think this might be more depending on what browser you're using, i think chrome will always show scrollbars if they exists?
"More channels" could be written in bolded text so the button pops out more.
When using the search box under "more channels" the list starts jumping up and down when user starts writing. Seems to be issue only for those users who are in so many group/tournament channels that they need to scroll down to see the "more channels" button.
Some people have also said that they really preferred the old look, and have wished if that could be brought back as it was. Maybe there could be some switch in the settings for choosing between new/old chat UI?