A few small design opinions

AI-generated summary

A few small design opinions

The discussion revolves around design suggestions for improving the chat feature on the forum. Canapin initiated the conversation, sharing several issues, including:

  • The action bar being too invasive and potentially covering replied message excerpts.
  • The reaction bar being too large and hiding a bit of the top of the message text.
  • The delay in showing the reaction bar, which joffreyjaffeux explained was intentional to avoid too much screen movement.
  • Image thumbnails remaining small in fullscreen mode.

Canapin suggested reducing the reaction bar’s size or moving it to the “more” menu, while joffreyjaffeux and sam proposed removing recent reactions in “drawer mode” (the floating chat container at the bottom right of the page).

joffreyjaffeux implemented changes to address these issues, and Canapin reported that the updated design meets their expectations.

I’m testing the chat feature on another forum.

  1. I find the action bar a little bit too invasive. Maybe I would get rid of 2 of the 3 most used reactions… :thinking::

    Since the window is tiny, when reading you’re often hovering a message. If it never overlaps a message, I wonder if it could be improved.

  2. It covers the replied message excerpt:

    I’m used to Discord in which we can click the full “quoted” message itself to go to it:

    Here on the Discourse chat, you can only click the small arrow part, which I find not very intuitive (but again, I’m used to Discord…):

  3. When you upload an image and set the chat in fullscreen, the thumbnail remains tiny. It would be nice if the thumbnail was larger when on fullscreen.
    Small chat window:


    Fullscreen chat window:

2 Likes

Pasting a small image upscales it, making it blurry. In my opinion, it shouldn’t upscale small images:

2 Likes

Another thing: it also hides a bit of the top of the message text (if the message doesn’t reply to another one) when you hover the whole message:

And for some reason, on slow connections (I suppose: I have a very slow connection nowadays), there is a delay to show the reaction bar. I don’t know why since there is apparently no server-side query. I didn’t find a delay in the CSS as well. It seems a bit sluggish:

1 Like

The delay is on purpose, to avoid things moving too much on the screen. Nothing related to internet speed.

Where would you put it then?

2 Likes

I’m not sure.

Just to explain, I often keep the cursor on a paragraph I’m reading on the Internet (like people that put their finger on the text of a book they’re reading), hence the fact that the text is partially hidden bothers me a little. It’s not unreadable at all obviously, just a tiny thing that scratches my brain.

Maybe reduce the size a bit, because the reaction bar seems very long to me.
Here’s with a scale of 1 (default):

And a scale of 0.85:

A scale of 0.9 would also work… And here’s without the quick reactions, since most-used reactions are already available in the reaction emoji menu:

Default reaction emoji menu:


[details=“Maybe move the reactions to the “more” menu (but I’m not fond of it)”]

On top of other actions like when we right-click on a message on Discord? But I don’t think it’s particularly convenient if we remove the quick reactions.

But there are also mobile interactions to take into account… :person_shrugging:
[/details]

2 Likes

Yes we might want to consider removing recent reactions, at least in drawer mode @mcwumbly

2 Likes

I think some minor adjustments to size and positioning would help a fair bit.

We can make it a bit smaller and shift it up a bit to make sure it never occludes any text in the message and leaves a little breathing room in between.

1 Like

Not really because you have the case of multiple one line messages of the same user.

Also is being smaller a better idea than removing recent?

2 Likes

I like the idea of removing recent in drawer mode, it’s a very easy incremental improvement

What is “drawer mode” exactly?

The floating chat container at bottom right of the page, as opposed to full page chat.

2 Likes

I pushed various changes to msg actions, let me know how it goes for you :raised_hands:

2 Likes

It’s just perfect for me. :clap:

1 Like