General UX Thread

[tessgadwa]

This issue thread has been created for collecting / catalog general UX issues and enhancements -- things that aren't necessarily broken but could work a bit better.

Here is a somewhat comprehensive list of issues added to date. Updated 11/19/2017.

Untracked issues:

• Many icons are repeated for different purposes, like the Start Chat and the icon below the number of users General UX Thread #2984 (comment)
• Many icons do not have hints when the mouse is over them General UX Thread #2984 (comment)
• When previewing an image I expect that the preview closes after clicking on the dark area General UX Thread #2984 (comment)
• It could be better to have an arrow to collapse the right sidebar instead of clicking on the person icon, to be consistent with the left sidebar General UX Thread #2984 (comment)
• One minor thing that's been mildly annoying me is how some UI elements in end-to-end encrypted rooms don't obey the room's Tinting. The green padlocks will stay green even if I set the room's color to Blue in settings, which just feels wrong... General UX Thread #2984 (comment)
• UX I would find super handy: being able to swipe left to right from within a convo to go back to my convo list. I constantly try to do it and it just highlights whatever message I'm swiping over. General UX Thread #2984 (comment)
• I find the bot messages to be difficult to read if I have some distance between my head and the screen as the screen is bright and Riot is light and I am supposed to read gray text against white background which might be doable when there isn't so much text, but when all room activity is bots (RSS) integration it gets difficult. General UX Thread #2984 (comment)
• We should have a stronger contrast on color pallette, like level 700 in material design guidelines. The lines in the icons should be also bolder. General UX Thread #2984 (comment)
• Sender text should be bold and optionally colored, not grayed out. General UX Thread #2984 (comment)
• The margin between messages is too big, and we should use some line/color elements to make it smaller. General UX Thread #2984 (comment)
• The default light color scheme is uncomfortable to use on my laptop with a TN screen. The contrast between the colors in the color scheme is low enough that the bad viewing angles of the TN panel makes the colors sort of vary uncomfortably when looking at the screen from slightly different angles (vertically). General UX Thread #2984 (comment)
• Most IRC clients can be operated solely with the keyboard, most web-based chat systems can be operated largely with the keyboard. It would be nice if Riot supported some baseline keyboard behaviour General UX Thread #2984 (comment)
• Determine which general features should be made available for E2E chat, which should be optional, and which should be banned. General UX Thread #2984 (comment)
• Add badge or naming convention to identify bots and distinguish them from human chat participants General UX Thread #2984 (comment)
• No save button in Riot browser settings (fe. when changing nickname) https://vector.im/develop/#/settings - User has to click Enter, unintuitive. General UX Thread #2984 (comment)
• Riot Android defaults to notifying of every message in chatrooms, which results in loads of notifications. - Should notify only at mentions. General UX Thread #2984 (comment) General UX Thread #2984 (comment)
• When catching up with conversation (group, but probably all of them) in Riot Android ie. reading old comments, because people write so fast, when you switch to another chat (because someone sent something important) and the back to where you were, you're on the bottom of the conversation instead of where you were before, you have to scroll all the way up in search of that sentence. - This is a default for Whatsapp, but I think it shouldn't be as it's easy to scroll down (or tap a scroll all the way to the bottom button). General UX Thread #2984 (comment)
• The plus button in Riot Android opens a menu where you choose whether to start chat or create room. I think it should open the 'start chat' view /with/ an option in there to create a room. - Requires unnecessary additional tap. General UX Thread #2984 (comment)
• The view after you tap the search button in Riot Android shows a Rooms pane inside of which is a Browse directory button. When you search for something, it doesn't show the results instantly, but you have to tap that button. The button seems to be not needed at all. A proposed solution: after going to the search view (nothing typed in), in Rooms pane show the rooms directory (alternatively show recently used rooms and a Browse directory button above, but this probably is a less ideal solution, as they are visible in the main view too (unless there are a lot of 1:1 convos) - think it through), consider showing contacts in the People pane, last files in Files pane and latest messages in Messages pane. When you type in something (search) - show the search results immediately with no additional tap required. General UX Thread #2984 (comment)
• I tested SIP with a friend once. She told me that Whatsapp didn't disconnect on network change (mobile to home wifi). I don't know if this is the case with Riot, but mention anyway. General UX Thread #2984 (comment)
• 1:1 conversations are together with group conversations/rooms in the main view of Riot Android. This may be messy. The irc-like group conversations aren't important for people, ie. they don't need them easily-accessible when they are on the go for example, they are something used when you have time for casual conversation with mostly strangers. The situation is different with 1:1 and group chats between friends/contacts (you know, group chats as present in Facebook Messenger, Whatsapp etc.) You want them accessible instantly after opening the app and right now, you will see all the public irc-like rooms (unless they are completely dead) at the top of the screen and the private conversations at the bottom. // This also makes it seem that the app is intended to be used like an IRC client and 1:1 chats are an additive like pms on irc. - Solution: Whatsapp and Messenger do it using panes, one for Calls, one for Chats, one for Contacts. Here it would be one for private conversations, one for public rooms. Think about it. General UX Thread #2984 (comment)
• I'm not sure what are the goals of Riot. The immediate impression is that it's a Slack competitor, an app designed for public conversations in IRC manner, something for collaboration. The slogans on riot.im also indicate that, while my impression from the conversations on #Riot room was that there is some desire to hit the masses, nontechnical people and 1:1 conversations. And the mission described in Matrix FAQ mentions interoperability with existing networks. Well, this won't hit the masses if it's going to be this way. This project has huge momentum and that could be put to good use. Even me, a technical person deep in this stuff, created an account half a year ago and immediately ignored the platform because of the impression that this isn't really what I'm looking for - a second generation messenger (think Whatsapp), but free software and secure. General UX Thread #2984 (comment)
• If you want to appeal to the masses, I think there should be some major UI changes and even website changes (it mentions things like bridge networks or work collaboration). Although maybe this is directed more at where the money is - corporations (similarly to Ring or Jitsi) in which case the UI goals would be different and the name and design choices would be rather strange. I'm willing to discuss this in more detail with others. General UX Thread #2984 (comment)
• There should a an all black theme, not just dark grey (probably best to push it along with the dark grey). - On (AM)OLED screens it uses much less battery and produces much less light which is beneficial for eyes. On all screens, produces less light and is good to use at night, especially in rooms with other people sleeping. General UX Thread #2984 (comment)
• Create a new account button on https://riot.im/app/#/login is small, hard to find. Consider either making it bigger or putting it on a similar background as the Sign in button. General UX Thread #2984 (comment)
• When you create an account and then change your nickname, you can't sign in with your new nickname, but only with the old one. This is because you can't change your login, the old login is still visible when you enter a room. Consider making nickname and login equal? Hide the login and only show the nickname? Hide the server data (is this needed?)? General UX Thread #2984 (comment)
• Riot browser. When in conversation view, timestamps when the messages were sent aren't visible unless cursor is hovered over the message. This provides a minimalistic trendy design, but is not functional, not ergonomic. Therefor this can stay. Although another thing is pretty bad, when you hover over the timestamp you should see the complete date (day, month, year, hour, minutes, seconds), but this doesn't happen. General UX Thread #2984 (comment)
• When you join a private 1:1 conversation, it's called a room, which is very misleading for anyone that never used IRC and a pretty misleading for those who did. If this is meant to be used as a normal consumer messenger, this has to be changed. Also, think about changing private conferences name 'room' to 'group chat' or whatever name proprietary messengers use. General UX Thread #2984 (comment)
• Riot Android. When in conversation view, when you tap a message it get highlighted. I consider this an over-engineered, useless feature. You tap stuff by accident, especially when you're scrolling, when you do, you get annoyed, because you have to tap again to un-highlight. This doesn't provide any usability, as the screen is small and letters are big anyway, you can read the message no problem and you won't have to search for a sentence (like in a book for example) because there's only several on the screen. General UX Thread #2984 (comment)
• Consider adding a Whatsapp like message status inficators - sent, received, read. Right now only read status is obvious, sent is provided (the message turns black). General UX Thread #2984 (comment)
• Avatars of both you and the person whom you're talking with are on the left instead of how it is elsewhere, you on the right, he/she on the left. General UX Thread #2984 (comment)
• Lots of technical chatter in the application, fe. "user turned on end-to-end encryption (algorithm m.megolm.v1.aes-sha2)" (the cipher used will scare the user, show it when hovering or don't show at all?); "user (@user:matrix.org) joined the room" (while user (or user:matrix.org) joined the room would be enough. BTW user:matrix.org is not standard like [email protected] is, but the latter is taken as an email address by a normal person, which is not ideal either. Some brainstorming needed on this issue? General UX Thread #2984 (comment)
• Riot browser. Couldn't all of the settings be fit on one screen without need for scrolling? General UX Thread #2984 (comment)
• Riot Settings. Consider hiding advanced settings like Device list, Cryptography stuff, Server data, Sync request timeout and delay, Version of the application, TOS etc. This could be accessible by additional button "Advanced settings" and only the absolutely necessary stuff be left in normal Settings. General UX Thread #2984 (comment)
• Riot browser settings view. Remove the change password boxes from there, waste of space. Leave just the Change password button that will open another window containing these boxes. Change "Messages containing keywords" to Mentions/When mentioned, something like this throughout the platform. Delete this: "Advanced notifications settings There are advanced notifications which are not shown here. You might have configured them in a client other than Riot. You cannot tune them in Riot but they still apply.", you don't want to see settings of other apps in another app, you can access them in the respective app. General UX Thread #2984 (comment)
• Riot browser. Too many buttons, too much possible tinkering, people don't like tinkering, they want it to just work. There's a button to hide room's user list, to hide rooms list, to show them. // This is useful for the desktop app though, you can put it on the left side of the screen, hide both lists and there's lots of space for messages. A good solution would be to make best default settings for different resolutions and window positions. General UX Thread #2984 (comment)
• Riot browser dark theme. Manage integrations view of the room, letters are not visible. The X button is not visible. General UX Thread #2984 (comment)
• Riot browser room settings. Options you can't change are visible, maybe hide them a bit instead of showing them on the top? Hide Local addresses for this room and Remote addresses for this room parts of the view. Two options for the same setting: Enable URL previews for this room (affects only you) and Disable URL previews for this room (affects only you) - there should be one setting for this. Hide Addresses, Privileged users, Banned Users, Advanced settings and Permissions. General UX Thread #2984 (comment)
• Riot browser. Full room description is not visible when it's long. Clicking on the room's name shows settings, doesn't show the description. // Hovering shows full description. A good alternative would be to instantly expand the top bar when hovering and show full description. This would look better and would be more intuitive. General UX Thread #2984 (comment)
• Riot browser and desktop. If the left pane, list of rooms is hidden, highlight rooms with unread messages. Don't highlight chatter (user joined etc.) General UX Thread #2984 (comment)
• Riot browser and desktop. Room directory. When you type in something to search and hit enter, it doesn't show the results, but opens the room, even if it doesn't exist. It's not really intuitive. It should show the results and allow to choose the result. An option to direct joining a room could be provided if you type in the full address #room:server. General UX Thread #2984 (comment)
• View already verified keys General UX Thread #2984 (comment)
• High contrast icon: https://github.com/taw00/riot-rpm/tree/master/source-riot-extras-desktop/riot-extras-desktop/extras General UX Thread #2984 (comment)
• Add ability to mark messages unread Add ability to mark messages unread element-meta#347
• Panel open/closedness could persist over refreshing the app

Tracked issues:

• Implement Sticker Packs Implement sticker packs #2950
• Better user interface for screen readers and keyboard navigation Better user interface for screen readers and keyboard navigation #2946
• Make it easier to get people chatting: import data files Make it easier to get people chatting (guest access) element-meta#340
• Proper UI for creating custom room tags Proper UI for creating custom room tags #1373
• UI for expiring old megolm sessions that we no longer care about UI for expiring old megolm sessions that we no longer care about element-meta#1207
• User Settings refinements User Settings refinements #660
• Make middlepanel width optionally customisable Make middlepanel width optionally customisable #1371
• UI buttons on right-hand panel are mis-aligned UI buttons on right-hand panel are mis-aligned #3171
• invite UI has become incredibly slow invite UI has become incredibly slow #3204
• invite UI doesn't search displayname invite UI doesn't search displayname #3205
• UI to show whether rooms are public or not UI to show whether rooms are public or not #3206
• Improve Visibility of Encryption "Lock" Icons UX: Improve Visibility of Encryption "Lock" Icons #3317
• dashboard for scalar integ status in usersettings dashboard for scalar integ status in usersettings element-meta#1211
• add UI for setting HTTP proxy to desktop app add UI for setting HTTP proxy to desktop app element-desktop#772
• Room directory icon is not discoverable enough Room directory icon is not discoverable enough #2955
• Please add support for linking to a room (for new people to join it) Please add support for linking to a room (for new people to join it) #3341
• Show more clearly when sending non E2E encrypted message Show more clearly when sending non E2E encrypted message #2850
• "R" logo when searching for users is ugly "R" logo when searching for users is ugly #2934
• Option to autoplay animated GIFs Option to autoplay animated GIFs #2433
• link to community-written guides somewhere link to community-written guides somewhere #3308
• Replace the icons with Google Material Design Icons Replace the icons with Google Material Design Icons #3372
• Community UX feedback from GNOME devel land (metabug) Community UX feedback from GNOME devel land (metabug) #3373
• Compact layout mode for power-users (less vertical whitespace) Compact layout mode for power-users (less vertical whitespace) #109
• Optionally include higher contrast colour scheme Optionally include higher contrast colour scheme #2300
• Start Chat and Invite dialog boxes should make it clear what a Matrix ID looks like Start Chat and Invite dialog boxes should make it clear what a Matrix ID looks like #3533
• Feature request: person icon in "people" room should change color based on presence Feature request: person icon in "people" room should change color based on presence #4199

[youcha33]

Many icons are repeated for different purposes, like the Start Chat and the icon below the number of users

[youcha33]

Many icons do not have hints when the mouse is over them

[youcha33]

When previewing an image I expect that the preview closes after clicking on the dark area

[youcha33]

It could be better to have an arrow to collapse the right sidebar instead of clicking on the person icon, to be consistent with the left sidebar

[ara4n]

Having hitlists like this are really useful (although some of these are duplicates of other issues in the enormous bugtracker) - thanks. please keep them coming :) It may be worth including checkboxes on the issues so they can be checked off when resolved, e.g.:

* [ ] Like this

=>

• Like this

[tessgadwa]

Thanks, I was thinking it might be helpful as a way to separate out UX issues from the whole pool of everything else that's in motion. Some redundancy is probably unavoidable, but the goal is to have a big bucket that's easy to find.

• Comment created
• With checklists!

[ara4n]

yay! for finding existing ui/ux bugs in github, you'd look & search within labels; specifically: https://github.com/vector-im/riot-web/labels/cosmetic and https://github.com/vector-im/riot-web/labels/ui%2fux. However, there are a few hundred at least, so in practice I'd suggest just jotting down quick wins as you see them here, and I can worry about reconciling them with the main bugtracker. It's better to have dups than none!

[tessgadwa]

agree -- I did a quick search before creating the issue, will look through those labels as well

[tessgadwa]

One minor thing that's been mildly annoying me is how some UI elements in end-to-end encrypted rooms don't obey the room's Tinting. The green padlocks will stay green even if I set the room's color to Blue in settings, which just feels wrong...

https://matrix.to/#/!blHeuKmYNNfIqDlWGO:matrix.org/$14847994894067xhrhG:atauno.com

[tessgadwa]

Implement Sticker Packs #2950

[tessgadwa]

UX I would find super handy: being able to swipe left to right from within a convo to go back to my convo list. I constantly try to do it and it just highlights whatever message I'm swiping over.

Submitted from designUX

[Mikaela]

I find the bot messages to be difficult to read if I have some distance between my head and the screen as the screen is bright and Riot is light and I am supposed to read gray text against white background which might be doable when there isn't so much text, but when all room activity is bots (RSS) integration it gets difficult.

I think this might also be an accessibility issue and I hope the dark theme will fix it.

[ishitatsuyuki]

We should have a stronger contrast on color pallette, like level 700 in material design guidelines. The lines in the icons should be also bolder.

Sender text should be bold and optionally colored, not grayed out.

The margin between messages is too big, and we should use some line/color elements to make it smaller.

[vurpo]

The default light color scheme is uncomfortable to use on my laptop with a TN screen. The contrast between the colors in the color scheme is low enough that the bad viewing angles of the TN panel makes the colors sort of vary uncomfortably when looking at the screen from slightly different angles (vertically).

Now it is of course known that TN panels are crap (and I'm waiting for my IPS panel to arrive in the mail) but I still think it's important for the UI to feel nice to use even on a low-quality screen 😃

[jonathanj]

Most IRC clients can be operated solely with the keyboard, most web-based chat systems can be operated largely with the keyboard. It would be nice if Riot supported some baseline keyboard behaviour here too:

• Switch to a specific room/person by name.
• Switch to a room/person by some relative positioning (the last room/person, the room below the currently selected one, etc.)
• Go to the next room/person with activity (prioritising mentions/keywords over general activity, maybe prioritising people over rooms)

[tessgadwa]

Determine which general features should be made available for E2E chat, which should be optional, and which should be banned. Currently unavailable features:

• searching
• notifications on mentions
• listing uploaded files
• bots
• bridges
• voice/video conferences
• URL previews should not be available (by default), but currently are

Searching and listing uploaded files is being worked on by doing it client-side. Bots and bridges could be done in theory, but may not be a good idea depending on your level of paranoia.

[tessgadwa]

• Add badge or naming convention to identify bots and distinguish them from human chat participants

[tessgadwa]

Better user interface for screen readers and keyboard navigation #2946

[bdefore]

Thanks for the dark theme on develop ... it's already quite usable and was able to build the electron version locally after building in node_modules/matrix-js-sdk and node_modules/matrix-react-sdk

[tessgadwa]

Make it easier to get people chatting: import data files #3076

[madduck]

If checklists work in gists, maybe this list could be externally managed there? @tessgadwa

[tessgadwa]

Gists look really good, but is there a way to tie them to a specific repository?

…

On Jan 27, 2017 12:51 AM, "martin f. krafft" ***@***.***> wrote: If checklists work in gists, maybe this list could be externally managed there? @tessgadwa <https://github.com/tessgadwa> — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#2984 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AGLNGxUPaQEskqzWQelFg9LRTMyO8ytPks5rWbAigaJpZM4LnMQr> .

[tessgadwa]

@madduck checklists do work on gists, for future ref

[JasonLocklin]

Can you add: Adapt better to narrow screens #1633: Riot's UI reconfigures poorly when the window is made small.

[ara4n]

@tessgadwa just wanted to say thanks again for curating this epic bug; it's really useful to have so much stuff gathered in one place like this when trying to get perspective on our UX problems.

[tessgadwa]

You are most welcome!

[benrob0329]

In the Linux chatroom, I noticed that the timestamp was behind my avatar:

Riot stable, Chromium Version 60.0.3112.78 (Developer Build) (64-bit)

[MightyCreak]

@benrob0329 have you tried to force reload the page, or clear your cache?

[uhoreg]

@benrob0329: that's #2284

[uhoreg]

Some comments from the discussion with gutigen at around https://matrix.to/#/!DgvjtOljKujDBrxyHk:matrix.org/$15079470492091056AtPEp:matrix.org:

• more variation in background colour, to differentiate different parts of the UI
• "it's hard to tell who is talking out of the box, I think it's the issue with user icon alignment to the text in message and username"
• some UI elements are misaligned, e.g.
  
• "more color changing on hover to indicate immedietaly what UI element is under pointer"
• "and while we are at it, more Emacs or Vim keybinds :D"

[MightyCreak]

"and while we are at it, more Emacs or Vim keybinds :D"

"More"? you got me intrigued now.. are there already some Vim keybinds in Riot?

[heyakyra]

Notifications UX:

#5383
#5278
#5382

[tessgadwa]

Improve the UX for messages that cannot be decrypted #5642

[tessgadwa]

Expose metadata about a homeserver, useful for server discovery and general experience matrix-org/matrix-spec#1258

[croulibri]

• Disconnect : On Riot Web, the "disconnect" / "log out" button is complicate to find. Most of users instead go to the room settings and click on "leave the room", as the difference between "leave the room" and "log out" is not evident for non geek. Could it be possible to have a "log out" button on the top right corner, like most web apps have ?

• Start Direct Chat : On Riot Web and Desktop, when you want to direct chat with one member of a room, you click on its icon/name, and you go to "Direct Chat". Then majority of users click on "Start a new chat" (then creating a new direct chat room) because there is no indication that the above logo and name could be selected on to continue existing direct chat. Would it be possible to have the wording "Continue existing direct chat" in front of the already existing direct chat with this member ?

• Home/welcome page : it is very confusing for non geek to have all these information, chat bot, suggested rooms when you log in Riot web. Could it be personalized in order to remove this information or to include relevant room / communities linked to the server they are connected to ? The welcome page of Riot Android is much more easy to handle.

[MightyCreak]

@croulibri These suggestions makes a lot of sense.

[croulibri]

Thanks @MightyCreak !

Another issue...

• Collapse Event information : The information related to inviting or leaving the room can already be collapsed. Would it be possible to collapse / expend also information related to calls ? This will allow to avoid having many lines occupied by "user make a call" "user answer call" "user make a call" "user answer the call", and will make more visible the chat elements (discussions, file exchanges, etc.).

[ScoreUnder]

I hope this is the right place to post this:

• The notification settings table might benefit from some kind of visual guide separating rows (spacing, alternate row colouring, etc.)
  

[ghost]

Would you add an option to list users and rooms not in this (current) way...

PEOPLE
1 2 3 4 5 6 7 8 9 10

ROOMS
A B C D E F G H I J

...but in this way:

PEOPLE
1 2 3 4 5 
6 7 8 9 10

ROOMS
A B C D E
F G H I J

...so that all PEOPLE and ROOMS listed in more than one horizontal line so that the user is not forced to scroll horizontally?
The current way (at least in Riot F-Droid v0.7.03) is quite confusing because users are more used to scroll vertically (as they are used to do reading a chat: scrolling vertically). More than one time people asked me: where are my contacts and rooms adding more and more contacts).

Thx!

Edit: moved to element-hq/riot-android#1800 (comment) - thx @uhoreg

[uhoreg]

@saljut7 you should post comments about the Android app in https://github.com/vector-im/riot-android/issues, rather than here. This repository is only for the web/desktop versions. Your comment could added either be a new issue in that repository, or a comment on element-hq/riot-android#1800.

[ghost]

The small avatars on the right that show who read a message don't do anything when clicked, apart from lighting up. Maybe it should show their profile like what happens when you click someone's avatar?

[uhoreg]

@mission712 yes, that issue is tracked in #5784 (It actually does to something already: it shows all the read receipts if there are more than 5 on a certain message.)

[ghost]

Would you consider to merge PEOPLE and ROOMS as well as "Start chat" and "Create room"?

People totally understand the "everything is a room" idea. There is no need to separate something that is technically the same.

Idea:

1. Merge "Start chat" and "Create room" by just keeping "Create room" (because everything is a room - people are able to learn this and will experience this later anyway - even using "Start chat" I'm allowed to add more than 1 user, which makes it even more confusing).
2. Show rooms with max. 2 users as circle-avatar like now.
3. Show rooms with more than 2 users with a square avatar.

Thx for Matrix and Riot!

[baardkrk]

Should be able to turn off the 'encryption lock icon' on mobile (Android), such as it is in the web client.

[jryans]

This general UX issue is not actively monitored and doesn't really match our current way of working. I would suggest opening a new issue for each thing. I would recommend focusing the issue on describing your use case so we can understand your perspective, instead of proposing a specific solution.

[morkeltry]

I had to google and come to this page in order to find the link https://riot.im/app/#/login
There are some websites I have seen that place a login link on the front page, or even have the form there ready for you to login when you go there.
Just saying.