Discussions about navigation design

[kimsible]

Hi,

I would like to start a discussion about navigation user on PeerTube to maybe re-organize-it.

My questions and remarks :

1. First of all, in the left menu we have 4 links into MY LIBRARY: Videos, Playlists, Subscriptions, History

All of them (but Subscriptions that displays subscriptions, not settings) display have a prefix/my-account/* which is a little bit confusing, either all MY LIBRARY links should have their own view (like subscriptions) or MY LIBRARY should be renamed MY ACCOUNT ? in the last case we would want to see Channels and Imports.

2. The dropdown user menu is also confusing in some points.

• The Chevrons at the right of Interface:Lang, Videos:any language, Sensitive: display are weird there, we wait for unfold another menu but these all are links;
• Accout settings and More account settings are exactly the same link, it’s a little bit redondant;
• We have a Channel settings link, why not Videos settings ? Subscriptions settings ? …

3. /my-account/*navigation organisation is confusing.

• My settings concerns general settings
• My notifications concerns the notification view
• My library > * concerns settings / managements of my library components
• Misc concerns moderation blocklist and Owernship changes

I’m thinking about a re-orgnaization :

• Ownership changes could be placed in the left menu MY LIBRARY
• Miscrenamed to My Blocklist
• Dropping My library and put all links to the left menu, their url could be replaced with /my-library/* prefix
• Delete Channel settings link from the dropdown user menu though it will be placed to the left-menu
• Delete Account settings or More account settings duplicated link from the dropdown user menu
• Delete chevrons on dropdown user menu’s links

What do you think about these remarks ?

[rigelk]

Hi @kimsible, all good notes, though I don’t see them under the same light

Organizing things is hard. Naming them is even harder. Let’s not mix URLs and UI there, because trying to make them consistent is just going to make us alias even more routes for retro-compatibility.

@kimsible

either all MY LIBRARY links should have their own view (like subscriptions) or MY LIBRARY should be renamed MY ACCOUNT ? in the last case we would want to see Channels and Imports .

« My library » lists content for the user. « My account » describes less that it pertains to content, and is more generic.

@kimsible

The Chevrons at the right of Interface:Lang , Videos:any language , Sensitive: display are weird there, we wait for unfold another menu but these all are links;

Yes, they are links to specific parts of a settings page, hence the chevron. We could remove them, and instead display the option value there, in the same gray color.

@kimsible

Accout settings and More account settings are exactly the same link, it’s a little bit redondant;

Yes. I’d argue this is not very important, but the logic behind it was that displaying some settings directly in the dropdown is usually followed by a link to the rest of the settings.

@kimsible

We have a Channel settings link, why not Videos settings ? Subscriptions settings ? …

We lack vertical space

---

@kimsible

Ownership changes could be placed in the left menu MY LIBRARY

Ownership changes are rarely used, and left menu vertical space is precious.

@kimsible

Dropping My library and put all links to the left menu, their url could be replaced with /my-library/* prefix

Same as above.

---

Instead, I suggest :

• using a cog icon on the right side of the « Public profile » option that could replace the « Account settings » option
• transforming the second part of options in the dropdown (with the « Account settings » and « Channel settings » in a single row of icons, which would leave use more room for additional icons like those of other library settings.

[kimsible]

@rigelk

Instead, I suggest :

• using a cog icon on the right side of the « Public profile » option that could replace the « Account settings » option
• transforming the second part of options in the dropdown (with the « Account settings » and « Channel settings » in a single row of icons, which would leave use more room for additional icons like those of other library settings.

Thanks @rigelk for the answers =)

I created a branch and draft PR here : WIP Improve navigation user-dropdown, left-menu, my-account by kimsible · Pull Request #2973 · Chocobozzz/PeerTube · GitHub

It’s still in progress, I tryied some thing which are not definitive of course, for the vertival space in the left menu, we should try a menu to unfold (like an accordion).

[rigelk]

@kimsible

for the vertival space in the left menu, we should try a menu to unfold (like an accordion).

If you can create an accordion component, that would be much appreciated - no doubt it could be reused down the line.

[JohnLivingston]

This type of menu is cool and can replace an accordion: https://tympanus.net/codrops/2013/08/13/multi-level-push-menu/

[rigelk]

it is also significantly harder to implement.

[kimsible]

Yes very cool but also yes @rigelk, seems hard to implement according to the project history.

[kimsible]

Accordion solution

No accordion has been implemented yet, but I thought about a menu like that, off course for example when MY LIBRARY will be unfolded, MY ACCOUNT and VIDEOS will be folded.

I suggest that :

• Use a different background color for the block-title when unfolded ;
  -Blocklist redirect to /my-account/blocklist/accounts and this view would have a dropdown to switch between accounts and servers blocklist ;
• All the my-account sub-menu disappears replaced by titles (except for blocklist view)
• Subscriptions list redirect to /my-account/subscriptions edition list and Subscriptions to /videos/subscriptions
• Make redirections for each items in MY LIBRARY for example /my-account/videos to /my-library/videos

What do you think about these icons and names @rigelk @JohnLivingston ?

EDIT: I also sugguest to rename VIDEOS as VIDEOS FEED to be more explicit

[kimsible]

More Solution

Another solution is to extract settings from my-account sub-menu, and use a More link in MY LIBRARY that will redirect to the my-account sub-menu.

@rigelk, this solution seems simpler to implement, what do you think ?

[rigelk]

icons are fine

@kimsible

off course for example when MY LIBRARY will be unfolded, MY ACCOUNT and VIDEOS will be folded

I don’t think closing other accordions when you open one is desirable.

@kimsible

Make redirections for each items in MY LIBRARY for example /my-account/videos to /my-library/videos

I already disagreed in my previous message.

@kimsible

VIDEOS as VIDEOS FEED to be more explicit

I don’t think it is more explicit.

@kimsible

Another solution is to extract settings from my-account sub-menu, and use a More link in MY LIBRARY that will redirect to the my-account sub-menu.

@rigelk, this solution seems simpler to implement, what do you think ?

Sorry, but I think we should keep the sub-menus. They allow quick access to all user lists and settings, and provide an overview that is useful to get a grasp of what is available.

[kimsible]

@rigelk

@kimsible

Make redirections for each items in MY LIBRARY for example /my-account/videos to /my-library/videos

I already disagreed in my previous message.

Ok, I didn’t get the point in your first message , sure, it’s lots of work to maintain.

@rigelk

@kimsible

Another solution is to extract settings from my-account sub-menu, and use a More link in MY LIBRARY that will redirect to the my-account sub-menu.

@rigelk, this solution seems simpler to implement, what do you think ?

Sorry, but I think we should keep the sub-menus. They allow quick access to all user lists and settings, and provide an overview that is useful to get a grasp of what is available.

This was for the other solution and only for My Settings, I explain :

For me, My Settings is like general settings, we don’t touch every day. At the opposite the others components are for management of a specific content, so they should stay in the sub-menu.

EDIT: but I actully agree with you

@rigelk

@kimsible

VIDEOS as VIDEOS FEED to be more explicit

I don’t think it is more explicit.

Maybe EXPLORE instead of VIDEOS ?

[rigelk]

@rigelk

@kimsible

VIDEOS as VIDEOS FEED to be more explicit
[/quote]

I don’t think it is more explicit.

Maybe EXPLORE instead of VIDEOS ?

« explore » is acceptable, though @Chocobozzz might think otherwise.

What’s your gripe with « videos » though? It categorises the content that its child menu options cover, like « discover »: without that precision, one could be lead to think « discover? yeah but what? comments, videos, accounts? ».

[kimsible]

@rigelk

What’s your gripe with « videos » though? It categorises the content that its child menu options cover, like « discover »: without that precision, one could be lead to think « discover? yeah but what? comments, videos, accounts? ».

There are also audios only on PeerTube ! , Videos in more generic

[rigelk]

@kimsible

audios only on PeerTube

yeah but they are videos anyway, they are not a specific focus.

[kimsible]

[kimsible]

Sub-menu with icons :

[johnbeck7799]

@kimsible

No accordion has been implemented yet, but I thought about a menu like that, off course for example when MY LIBRARY will be unfolded, MY ACCOUNT and VIDEOS will be folded.

I suggest that :

• Use a different background color for the block-title when unfolded ;

• Blocklist redirect to /my-account/blocklist/accounts and this view would have a dropdown to switch between accounts and servers blocklist ;

• All the my-account sub-menu disappears replaced by titles (except for blocklist view)
• Subscriptions list redirect to /my-account/subscriptions edition list for sweet plushies and Subscriptions to here /videos/subscriptions
• Make redirections for each items in MY LIBRARY for example /my-account/videos to /my-library/videos

What do you think about these icons and names @rigelk @JohnLivingston ?

EDIT: I also sugguest to rename VIDEOS as VIDEOS FEED to be more explicit

Another solution is to extract settings from my-account sub-menu, and use a More link in MY LIBRARY that will redirect to the my-account sub-menu.

[rigelk]

The sub-menu is not a view though, so we can’t redirect to it. It has to be one of the views it links to.

[kimsible]

I think @johnbeck7799 meant that /my-account/settings will not display the user sub-menu and will be exclusively avalaible in the user-dropdown. So the More link in MY LIBRARY will have any other my-account sub-components not avalaible in the left-menu.