UX: Restructure main navigation

[benmccann]

I'd like to propose a few ideas for the way the menu is organized. This was spurred by trying to figure out where we might be able to place /browse in the menu structure (#856)

Before

After

Structure

├ Browse
  ├ Photos
  ├ Videos
  ├ Monochrome
  ├ Panoramas
  ├ Scans
  ├ Archive
├ Albums
├ Favorites
├ Private
├ Explore
  ├ Moments
  ├ Calendar
  ├ Places
  ├ States
├ Labels
├ Review
  ├ Stacks
  ├ Errors
├ Library
  ├ Originals
  ├ Folders
  ├ Hidden
├ Settings
  ├ About
  ├ License

Description

Some things this accomplishes:

• /browse now has a place in the menu as the main item "Media"
• There are fewer first-level categories which makes the menu easier to digest. It also allows it to fit on a single screen on mobile (iPhone 5 SE pictured above). This is mainly through the creation of an "Explore" category which groups together interesting ways to explore your photos
• Creates a category for review actions
• Puts Folders and Originals under the same heading since they're quite related. One has you browse the tree structure of the folder and one lists all the folders directly, but both refer to the on-disk layout I believe. This helps reduce the number of top-level items

Some things I debated:

• Whether some of these navigation items should go in the search menu instead. E.g. should there be a dropdown with the options "All Media", "Photos", and "Video" instead of having "Photos" and "Videos" in the left hand menu? Or should there be a dropdown with the options "All colors schemes", "Colored", and "Monochrome"? Or one with "All Photo Types", "Panoramas", "Scans", etc.? Without thinking about this super hard, I just leaned towards minimizing change.
• Whether we need "Calendar" since we also have "Year"/"Month" dropdowns in the search filter, "Moments", and the ability to sort by date. But I thought it didn't hurt to leave it if it's grouped under another item and not taking up top-level space. Also, having it might provide an easy way to navigate by year and month combination, which would allow us to possibly change the "Year"/"Month" dropdowns to "Start" and "End" calendars for a more advanced search (Vuetify has a good component for that)
• Should "Labels" go under Explore? I'm thinking it probably should, but I left it alone for now because it seems we'll have some changes coming up with the facial recognition and I didn't know how that might change things
• Should "Favorites" go under "Albums" since it's basically just a special album?

[graciousgrey]

Thank you for your ideas! We will come back to this once we've finished up some other to dos :)

[benmccann]

I've implemented this locally and updated the issue description with some screenshots. I can clean it up and send a PR depending on your feedback

[lastzero]

This might be going in a good direction, but it's too big of a change to just merge and deploy it to everyone... need to think about it, ideally after we had the chance to get some sleep 😉

[lastzero]

As a quick thought, "media" doesn't seem ideal as the top navigation point... sounds too technical for me, also we should have named our app "MediaPrism" then? 🤔

What about "Search" or "Browse"? I know, browse may be too general, as you can also browse on other pages...

[benmccann]

Yeah, I was not in love with the "Media" name either. I like "Browse" a lot more than "Search". Usually when I'm on that page I'm not using the search box, but just viewing the most recent photos, so the latter doesn't seem quite accurate. I don't think there's an issue with "Browse" being too general. It's called "Photos" today and you can also view "Photos" on other pages, but I've never found that to be an issue

I've gone ahead and updated the screenshot and description above to use "Browse" instead

[nikolajhendel]

Not sure if the menu suggestions also covers the functionality of combining photos and videos?
Currently viewing photos and videos are separated - which to me does not make sense (for those of us using PhotoPrism for private photo/video libraries).
The only way to combine photos/videos into 1 view (that I have found) is to create an album - in that case everything is combined.

If the menu optimisation includes a combined view of photos+videos, I'm all for it - if not, I would like to suggest or create an idea where there is an option to combine the two.

[lastzero]

@nikolajhendel what you want already exists: https://demo.photoprism.org/browse

We simply started with Photos, as the name PhotoPrism suggests. So it made sense to put long videos in a separate place. Short videos aka live photos are in Photos.

[lastzero]

We may rework the navigation based on this, but released only 10 days ago. Give us to time to think this over and do it in an orderly fashion.

[nikolajhendel]

Thanks @lastzero for the /browse tip (and not least for an excellent product) - that is exactly the functionality I was after.

Just out of curiosity, is the /browse functionality mentioned anywhere (I can't find it in the documentation) - and is there a way to get to it from the menu? (i can get to /photos, /videos, /library, etc. - but there is no menu item that takes me to /browse for the combined view).

[benmccann]

@nikolajhendel you can see more details in #856. It's not that easy to get to yet, but hopefully we can figure out a way to better surface it

[nikolajhendel]

thanks for the link @benmccann, I'll await the (hopeful) change of the main navigation.

[lastzero]

Let us know if this will work for now...

[lastzero]

PS: Had to use "Search" as there is no translation for "Browse".

[nikolajhendel]

@lastzero - absolutely amazing.
Running the latest docker version with "search" (/browse) instead of Photos.
To me it's perfect, and the best way to represent all media in 1 continuous stream.

Thanks so much
Nik

[lastzero]

Thanks for the valuable feedback! Thought about changing this earlier - a concern was that users expect the number next to search to be the result count rather than the total number of photos & videos. You may still get to /photos when you click on Search > Stacks and Scans. Videos technically are always stacks as there is a video file and a preview image.

[lastzero]

Refactoring the remaining navigation will take time, also because we need to wait for translations whenever new words are used. When adding the People page for face recognition, we need to touch it anyway.

[lastzero]

What about this?

[lastzero]

Note hat I've reverted moments / explore back to using the star icon as the "compass" icon looks too much like the video icon (if we change it).

[lastzero]

Preview build is running: https://docs.photoprism.app/getting-started/updates/#development-preview

[benmccann]

I really like the new Shadow theme that's on the demo server. It looks nice!

I used Explore as a group heading to put Moments, Calendar, Places, and States under it. It doesn't look like the others have been moved under it though. In my proposal I still had Moments - I think Explore is good for a grouping header, but if we're just going to leave it ungrouped then I think Moments is a clearer name than Explore since it's more indicative of what content is there

I'd also suggested other changes like calling it Browse instead of Search and moving Videos under that heading. And also creating a review heading. I'm not sure if these were all decided against since this issue was closed?

[lastzero]

Other suggestions were not explicitly decided against, but that's what we could deliver right now (see my other comments about time and resources). The only thing I would never, never do is hide the maps - one of our most popular features - in the sub-navigation. Also, more changes may need additional translations. I'd rather deliver value to our users now than going for perfection.

If you like, you can add a follow-up issue for changes you want to see in a later release! 😃

[benmccann]

Makes sense that it might not be a priority right now.

In the meantime, can we consider renaming Explore back to Moments? I never wanted to get rid of Moments as a header - only group some headers together to reduce the number of items in the menu

[lastzero]

How quick was that?

[benmccann]

Thanks!! 😄 😄

[Sherlock1979]

Note hat I've reverted moments / explore back to using the star icon as the "compass" icon looks too much like the video icon (if we change it).

While in PhotoPrism the favourite icon is a heart in other apps star is a common icon for that. So maybe I would try not to use star icon for anything else.

Have you considered the 'history' or 'supervised_user' or the 'wallpaper' or the 'bubble_chart' or the 'collections' or the 'photo_library' icon for Moments?

[benmccann]

I'd agree with this. bubble_chart and wallpaper look like nice options

collections could be a good one to use for albums actually (right now albums uses bookmark)

[lastzero]

Apple and Huawei use hearts in the exact same position (from what I know, they sell the most devices):

Let's don't change the navigation and icons on a daily basis! 🙏

[Sherlock1979]

I am not against the heart. My proposal is to change the Moments icon to something that's not the star.

[lastzero]

These are highlights based on clusters. So it's like a favorite, unless you didn't enjoy the journey and took lots of pictures to document how bad it was.

[lastzero]

Google BTW also uses Bookmark for albums, just combined in a super ugly photo_album icon featuring a rectangle and a mountain:

https://material.io/resources/icons/?search=photo_album&icon=photo_album&style=baseline

[Sherlock1979]

While I admit that the Google icon is super ugly, for some reason I prefer that over the plain bookmark icon :) I was a bit disappointed that you reverted back to bookmark from the ugly icon. :)

In regards to the star I understand your logic but still disagree and find the star confusing for average users. But it's your product and it is really a low-value and very minor change so I am happy to let it go. :)

[lastzero]

When we can afford to pay designers, we will get our own super amazing icons. You know what to do: Spread the word!

Let's keep the star until we find a better alternative. Charts or bubbles are worse, trust me. Explore would have been good, but not in combination with the new video icon you proposed and got 😉

[lastzero]

What about ... ?

[nikolajhendel]

@lastzero - I would say wait for a designer to look at it :)

[Sherlock1979]

Yeah, I don't see how those stars could work in their current format as they don't fit the material design style at all. Maybe this one is close enough?