Project

General

Profile

Task #7876

UI/UX improvement suggestions for matrix

Added by Redmine Admin 7 months ago. Updated 6 months ago.

Status:
In Progress
Priority:
Normal
Target version:
-
Start date:
03/23/2020
Due date:
% Done:

0%

Estimated time:
PM Check date:

Description

Riot web / general

  • remove the separation tab of Direct Messages and Rooms -> this damages readability
    • An option to disable all categories might do this
    • Adding to this: scrolling inside the groups can be very painful and fields are often too small
  • disable color differentiation for each user name: make them all same, muted color.
    • Afaics this refers to the avatar - maybe an option to disable avatars all together
  • Numbers of unread messages on channels are not helpful
    • Proposed solution: Indicate unread by bold only, remove the number count
  • When creating a new public room the "room alias" field is empty and needs to be filled in manually
    • This should be automatically derived from the name as a suggestion
  • When inviting people to a room, local people (@xx:ungleich.ch) show up for a second and then vanish until I type the full name
    • i.e. typing @xx - shows the name, I want to select it, it vanishes
    • other people from other matrix servers are shown as suggested
    • then finishing @xx:ungleich.ch shows it again
    • Solution: don't make it show and vanish, but keep it
  • Too much margin between text groups damage readability
    • While chatting, the vertical spaces between texts are too high and waste space.
    • The horizonal space between profile picture and the name is too wide, makes it harder for eyes to coherently follow who wrote what.
    • Time of writing is not shown by default and only reveals on mouseover, requires extra movement for catching information.
    • Having to jump big spaces between different information (who wrote it what, when) makes it hard for the eyes to focus.
  • It is "impossible" to delete a room
    • There is no delete button
    • There seems to be a workaround to kick all users, make it non joinable (how?) and leave it
      • untested
    • Very basic functionality seems to be missing
  • When creating a new room and inviting users, nick autocompletion when writing a message does not work
    • This only works when invited users joined
    • This is very limiting/confusing, as one might want to write already messages for the people who join eventually
    • Even if they don't join, the autocomplete should be able to reference people who are invited
  • When writing in "direct chat", nick auto completion of OTHER users I write to does not work
    • Use case: "Did you talk to @s..." -- does not autocomplete
    • Suggestion: have a general auto completion, independent of the room I am writing in
  • Selecting auto completion of users is easier in mattermost:
    • mattermost shows a list and allows to finish by <tab> or <enter>
    • matrix requires arrow up or clicking
  • There is not emoticon selection list for regular messages
    • However there is one for reactions
    • This is a bit inconsistent and confuses -> should be consistently available
  • Room classifications (low, favorite, etc.) seem to be CLIENT specific
    • Opening the browser on a different computer gives an old/different room view
    • Causes a lot of extra work for organising, i.e. x times for x devices
  • Sometimes the members are shown instead of the room title in the room list (???)
    • See attachment to this ticket
  • Mattermost has a "thread view" where one can show all messages in a thread
    • it only appears if you click on the reply button next to one of the messages in the thread
    • it is quite convenient to show old threads
  • Inconsistent scroll bar behaviour
  • When being in an empty room (i.e. for sharing messages with yourself) a warning repeats
    • "There's no one else here! Would you like to invite others or stop warning about the empty room?"
    • Even clicking "stop warning" the messages comes back (different device, different browser)
      • Where are those settings saved?
  • Cannot search for parts of an URL
    • Specifically "https://support.ungleich.ch/Ticket/Display.html?id=X", searching for X returns results in mattermost, but not matrix
    • Where is search located at in matrix? Server? Client?
  • When editing a multi line message, cursor up at some point goes into editing the PREVIOUS message
    • When not having text to be sent inside the text field for sending messages, this behaviour makes sense
    • However as soon as there is text in the text bar, it should not move up to previous messages anymore
  • Shields are inconsistent (riot-web 1.6.0)
    • In 1:1 rooms the shields (black/green) appear, even if room is not encrypted
    • In n people rooms shields are not displayed next to the participants

RiotX


Files

2020-04-07-200853_658x87_scrot.png (11.1 KB) 2020-04-07-200853_658x87_scrot.png Nico Schottelius, 04/07/2020 08:09 PM

History

#1

Updated by Redmine Admin 7 months ago

  • Description updated (diff)
#2

Updated by Nico Schottelius 7 months ago

  • Status changed from New to In Progress

Adding Timothee as a watcher -- these are bugs/problems we discover over the time using matrix and might either want to fix or submit upstream or both.

#3

Updated by Nico Schottelius 7 months ago

  • Description updated (diff)
  • Project changed from sales and marketing to Open Infrastructure
#4

Updated by Nico Schottelius 7 months ago

  • Description updated (diff)
#5

Updated by Nico Schottelius 7 months ago

  • Description updated (diff)
#6

Updated by Sanghee Kim 7 months ago

  • Description updated (diff)
#7

Updated by Timothée Floure 7 months ago

Going over mentionned issues to give more context / initial leads on how to fix them. We're speaking of riot-web here.

Redmine Admin wrote:

  • remove the separation tab of Direct Messages and Rooms -> this damages readability
    • An option to disable all categories might do this
    • Adding to this: scrolling inside the groups can be very painful and fields are often too small

Related code: https://github.com/matrix-org/matrix-react-sdk/blob/develop/src/components/views/rooms/RoomList.js#L754

Disabling sublists looks doable at first glance, and should not be too hard to implement.

  • disable color differentiation for each user name: make them all same, muted color.
  • Afaics this refers to the avatar - maybe an option to disable avatars all together

There is a compact mode under "General > Theme", which is more compact but kind of weird since it does not disable avatars. I think it could be improved (should not be hard from the code I read).

  • Numbers of unread messages on channels are not helpful
    • Proposed solution: Indicate unread by bold only, remove the number count

That's already the case when you select "Mentions only" notifications for a room. See https://paste.gnugen.ch/raw/oh70

  • When creating a new public room the "room alias" field is empty and needs to be filled in manually
    • This should be automatically derived from the name as a suggestion

Somewhere is this file: https://github.com/matrix-org/matrix-react-sdk/blob/develop/src/components/views/dialogs/CreateRoomDialog.js

Should not be hard.

  • When inviting people to a room, local people (@xx:ungleich.ch) show up for a second and then vanish until I type the full name
    • i.e. typing @xx - shows the name, I want to select it, it vanishes
    • other people from other matrix servers are shown as suggested
    • then finishing @xx:ungleich.ch shows it again
    • Solution: don't make it show and vanish, but keep it

Looks like a bug, which sounds familiar (I likely encountered it a few times).

  • Too much margin between text groups damage readability
    • While chatting, the vertical spaces between texts are too high and waste space.
    • The horizonal space between profile picture and the name is too wide, makes it harder for eyes to coherently follow who wrote what.
    • Time of writing is not shown by default and only reveals on mouseover, requires extra movement for catching information.
    • Having to jump big spaces between different information (who wrote it what, when) makes it hard for the eyes to focus.

See compact timeline layout mention above.

=> Most of the suggestions require fine-tuning and no big changes. The riot-web / matrix-react-sdk code is easy to navigate.

PS: Matrix contributor hat for this, not ctt'd.

#8

Updated by Nico Schottelius 7 months ago

  • Description updated (diff)
#9

Updated by Timothée Floure 7 months ago

Redmine Admin wrote:

  • It is "impossible" to delete a room
    • There is no delete button
    • There seems to be a workaround to kick all users, make it non joinable (how?) and leave it
      • untested
    • Very basic functionality seems to be missing

Being discussed on https://github.com/vector-im/riot-web/issues/6978

#10

Updated by Timothée Floure 7 months ago

Currently looking at the compact timeline mode (will likely remove avatars): if Sanghee Kim is willing to make me a mockup, I can implement it.

#11

Updated by Nico Schottelius 7 months ago

  • Description updated (diff)
#12

Updated by Nico Schottelius 7 months ago

  • Description updated (diff)
#13

Updated by Nico Schottelius 7 months ago

  • Description updated (diff)
#14

Updated by Nico Schottelius 7 months ago

  • Description updated (diff)
#16

Updated by Nico Schottelius 6 months ago

  • Description updated (diff)
#17

Updated by Nico Schottelius 6 months ago

  • Description updated (diff)
#18

Updated by Nico Schottelius 6 months ago

  • Subject changed from U/UXI improvement points for matrix to UI/UX improvement suggestions for matrix
#19

Updated by Nico Schottelius 6 months ago

  • Description updated (diff)
#20

Updated by Nico Schottelius 6 months ago

  • Description updated (diff)
#21

Updated by Nico Schottelius 6 months ago

  • Description updated (diff)
#22

Updated by Nico Schottelius 6 months ago

  • Description updated (diff)
#23

Updated by Nico Schottelius 6 months ago

  • Description updated (diff)
#24

Updated by Nico Schottelius 6 months ago

  • Description updated (diff)
#25

Updated by Nico Schottelius 6 months ago

  • Description updated (diff)

Also available in: Atom PDF