Fast actions from mini info item - UI / UX ideas

[Stypox]

Problem

I have been thinking about the long press menu lately, and I realized it is inconvenient because:

1. Entries have no corresponding icon, so our eyes can't distinguish between two entries at the first sight.
2. Entries are not always in the same position on the screen, so we can't use muscle memory. Even though this was partially addressed by Making the long-press menu consistant across the application #2354 & Make long-press menu consistent across views #2368, the position of entries depends anyway on the menu length.
3. There are too many entries, making the menu too crowded, and there are many requests for new entries ({feat req} long press on item listed opens video's menu  #437 Directplay on Background #2198 Unable to play YouTube playlist from specified track #2510 [feature request] add "add to playlist" to the list of related videos #1142).
4. There is no way to select multiple streams and apply an action on all of them.

Solution

This is the solution I propose, sorry for the bad quality ;-)

Screen A contains normal info item list. By tapping on the blue stream info item we get to screen B. Yes, video info is not loaded, instead the item expands to show some action buttons above and below it! Here is why I think this is a good idea:

• Most of the times when I click on a video I just want to play it, and currently I have to wait for video info to load before being able to play anything ([Feature request] swipe while searching to add to queue. #2306). With this solution it would take less time.
• Video info can be loaded by clicking again on the item.
• Icons are always in the same place (relative to the clicked stream) and with the same icon (no text, as icons are representative enough). This solves problems 1. and 2. above. Also, actions about stream content (play&download) are separated from the specific ones that only use stream info (add-to-playlist, share, delete-from-playlist, set-as-playlist-thumbnail, etc.).
• Since play-actions are displayed where the item was before, and the item is shifted down (see how the above separator is not moved in screen B), one can remember where an option is and double-tap in the correct place directly from screen A. This would take no time.
• Background and popup play buttons can be long-pressed to enqueue (consistent with the video info activity).
• There is place for new actions, in case we ever need them. We would just need to add a button to the bar below the item.

By long-pressing on the blue stream info item on screen A, the multiple-select options are shown in the action bar (similar to #2354 (comment)), solving the problem 4. above. By tapping once on any other stream info items we can select them, getting to situation C. A tick is displayed above selected items' thumbnails and the action bar is populated with actions about stream content.
The three-dot menu cointains the other actions and also two options useful for selection purposes: "select below" and "select above", only available in non-infinite lists. These can be considered a replacement to a "select all" button, but are more powerful and would solve #2510 #2559. If a playlist is long and is not fully loaded, the "select below" button would lazily select all items so that they are loaded only if needed.

Feedback

I would implement this but I need feedback both from designers and from users. Would this idea suit your needs? Would it be pleasant to the eye? If you disagree with any of the assumptions I made above, be sure to tell me ;-)

@theScrabi @TobiGr @TheAssassin @nv95 @Gymcap @karyogamy @justanidea @Lirlisa @gkeegan @BartFarley @xak2000 @jojoxl01

[hcaballero56]

I really like the screen C, i can't find any problem with that one.
Screen B looks similar to the one we have right now, but with icons what makes it comfortable, but C have that and the option to select a bunch of videos, so it's better.

[justanidea]

At the first look i didnt know what to think about it, but now i can say that i really like this design :)
The only change i would suggest is to keep the possibility for the user to acceed the video info as usually with only one click (and not two, because it may be bothering during a long watching session - well, i should test and see if its the case).
But in the case it was disturbing, i would propose separating the video item in 2 hitboxes: making the video thumbnail be the hitbox where you open the video info in once, and the whole other part be the hitbox to open the design you proposed.

Feel free to discuss this opinion.

[xak2000]

I propose to add config options to select items to display in context menu.
Not all users have the same needs.

Some users really require "start play in background from this track" (like me), some never use it. To not clutter context menu with all possible quick actions, you can let users to add/remove actions they need. This way all groups of users will be happy.

I like this design, but I don't like the idea that to start playing a playlist in background from a specified track (the action that I use the most, if not 100% of the time) I will need to do more than 2 taps (if I correctly undrestand your idea, correct me if I'm wrong). In ideal world this should be just one tap, two at maximum.

But I understand that I not represent all user groups. I don't know how many other users use this app the same way as me. I just trying to find some solution, that will satisfy all groups of users.

[jojoxl01]

When we click on the normal playlist in screen A, we will enter screen B (actually above and below the selected video). Screen B shows various operation buttons for the selected video. The sorting of these buttons is what I think is Very good, sorted by the frequency and habits of our clicks. There is an idea: When we click on any video and the operation buttons displayed on screen B appear, can we add a check button, and then select other videos in turn to operate them in batches, for example, three in turn , then batch download, or play in the background in the order selected (suspension window playback). I think, if this is the case, do you want to press the long press on the selected video to bring up the checkboxes of other videos? Smart you may have implemented this operation, just like solving problem 4. The way to achieve it is different. Others really didn't think there was a good improvement place, because the designer is always smarter than the user! If those features can be achieved, it will be a very beautiful software! If there is any good idea , we will tell you at any time!

[jojoxl01]

In addition, in the import and export, you can not import the list of favorites in youtube, for example, the default playlist: watch later, as well as the playlist created by the user. I hope to consider this feature, thank you!

[Gymcap]

I prefer opening the video detail on a single tap, as well as loading screen B by long pressing a video on screen A. Multi-select could be handled by long pressing the thumbnails, bringing the user to screen C.

Since we are so opposite on this, there could possibly be settings for "short tap/long tap" actions or "reverse long/short taps in lists"

Secondary:
A 'select between' option for screen C would probably be useful here too. The idea is a user can select two videos from different points in a list, then hit 'select between' to grab all videos between the two.

I.e. User selects video 3 and 6 in a list. User hits the three dot menu on screen C and taps 'select between'. Videos 4 and 5 are added to the selection.

[Koitharu]

TL;DR
I propose to make first menu items (common for most of streams) icons only instead of text. As result we got 3-4 icons in one line and standard menu below

[BartFarley]

stypox you wrote:
"Most of the times when I click on a video I just want to play it, and currently I have to wait for video info to load before being able to play anything (#2306). With this solution it would take less time."
Very odd. Isn't this the very function you deleted between 0.16.2 and 0.17.x? In #2368 you said it was "mostly useless". Very confusing. Isn't this the reason I have reverted back to 0.16.2? I am a huge fan of NewPipe. A libre lightweight streaming front-end for Android.

[gkeegan]

@BartFarley the manner of how this comes off is very rude, and seems like it is intended to make stypox feel bad for their contributions. Please refrain from commenting if your criticism is like this.

[TheAssassin]

Even if it's more off topic, I want state that I agree to @gkeegan. Please stay constructive with criticism. You're welcome to post your own thoughts and ideas, but don't be rude please.

[opusforlife2]

@Stypox I like the idea of hitboxes as proposed by @justanidea but with some differences.

• Single tapping on an entry should open the video details screen like normal, so that behavior doesn't change for users who are used to the current behavior.
• Long pressing the video thumbnail should select the video like in screen C.
• Long pressing anywhere else on the entry should make it expand with the extra options like in screen B.

Regarding being able to instantly play a video with one tap, I think there should just be a permanent setting which allows the user to choose between:

• current Newpipe behavior: video details page loads, needs another tap to play video.
• instant play: tapping a video instantly opens the player UI and loads the video. Backing out of it takes you to the video details page. Backing out of that takes you to the original list.

[Gymcap]

I'd like to partially retract my previous comment as I believe I could get used to this layout, however I do have an accompanying suggestion to help the change go smoother for users with unexpected or unique use cases.

In addition to this UI change, there could potentially be two new settings to help make more people happy.

Long Press Action & Short Tap Action (from screen A)

They would both have all the same options: play, background, popup, queue variants, video details, video expand (screen B), etc

This way people can continue with the old functionality if they like, or customize it to fit their use case.

With these extra settings, leaving the current functionality the same while implementing these overall UI/UX changes also becomes a viable option. (i.e. adding everything you said, but enabling the showing of screen B etc with these two new options)

[goxr3plus]

Screen C with multiple selects is actually very good :) @Stypox Very similar to what many applications (Dropbox) for example are using for multiple selection.

[Stypox]

After collecting the feedback and thinking about the arisen problems and proposed solutions, here is what I think would be a good idea. Again, be sure to provide feedback! :-D

• The item hitbox could be split into two parts: the "thumbnail" part and the other part. Tapping on the thumbnail from the initial situation (screen A) would run a user-defined action (show-video-info by default). Tapping on the rest of the item would open screen B. @justanidea @Gymcap
• A list of "settings" for the item menus could be added (either with a button in screen B or in the main app settings), that contains these options:
  • Action to run when tapping on the thumbnail (see point above, show-video-info by default). @Gymcap @xak2000
  • A switch on whether to treat start-playing options as play-this-and-all-following-videos or not (ON by default). @BartFarley @xak2000
• A "select between" option could be added to the toolbar in screen C, that would only appear if there are 2 videos selected. At the same time, the "select above" and "select below" options only appear when 1 video is selected. @goxr3plus @jojoxl01 @Gymcap

@BartFarley responding to your comment: I understand your issue and that's mostly why I'm trying to find a solution. When I deleted the start-playing-here option I thought it was useless, but then 3-4 people came to me telling that they used it, so I changed my mind (is changing one's mind bad?). By the way, what I asked for was not non-constructive critics but feedback about the proposed solution, so you missed your opportunity to weigh in on in order to make it suit your needs better.

@jojoxl01 I'm not sure what you mean... screen C shows checkboxes on top of the thumbnail of selected videos, and I think that's enough. Or do you mean that an unchecked checkbox should be added on every video?

@Gymcap Are the proposed settings ok for you? I know they are not what you suggested, but I think it is more intuitive and convenient to keep thumbnail for custom action, other place for expanded menu, long-press for multi-select menu.

@theScrabi @TobiGr @TheAssassin @nv95 @Gymcap @karyogamy @justanidea @Lirlisa @gkeegan @BartFarley @xak2000 @jojoxl01

[hcaballero56]

Why can't it just be like view A, like until now (single press direct you to the video), but when you long press, it turns into view C, allowing you to select more videos?

[Stypox]

That will remain, the only difference is that single-tapping on the thumbnail runs a user-specified action. @Lirlisa

[xak2000]

A switch on whether to treat start-playing options as play-this-and-all-following-videos or not (ON by default).

An idea: this can be multi-switch or something. I mean an icon displaying current selected play mode, that when clicked, changes to the next icon (next play mode). From this pool of modes:

• Play only this track (a "1" icon)
• Play starting from this track (a "playlist" icon)
• Play starting from this track with repeating ON (when playlist ends, start it from 1st track) (a "playlist with circle-arrow" icon)

Another idea: when tap and hold on "play" icons on screen B, the context menu will appear that allow to select another playing mode for this action without globally changing the mode.

Example: tap and hold on ">" icon will show context menu with 3 items:

• Play only this track (foreground)
• Play starting from this track (foreground)
• Play starting from this track with repeating ON (foreground)

While tap and hold on "headphones" icon will show the same context menu for playing in background.

These are only ideas of course and if this complicates the UI in any way, than maybe it not worth.

[TobiGr]

Thanks for the work and effort your put into this, @Stypox and all the others who contribute. @Stypox Thanks for pinging me again. I was quite busy when you mentioned me the first time and then forgot about it.

---

What I really like about screen B is that all actions are visible instantly and close to each other. It is also a good idea to separate the play actions from the others. To be consistent, I'd propose to enable longpress/ tap and hold actions on the play buttons to enqueue a stream (just in the same way as we do it in the detail fragments and @xak2000 suggested them, too). However, this would need an introduction to the user because these actions are not visible and therefore might not be recognized by every user.

Most of the times when I click on a video I just want to play it, and currently I have to wait for video info to load before being able to play anything (#2306).

If I am correctly, we need to fetch the video page to gather the info on the streams. I think the proper solution to this would be to implement an embedded player which runs in the video detail fragment.

---

The idea behind what you used as screen C was to provide a model which can be used for one or multiple "selected" videos. I'll shortly list its pros and cons:
Pro:

• Using one interface for all stream lists allows users to recognize the actions and therefore speed up the daily usage.
• Keeping all actions in the toolbar does not reduce the space of the stream items in the list.

Con:

• Actions might be hidden and not directly accessible on smaller devices due to too many icons and few space in the toolbar. We might need to consider whether it is useful and good UX to have three play queues (one for each player type), but this should be content of a different discussion. Another approach to circumvent this would be @xak2000's second suggestion which I like, too. However this would need an introduction as mentioned above.
• Available actions change with the number of selected videos (e.g. you can share one video, but not multiple; downloading multiple videos is not yet possible, see Download playlist #2018) or the context (only a few actions in the normal stream list, but more actions when viewing a local playlist etc.).

Tbh, I think we do not need the "select below/above" actions as they'd require two actions by the user: one for opening the overflow menu and another for tapping the option. Just tapping on another video in the list is much faster. The "select between" action looks interesting. @Stypox But how would you handle a situation when three videos are selected and between all three of them are unselected videos?

My proposal would be something like this with either the extra append/enqueue icon or the tap and hold solution.

---

A list of "settings" for the item menus could be added (either with a button in screen B or in the main app settings), that contains these options:

• Action to run when tapping on the thumbnail (see point above, show-video-info by default).

I'd suggest to handle the whole item in the list the same way and to not introduce different actions when tapping on a thumbnail or the title. But I really like the idea to allow users to configure what happens when tapping on an item.

[Stypox]

Here is a demonstration. No button works, it is just to show off the design. Currentlty clicking on the thumbnail opens video info, clicking anywhere else expands the view. At the end I decided to use smaller buttons (~40dp) and put them all on the same line, since it uses up less space, the finger has to move less and (in my opinion) it is not less comfortable than bigger buttons. The "play" buttons are on the right (since thats' where one presses to expand the view, since a click on the thumbnail opens video info), while the "other action" buttons are on the left.

Here is a debug apk: if you find anything strange, be sure to tell :-) : app-debug.zip

[ghost]

Play all button in custom Youtube feeds above the menu on the right / Background listening or video watching options

Please see screenshot for example > https://photos.app.goo.gl/sQDyCf71n34wZYet7

Thanks
Onder

[tomjuggler]

Why not have an option to just download new Subscription content automatically? Part of the what's new page? Or at least download all at once with one button...
Reason: I only have access to internet certain times of the day, usually it's a scramble to download all the content to watch later just before the ISP switches over to the high cost time bracket.

Summary: Please add a download option after long-clicking on the video.

Usecase:
I don't have mobile data, and I would like to listen to YouTube on the go. Therefore I would like to quickly download multiple video's of a channel.

Steps I now have to take to download 3 video's from a channel:
Start NewPipe
Click on a video
Click on the channel name
Click on a the first video
click download and OK
Click back
Click on the second video
click download and OK
Click back
Clink on the third video
click download and OK

It would be nice if it could be done like this:
Start NewPipe
Click on a video
Click on the channel name
Long-click on the first video.
Select the -non existent- Download option, and press OK
Long-click on the second video.
Select the -non existent- Download option, and press OK
Long-click on the third video.
Select the -non existent- Download option, and press OK

My versions:
NewPipe 0.17.4 (latest release)
Android 6.0.1
CyanogenMod 13.0-20161121-NIGHTLY-ks01lte
Samsung Galaxy S4

[Stypox]

I created a draft PR for this, #3936, could you take a look at it? :-D

[chilliger]

subscribe/unsubscribe would also be neat so you dont have to open the channel to do that.

[realpixelcode]

In my opinion, it takes the user too long to understand what all the options mean. The context menu lacks good distinguishability of the individual items. So this is my proposal: add icons, group the items and put the share option as an icon to the top. Also, the video title needs to be really emphazised because it just gets kinda lost. By the way: those are Bootstrap icons. I created the last 2 ones myself from existing ones. And maybe make the edges more rounded.

[nadiration]

@Stypox great ideas man, NewPipe needs these. Anyone working on it?

[ghost]

How's that going? I was about to open an issue asking for this. Having to open the video just to download it for later is very unpractical. If not that, an option to keep a playlist always downloaded and always available on my device would be awesome (as I can do with Youtube Premium). That's my biggest holdup in regards to this app and that's why I'll go back to Youtube. I'm gonna keep the app installed tho, just waiting! It has a great potential

[Angelk90]

I wanted to open a discussion, but it has not yet been decided whether to enable them or not.

The images are based on version 0.21.9

As you can see in the image a) it represents the history of the videos viewed.
If you keep your finger pressed for a long time on a video, a modal appears as in image b).

I would recommend:

Add for each video in the list that you see in the image a), to put a button on the right the one with the three dots clicking on the button with the three dots to open the menu that you see in the image b), see for example image c) and d), then remove the long pressure to open the modal.

By swiping from right to left the possibility of removing the video from the history.

By long pressing on the video, the possibility to select the video.
With the ability to select other videos and delete them from the history all at once.
The possibility of being able to select multiple videos in this case, could in addition to deleting the videos from the history, could also allow you to create a playlist with the selected videos.

a)

b)

c)

d)

e)

[Stypox]

@Angelk90 you are not supposed to ping all of these people. Your proposal is unfortunately undoable because the swiping gesture on items would interfere with changing tab, I think I already talked about it somewhere. I am not working on this anymore since it also has some problems (i.e. small buttons, strange ui and no textual description for items). The solution we agreed on was just to improve the long-press menu, e.g. by adding icons to items and by grouping items by some criteria.

[Angelk90]

@Stypox : You mean the swipe from right to left, right?