[Feature Request]: Alterative Displays for UI/UX

[Chino-chan]

Checklist

• I am using an up-to-date version.
• I have read the documentation.
• I have searched existing issues.

Description

While using TagStudio I've found myself noticing some inconveniences regarding UI/UX and I would like to offer my suggestion.

Regarding thumbnails;

1. When you select a picture in the TagStudio Galley, a "star" icon appears on the thumbnail along with a red "archive" icon. I've personally found myself not using the "archive" icon, and wishing there was in its place a "copy image to clipboard" icon (something that you can not do with ctrl+c anyway).

It would be good if the user could choose which icons available to display over the thumbnail, and if the "copy to clipboard functionality" was implemented both with ctrl+c as well as icon based.

2. Double clicking an image thumbnail does not open the image in full view, while it does when clicking the image on the visualization panel on the right. Personally, I've found this behavior a bit annoying as well, and wishing that double clicking the thumbnails would also open the image in full.

3. Being able to use keys to move around around the galley thumbnails. Currently, you can only change images by selecting the thumbnails, you can not navigate using the keyboard arrows.

Regarding Tags;

1. I've found that the way to create & manage Tags that act as "Tag categories" is a little bit confusing. Instead of simply having a "Create Tag Category", you need to create a normal Tag, and then mark it as "Is Category". This seems ok, but the result is still a bit clunky as it appears to create a tag within the same Tag.

I think ideally, even if Category Tags in the background behave as just normal tags with children tags, they should be handled separately in some way in terms of UI/UX. Maybe by separating them in the Edit menu as "Manage Tags", "Manage Tag Categories" or something like that.

What bothered me the most however, is how hard is to assign tags to categories.

For every tag added, it would go by default under "Tags" and had to be manually linked to their parent tag (Tag Category). In this case, I would prefer as an end user if I could simply click the current available tag category (in this case "Fashions" and then the tag that I'm writing be automatically assigned to this category.

It would also be great if you could make that Tags within a category share the same color as the parent tag (meaning that, in this case, all tags under "Fashions" would be pink, if the user chooses this behavior).

Regarding Tag/Image display

I think the image visualization could be greatly improved. Currently, the image to visualize and the tags are stacked sharing the same space on the right. If I want to expand the image to view it as much as possible, then I'm forced to stretch it down further until I have hidden the tag selection, or to click the image and open it in full view outside TagStudio.

Ideally, I think having the image covering the entire size of the right would be the best approach, since users wouldn't need to actually open the image or be constantly expanding it/hiding the tags.

For this, I propose adding an alternative layout where the image is expanded almost entirely on the right, while at the bottom having a bar with several functional buttons. One of them would be "<<" or "<< Display Tags" that would deploy the tag column on the left. Ideally, once this column is displayed, it should stick being displayed even if the user changes picture, until they decide to click the "Display Tags" button again to hide it.

This bottom bar could also hold other important buttons such as "Archive", "Favorite", "Copy to Clipboard" and future more. This is important and relates to the option to customize these on the thumbnails that I said earlier, because I've also noticed that these icons that currently lay over the thumbnails can be clicked by accident, specially if the user is using very small thumbnails

Lastly, I think the bar on the top could hold some shortcuts, such as recently looked tags, frequently/favorite looked tags, as well as maybe a dropdown that allows to select specific folders in current library (and therefore applying a filter to the gallery display). Something like that!

Full view;

Mind you that I edited everything with paint. It's just orientative okay, to get the point across!.
Thank you for reading!!

Solution

No response

Alternatives

No response

[Thecreatre]

the images are broken

[TrigamDev]

Generally, it's a lot better to create separate issues for each point, rather than one massive issue. And some of these points are addressed by other issues or planned features, such as #226 for keyboard navigation, and the planned persistent tag panel covers the tag-related shortcuts.

[Chino-chan]

Generally, it's a lot better to create separate issues for each point, rather than one massive issue. And some of these points are addressed by other issues or planned features, such as #226 for keyboard navigation, and the planned persistent tag panel covers the tag-related shortcuts.

These aren't really issues though, it's a collection of UI/UX suggestions from my part. I wasn't gonna spam an entry for each one... I recon you can take whichever you like and organize them on kanban separately. I'm glad to hear some of these are being developed! Cheers.

[Chino-chan]

the images are broken

Sometimes GitHub fails to load images. Reload the page again or Ctrl + F5.

[TrigamDev]

These aren't really issues though, it's a collection of UI/UX suggestions from my part. I wasn't gonna spam an entry for each one... I recon you can take whichever you like and organize them on kanban separately. I'm glad to hear some of these are being developed! Cheers.

• While all of these points are related in that they're UI/UX improvements, these are all different issues ("issue" can mean things like bug, problem, or suggestion, idea, improvement, etc). They tackle the same topic, but implementation-wise, are wholly unrelated changes to each other. None of them require the others to function.
  • For example, there could be one issue that requests for there to be a "copy image" icon in the thumbnail, there could be another issue that requests double clicking on a thumbnail to open the file, etc. These are different changes, don't depend on each other, and could be implemented independently of each other, so should therefore be made as different issues.
• It's better to keep things to one thing per issue, for many reasons.
  • It keeps things well organized and easy to understand.
  • It's easy to track each task, being able to mark each individual issue as complete, as opposed to multiple contributors having to handle working on different aspects of the same issue and somehow tracking that.
  • Each task can be handled easily, where one contributor can handle just one task without the burden of everything else, and contributors can work on different tasks simultaneously.
  • It's easier to reason about the work required when each task is laid out individually, rather than needing to scrub through a giant issue.
• The project kanban is driven by GitHub issues, where each issue is one card. We can't just organize each of these points separately, since they're all in one issue.