UX: Composer Redesign | accomodate multiple post actions

[KyleTryon]

When a user authors one or multiple posts (thread), they will have multiple possible options for actions to take. Users can schedule and post content in one of the following ways:

• Post immediately
• Add to queue (Auto schedule)
• Schedule and add to queue

The Composer component needs to be redesigned to accommodate the multiple possible posting actions, and better integrate thread posts.

1. Post Button

Marked here as circle 1, the post button as it is, now assumes that you will be posting to the scheduled time, indicated by the date-time component, labeled in circle 2.

My immediate thought is to create a button with a "default" value, such as "Post" for posting immediately, and have a built-in drop-down menu for the other possible posting options. And maybe, we would save the last option a user selected for the default status of the button?

Here is an example of the type of button component I am thinking might resolve this issue: https://tailwindui.com/components/application-ui/elements/dropdowns

Probably something more like this, where there is "two" buttons, one for the action, and one for the drop down.

Is this intuitive enough?

2. Date-Time Schedule

Marked in circle 2, is the scheduled time for when to post. Right now, this is automatically set to the current time, clicking on the calendar will bring up a native calendar and time input for a future date.

One request we have seen a few times already, some users would like to add items to their queue, but not worry about scheduling the post. Instead, users would like the ability to build up a backlog of queue items that automatically post X times per day.

If we do not need the date/time for items added to the queue, where should this date-time component live? Should it always be visible? Would it disable if the queue option is selected?

3. Create Thread button

Finally, the third circle shows how a user can click a button to turn a single post into a thread. This design can likely be improved and does not yet consider what multiple composers would look like on the screen. We likely do not want the "post" button on each post when dealing with threads.

How should we redesign the thread button? Does the post button need to move outside of the composer because of this?

[takanome-dev]

1. I think it is.
2. In my opinion, we should only show the date/time if the user want to schedule a post.
3. Personally, I don't know how to create a thread because I never done it but in this scenario maybe we should hide the create post field if the thread button is clicked and show a create thread field instead.

That's my personal thoughts 💭 We need more opinions on this 💡

[Cedamar]

open.mov

This is my opinion as a UI/UX dessigner . let me know what you guys think
thanks

[takanome-dev]

Wow this is awesome @Cedamar 🚀 🔥

[KyleTryon]

Thank you very much @Cedamar! The drop-down button is just what I was thinking. Though, I think we might need to combine the schedule and post buttons into a single action.

The way I see it, users are either going to schedule the post, or post it now. So I am thinking make the post button with a drop down, like how you show the calendar, but we have the multiple post options like post, schedule and queue.

Maybe if the user clicks schedule, then we present them with the date/time calendar?

[Cedamar]

Noted @KyleTryon . I first thought of it But had a second thought that It will involve so many clicking before user can schedule.
But let me work on what you are Suggesting. Thanks

and also after user scheduled the Post which CTA button is user going to use to assign the scheduled post?
the POST button or SCHEDULED button?

[Cedamar]

open.new.mov

Hello, @KyleTryon Check this . sorry for the delay. Let me know what you guys think. Thanks

[skarhenkz]

i think the thread button should not be on the input field instead be placed on the buttom nav bar

[skarhenkz]

and the date picker option for scheduling post should be something like this instead of a drop down calendar for easier and clearer scheduling process

[Cedamar]

That's Awesome 👌 @skarhenkz I love the Schedule Date/Time .

[KyleTryon]

and the date picker option for scheduling post should be something like this instead of a drop-down calendar for easier and clearer scheduling process

That's great @skarhenkz, and also quite a bit easier to code too lol. Is that the default twitter scheduling UI? We could definitely take some inspiration there. Fan of the thread button too, thanks for your input!

[skarhenkz]

and the date picker option for scheduling post should be something like this instead of a drop-down calendar for easier and clearer scheduling process

That's great @skarhenkz, and also quite a bit easier to code too lol. Is that the default twitter scheduling UI? We could definitely take some inspiration there. Fan of the thread button too, thanks for your input!

This is not from Twitter...took inspiration fro somewhere else...i don't even know Twitter have a schedule tweet feature..😂

[KyleTryon]

Love it, thanks @skarhenkz I think we may go this direction <3. I think I may want to keep that frosted glass aesthetic too potentially.

[skarhenkz]

Love it, thanks @skarhenkz I think we may go this direction <3. I think I may want to keep that frosted glass aesthetic too potentially.

Sure that's fine.

[groverception]

Hey guys I loved the project, hope to contribute relvant ideas here.
I apologize for this long thread but I couldn't have expressed my thoughts in any other better way than throwing examples.

1. Post button is the core action button figure and it should be bold enough to introduce itself from the other action areas
e.g. look at the tweet button.
A.

Tone is set

B. Example of creating a button in Gmail calendars it has three stages of lifecycle a. landing(can be disabled/active) b.hover c. action state(clicked)

C. We can move the Core action button defaults for the app to be generic enough. (I will share more product design ideas for core buttons)

2. First and foremost I can suggest the naming convention for this feature of schedule "Queue" can be named "Add to Queue" OR "Schedule for Queue" because we are creating resources for the queue by adding it to the queue.
Because Queue functionality can be explored more and new features can be added like scheduling them (we can park as well if it gets complicated).

for this, I agree with @takanome-dev to keep the date and time for only scheduled posts.

All of this can be moved to a simple icon of the watch as well as explaining scheduled post
(Twitter space inspiring as always:)

love the glass backdrop by @skarhenkz
I liked the idea where what is scheduled by me is visible on the Post box itself
As twitter spaces do and scheduled tweets do and a simple icon when I come back gives me a side option to click and tell me what's scheduled.
Just a thought

& as well as I have this CSS for loading wait for the timeline or any of the elements we love to attach it to
Or maybe we can add this loader to each element with a large time gap for example after every 10 seconds we can blink the post box or any popup utility :
https://play.tailwindcss.com/n2fSmgAHNR (I Have more such clips i can contribute with)

3. Thread is again a very important core action button that should have a dedicated button(of course) OR similar in contrast to the POST button. For this issue, we can consider it
a. Either under the dropdowns of POST or
b. Create a toggle on the top right to convert the whole box relative to "THREAD" features
c. Or place an icon alongside POST button suggesting thread and change the icon to "POST" (relevant icon) once the thread is clicked(simple toggle)

BTW I would love to contribute more to UX /System Design design scoped solutions in the future.

😄

[Cedamar]

On the Thread @groverception
How many Thread can one create?
Once the Thread Icon Changes to Post
How will one add another Thread?

I am Confused there 😕