Chat design proposal: poll + seeking feedback

Feature
,
1

Scope

Device: mobile
Target: chat index-page

Hello everyone,

I’m working on revising the mobile chat index page and after iterating for a while, I would like to ask our community to take a look at the current proposals, to find out if anything resonates and, if not :melting_face:, if some feedback can help me improve them.

These are high level mocks of some ideas I’m playing with. Any feedback about the usability or general look-and-feel of them is very welcome. (Feedback on colours or alignments and the likes less so, as it’s still a work in process.)

Current design

Example as a reminder

image
image792×1694 88.6 KB

Problem

As long as there aren’t too many channels or DMs, it all works fine. However, when the channel list becomes too long, the DMs are pushed under the fold.

This leads to unpleasant UX:

  • Unread DMs, arguably the most important part of the chat index page, are always below the fold and require scrolling.
  • Especially when you are switching back and forth between 2 or more DMs, having to scroll down each time to reach your ongoing chat is pretty annoying.

New design proposals

I’m experimenting with a couple of setups, each with its own pros and cons.

Design 1: Horizontal layout for DMs

image
image866×1596 59.3 KB

What’s happening here?

  • The DMs are all at the top, navigation via horizontal scrolling
  • DMs are sorted by unread > most recent > less recent
  • The channels are as-is below the DM section

This layout makes finding a specific DM more difficult, so we would add in a search function that appears on scroll back or another mechanism (but isn’t permanently taking up real estate):

image
image878×1602 62.2 KB

Pros and Cons (that I can see)

:white_check_mark: Easy access to unread DMs
:x: Full name and group members no longer visible
:x: User status and timestamp no longer visible
:x: Horizontal scrolling isn’t that fun => search helps

Design 2: One mixed list

image
image1076×1000 83.1 KB

What’s happening here?

  • DMs and channels peacefully co-exist in 1 list view
  • The sort order is done like this, with unread DMs and unread channels in “separate” sections because DMs have the highest priority, and I don’t want them to be pushed down by categories a user potentially never clears (guilty of that myself).
  • Added an optional custom icon for a channel instead of the default chat-icon.
  • This too could benefit from having a search function (not pictured)

Pros and Cons (that I can see)

:white_check_mark: Easy access to unread DMs
:white_check_mark: Full name or group members visible
:white_check_mark: User status and timestamp visible
:x: Mixing DMs and channels is less scannable => search helps

Design 3: Tabs

image
image1124×1000 113 KB

What’s happening here?

  • Going a different route here by using 2 separate views with footer to switch
  • Channels could be sorted on most recent too, instead of alphabetical. That is true for design #1 too. I’m considering making that a user preference option.

Pros and Cons (that I can see)

:white_check_mark: Easier access to unread DMs
:white_check_mark: Full name or group members visible
:white_check_mark: User status and timestamp visible
:x: Can’t see everything in one view

Feedback time

If you’re still here, awesome, thanks :slight_smile:

1. Vote for whatever has your preference

Multiple options possible.

I prefer…

  • The current design
  • Design #1: Horizontal layout
  • Design #2: One list view
  • Design #3: Tabs

0 voters

I like to see channels sorted by…

  • Sort alphabetically
  • Sort on unread > most recent > less recent

0 voters

2. Share any ideas, inspiration, flaws you spot, or general feedback you have in the comments

Thanks everyone!

11 Likes
2

A small idea: Can you add a pinned channel function, so that the administrator can arrange the importance of the channel?

10 Likes
3

What about anchor unread “Personal chat” to the top of the chat drawer?

We’ve just received the following feedback from one of our members:

So a direct message from another person. For example, you message me. There’s a notification on the chat bubble saying 1 to indicate I’ve a message. I open chat and have to scroll past all the other topic areas to get to your message. I think it would be easier to find it if a personal unread message was at the top when opened. Hope that makes sense.

I thought that was a nice idea. Find a way to display any unread personal chat messages first and then “Chat channel” and then “Personal chat”.

(I don’t think this is a duplicate post as I couldn’t find one yet I do wonder if this has been mentioned before).

3 Likes
4

I acknowledge the horizontal scroll “issue” on the first design, but I dig it. I don’t use a lot direct chat messages, so having like the 5 last actives discussion would be enough for me. Seeing all the other discussions in which I’m not currently active (or notified of) would be of low interest, so it shouldn’t bother me.
It sure may be a bit annoying for very active chatters. Design is :fire: though.

2 Likes
5

A very important detail I would like to add is to have channels grouped per father category (if more than one channel was defined for said category, or there are channels defined for its child categories), would make everything more easy to follow and organize :pray:

1 Like