In progress
Much of the documentation in this page is applicable to both desktop and mobile, but see Desktop UX Documentation for anything specific to the desktop/webapp app experience.
Important Links
In-Channel Collapsed Threads
Parent posts only display in the Channel
Parent Posts are sorted chronologically (most recent at the bottom) by date and time of the parent post. Date and time of child messages does not alter the sort order of parent posts or their timestamps.
Child posts display in the Thread View.
Child messages are displayed in Thread View under the parent post to which they are associated (as per current state). Child messages are sorted chronologically within the thread (most recent at the bottom).
Viewing a thread
Tapping on the entire parent post area (visually indicated by the tap state) opens up the post in the Thread View - same functionality as current experience.
New Thread Footer
A new “Thread Footer” component is appended below all other post elements and helps define the purpose, audience and scope of the thread. This new footer is made up of the following elements.
Unread indicator
A blue dot shows if there are unread messages in the thread
Avatars
Avatars of all unique users who contributed to the thread, including bots
Show a maximum of 3 avatars, sorting by order of reply (first reply in position 1, and so-on)
If there are more than 3 participants, add a +N avatar that display the number of participants beyond 3
Tapping on the avatars opens up a bottom page sheet and displays all thread participants (similar to the reactions page sheet that lists all users who reacted)
Number of replies
No longer shows the count in top the top-right of the posts, but shows this count under the post in the thread meta data area
Shows the total replies in the thread reading “3 replies”
This is also a button to view the replies. Tapping this opens up the thread in the RHS
Follow/Following button
Tapping this adds the thread to the Global threads as a followed thread
Toggles between ‘Follow/Following’ states
Parent posts with no replies
If a parent post does not have any replies yet, it is not considered a ‘thread’, but just a 'message'.
Doesn’t show the thread footer for single parent messages
Only show the ‘following’ indicator if the solo message is being followed.
Thread Participants Bottom Sheet
As noted above, this bottom sheet displays when users tap on the Avatars in the thread footer.
Tapping on a user from this bottom sheet opens up the profile modal for that user
Long press menu for threads:
Updated items in the menu:
Add ‘Follow/Unfollow thread’
If the parent post does not yet have replies, update language to “Follow/Unfollow message” since it’s not really a thread yet
Unread parent messages
New parent posts get added to the bottom of the channel, as they do in the current experience
The mention badge on the channel in the sidebar should only reflect the number of unread mentions in parent posts in the channel (not child posts)
The count in the unread messages toast banner should only reflect parent posts showing the center channel and not include child messages
Unreads within threads (child posts)
In the Center Channel, when a thread has unread messages in it, an unread indicator dot is added to the reply metadata as noted above
When viewing a full thread (in the RHS or in the Global Threads View), the New Messages separator line display above the oldest unread message in the thread
Single Thread View
Opening up a thread in the Single Thread View
Land the user at the oldest unread point in the thread (marked by New Messages separator line). If the entire thread is unread, open up the thread at the very top of it (showing the parent post).
Once a thread has been viewed and then navigated away from, the new message line is removed and the unread status is cleared in the channel
Following/Follow button in the header
If a thread is not yet followed, a ‘Follow’ button appears in the header. Tapping this will follow the thread and add it to the Global Threads view.
If a thread is already followed, a ‘Following’ indicator appears in the RHS header. Tapping this will unfollow the thread
New Messages line
Leveraging the ‘New Messages’ separator line pattern, place this above the oldest unread message within the thread
When new messages are added to a thread…
If scrolled to the bottom of the thread, show that a user is typing a new message on the thread (same as current UX)
If scrolled up higher in the thread, add new messages to the bottom of the thread, but don’t scroll to that point - keep the user scrolled where they are
Date separators
Don’t use date separators within threads. Instead, modify the time stamp on posts to show the date in a friendly format (e.g. 2 days ago, 5 months ago, etc)
Long-press menu items
Add in ‘Follow/Unfollow thread’ for any post within a thread.
‘Mark as unread’ will behave differently in that it will mark the post as unread within the thread and move the ‘New Messages’ separator above the post that is being marked as unread
Marking as unread on a post within a thread will automatically follow that thread if it’s not already followed
‘Pin to channel’ will add the child post to the ‘Pinned Posts’ section, but will not visually show the pin icon on the post in the main center channel if it’s a child post
Threads in search results
When a thread is displayed in search results, the title ‘Thread in {Channel Name}’ displays above the result (as in current experience). If a user taps on a search result to a child post it would open the Single Thread View. As in the current experience, a ‘back’ chevron in the header returns to search results.
Permalink to child posts
If a post contains a permalink to another child post, tapping on the permalink would load the linked-to thread in the Single Thread view with the linked post highlighted. As in the current experience, the ‘back’ chevron in the header to return the user to the previous child post/thread.
Following/Unfollowing Threads
When a thread is ‘Followed’ it is added to the global ‘Threads’ view
When a thread is ‘Unfollowed’ it is removed from the global ‘Threads’ view
How threads are followed:
If the original parent post was created by you, the thread is automatically followed
If you reply to a thread, it is automatically followed
If you are mentioned in a thread, that thread is automatically followed
If you Unfollow a thread, but then are mentioned, the thread is now automatically followed again
Marking as unread on a post within a thread will automatically follow that thread if it’s not already followed
If I explicitly tap ‘Follow’ on a thread/message
Followed threads do not appear in Global Threads until there has been a reply
Tapping the ‘Following’ button or ‘Unfollow’ menu item will remove the thread from the global ‘Threads’ view
Global Threads
Global Threads is a view of conversations that the user has been involved in across all their channels, Group Messages and Direct Messages. The spirit of Global Threads is to offer a more personalized experience, to ensure replies to threads don’t get missed and to facilitate faster processing of messages by taking them from the many venues (channels, DM, GM) where they canonically reside and consolidating them in one place (less channel switching).
How to access Global Threads
This view is accessible view a new ‘Threads’ section that appears at the top of the Channel Sidebar above all of the categories
The Thread List
A new pane that shows all threads collected in one place that the user has:
Contributed to (parent or child)
Been mentioned in
Followed
Marked as unread
Viewing ‘All your threads’ or ‘Unreads’
The default view is ‘All your threads which will show all threads by most recent reply, showing most recent at the top
An ‘Unreads’ view which will filter the list to only threads that have unread messages sorted by most recent reply
When a user leaves global threads and returns, remember the state they left
Sorting the List
Changed or new threads appear in the global threads list in real-time:
Resorting the list updates in real-time
If the selected thread in the list gets updated, it bumps to the top of the list, but keeps the thread selected and the list scrolls to the selected item (if needed)
‘New unreads’ banner
If you’re scrolled down to a point where the top of the list is no longer in view and new unreads come in out of view, append a ‘new unreads’ banner fixed to the top of the list view
Tapping this banner will scroll to the top of the list and hide the banner.
Thread List Items
Thread list items display the following
Display name of the user who created the parent post
Most recent reply timestamp in shortform, friendly format (e.g. 5 mins ago)
Post excerpt: originating parent post truncated to two lines
Mentions do not get the highlight colour here to avoid too much visual noise in this area
Avatar of each person who has contributed to the thread (truncated as appropriate)
Always show the original author first
Sorting by order of reply (first reply in position 1, and so-on)
show a max of 3 avatars total with a +N after that
Number of replies in the thread
If there are no unreads, this displays the total number of replies in the thread (e.g. '9 replies')
If there are unreads, this changes to the number of new unread replies (e.g. ‘3 new replies’)
Originating venue tag - i.e. the Channel, DM or GM that it’s from
Unread dot to indicate the thread has unread messages
Mention badge (if the thread has an unread mention in it) - shows in place of the unread dot
Tapping this will jump down to the oldest unread mention in the thread
The long press menu on Thread List Items:
‘Unfollow/Follow thread’
‘Open in channel' - Opens the parent post in the channel it was posted in
‘Mark as unread’ - This option from the list item here, will mark the entire thread as unread
Save (formerly Flag)
Copy link
Don’t include ‘Pin to channel’ in this context
Tapping on a Thread List Item
loads the full thread in the Single Thread View (see details about this panel below) on the right
Defaults
When as user taps on the ‘Threads’ item in the Channel Sidebar, the default view will be whatever view you may previously have viewed. If you’ve never visited the threads view before, then “All your threads” is the default, which shows all threads you follow sorted by most recent reply at the top
Empty States
An empty state shows in the Full Thread Pane until a thread is tapped
If there are no followed threads or no threads that the user has participated in yet, the inbox list is hidden and the entire main content area is replaced with the empty state describing how threads appear in this view
iPad layout
Coming soon…