UX Specs: Scheduled Messages

Overview

There are times when you’d like to send a message, but the timing may not be quite right. The scheduled messages feature allows users to send their message at a date and time that is more suitable. Some common scenarios are:

  • The message content is better suited for a later date or time

  • It’s after working hours and you don’t want to disrupt the recipient

  • Delaying a message due to a recipient’s time zone


Scheduling a message

To schedule a message, first compose a message in the message input in a reply or thread. Then click the right side of the send button and choose a preset time or custom time. The message will then be queued to send at the chosen time.

New options for the send button

The new send button will be a segmented control where users can either send immediately by clicking the left side of the button, or opening options to schedule the message by clicking the right side of the button.

image-20240419-210716.png

Send button states

There are a number of new states for the send button along with tooltips as outlined below.

image-20240419-211013.png

Schedule message menu options

Options that display in the menu

Depending on the current user’s date and time, the options in the menu may differ:

  • Options are:

    • Tomorrow at 9:00 AM

    • Monday at 9::00 AM (Only shows if it’s Friday & Saturday)

    • Choose a custom time

    • Recently used custom time (only shows if a custom time was used in the last month)

Time formats should follow the user’s Clock Display preference (12-hour vs. 24-hour clock)

Scheduling a message in a DM for a recipient in a different time zone

When scheduling a message in a direct message with a user who is in a different timezone, we can show a secondary label under the preset options that shows the time in their timezone.

Keyboard controls on the menu

  • When a menu opens, keyboard focus is placed on the first item

  • DOWN should move the focus to the next menu item, wrapping to the first item when it reaches the end

  • UP should move the focus to the previous menu item, wrapping from the first item to the last

  • TAB and SHIFT+TAB do not move focus among items within the menu, but should move to the next tabbable element outside the menu (and close the menu)

  • When a menu item is focused, ENTER executes the menu item and closes the menu

  • ESC closes the menu and returns focus to the original trigger that opened the menu

Scheduling a message in a thread (TBD)

It should be noted that messages could also be scheduled from within a thread. Though this may be a less likely use case, there is evidence for the need to do this - see comments in this forum post.

Should we decide to do this, the segmented send button control would also be available in the thread reply input.

Choosing a custom scheduled time

When ‘Choose a custom time’ is chosen, the Schedule Message modal opens with options for custom date and time.

  • By default, the date is set to Tomorrow

  • By default, the time is set to 9:00 AM

Date picker

When the date input field is clicked, a date picker opens up to select the custom schedule date.

Time picker

The options in the time input show in 30 minute increments. If user’s select “Today” as the date, only the times remaining in that day are shown in the options. (Similar to custom status or DND custom time).

In addition to the preset options in the time picker menu, users should be able to enter a custom time by typing in the input field.

 


Once a message is scheduled

Notice shows above the message input

When a message is scheduled, it is cleared from the message input and a notice is added above the message input area in the channel where the message was scheduled. This notice will show the date/time it is scheduled in following this format (respecting the clock display preference):

  • If the message is scheduled for today, show “Messages scheduled for today at 3:00 PM”

  • If the message is scheduled for the next day, show “Messages scheduled for tomorrow at 3:00 PM”

  • If the message is scheduled within a week, show “Message scheduled for Monday at 3:00 PM”

  • If the message is scheduled >= 1 week, show “Message scheduled for Oct 16 at 3:00 PM”

Multiple scheduled drafts in the same channel

When multiple messages are scheduled in a channel (or DM/GM), the notice message changes to “X messages scheduled to be sent to {channel display name}.

Scheduled messages added to Drafts view

All scheduled messages can be viewed in the global Drafts view with a SCHEDULED tag along with the date the message will send (respecting the click display preference).

  • If the message is scheduled for today, show “Send today at 3:00 PM”.

  • If the message is scheduled for the next day, show “Send tomorrow at 3:00 PM”

  • If the message is scheduled within a week, show “Send Monday at 3:00 PM”

  • If the message is scheduled >= 1 week, show “Send Oct 16 at 3:00 PM”

When hovering over a scheduled messages in the drafts view, the following options are available in the top-right corner of the draft container.

  • Delete draft - opens a confirmation modal to confirm deletion

  • Edit message - Edits the message inline (rather than taking users to the channel)

  • Reschedule message (opens the scheduling modal to change the date and time).

  • Send now - Opens a confirmation modal and sends the message immediately once confirmed. This removes from drafts and is no longer queued as a scheduled message

Rescheduling a draft

Clicking the ‘Reschedule’ option will open the schedule modal. From here the schedule can be updated or removed entirely.

 

 

Editing a draft

With the introduction of scheduled messages, we’ll need to make some changes in behaviour for how drafts or scheduled messages are edited. Rather than taking users to the channel or thread with the draft message in the input field, the proposal here is to edit the message content inline within the Drafts context.

Filtering Drafts view

A new filter is also added to the Drafts view to filter to All drafts, scheduled or unscheduled drafts.


Threads

Messages can be scheduled from the RHS view and the threads view as well.

Both inputs in the RHS and the thread view will have an option to schedule a message.

RHS

Since the RHS is relatively smaller in width, we would not show the full message “Your draft has been scheduled for tomorrow at 9:00AM EST.”, rather just that “You have 1 scheduled draft.” instead to keep it concise. If possible, we can show the full message when the RHS goes above 500px in width on resize.

 

RHS Thread

The full scheduled message can also be seen on the threads view.

 


Message failed

A draft message can fail for multiple reasons as well.

Reasons why a message can fail:

  • You’re not a member anymore of the channel.

  • Channel is archived

  • Channel is now read only

  • The RHS root post deleted (if the scheduled message was a reply)

Warning on the page

There will be a banner at the top that alerts the user of the error.

The referenced scheduled message to the channel the user is not part of will bubble up to the top.

There’s an additional label tag that reads “Will not be sent” with the warning icon.

Warning on the LHS

If a user schedules a message but leaves the group, there will be a warning symbol on the Scheduled messages tab on the LHS.

On hover we can let the user know why there is an issue.

 

Upon hover

Upon hover, the only option is to delete the scheduled message.

The user would get a confirmation modal on clicking the trash icon.

Once confirmed, the message would be deleted.