[EXP] Wide Load Ribbons - good idea?

Started by Mario, November 21, 2023, 08:13:47 PM

Previous topic - Next topic

Mario

I've had the idea to use free space in ribbons for making elements like edit fields or drop-down controls wider, to allow the user to see more.

For example, on my 4K monitor the File Window ribbon always has a lot of extra space, despite docked panels left and right. I've set the sort profile drop-down and the search bar ribbon elements to allow grow and now I get this:

Image1.jpg

When I resize the File Window, these elements shrink again, leaving as much room for the other elements as needed.
When the horizontal space is exhausted, the ribbon wraps into 2 or more rows as shown in my post last week.

The ribbons are responsive, adapting to screen size and DPI settings and File Window width and panel width choices the user makes.

Since I've developed the ribbons from scratch, I can do whatever I want now and I have full control. Very nice.
A lot of work, but worth it.

I'm slowly making progress, redrawing / redesigning each toolbar icon as a vector graphic and replacing each toolbar with a ribbon. Will take a couple of weeks to finish. Here are the art boards for ribbons I've drawn so far:

Image2.jpg
-- Mario
IMatch Developer
Forum Administrator
http://www.photools.com  -  Contact & Support - Follow me on 𝕏 - Like photools.com on Facebook

sinus

I am not sure about wide Load ribbons. What I like is, that icons stay there, where they are and does not change the place.

I attache, like it looks now here.

What I think, could be for sure better, is the slider to change the item size.
With the mouse it is not easy to change the slider, ctrl mouse wheel works here not, though it would not help a lot, I think.

What I do, is click on the slider and change the size with the left-right keys on the keyboard.
This works well.

I do not know, if this is only here the case. If it would help, to make the slider wider, I do not know, but I guess, no.
This behaviour was also before the ribbon-stuff, hence has not really to do with it. 

Maybe a vertical slider would help, at least, it would save horizontal space?

(I was not sure, if this is the correct place to post this, if not, sorry)
Best wishes from Switzerland! :-)
Markus

Mario

Quotectrl mouse wheel works here not,
Sure it works. Please the mouse cursor over a File Window and use Ctrl+Wheel to zoom in or out.
The slider is not really needed for a couple of years now (except maybe for clicking into it and then using the <cursor> keys to zoom in and out).

Looking at your screen shot, I can tell what the problem is. You have so many shortcut icons that they don't fit anymore.
Have you considered using the Favorites Panel instead?

The ribbon tries to help by collapsing low-priority elements (like the slider, which can easily be replaced by <Ctrl>+Wheel).
Note that the new ribbon will wrap into several rows in this case, the Hamburger menu has been replaced.

Since there is already no room in your ribbon, the new wide load feature will do nothing for you.
The controls cannot grow, since there is no space left in your ribbon.

Instead of cramming so many favorites into my File Window ribbon, I personally would just keep the Favorite Panel open. Even when made very small, the Favorite Panel can hold a lot more Favorites than the File Window ribbon can.
Or maybe I would use keyboard shortcuts or the Command Palette to trigger my less-frequently used Favorites. Unless you need these 14 Favorites all the time.
-- Mario
IMatch Developer
Forum Administrator
http://www.photools.com  -  Contact & Support - Follow me on 𝕏 - Like photools.com on Facebook

sinus

Thanks, Mario
it works with place the mouse over the thumbs, NOT stay on the slider.

I will change my favourites, but without ribbon, sorry, it worked perfectly for me, because it flew simply on a new line, what was very cool. (see attachement).

An yes, all these icons I use daily for my workflow, that is why I placed it there. But with ribbon, it is not more very good possible with such a lot of icons, hence I will try to use favourites (again).
Best wishes from Switzerland! :-)
Markus

sinus

Quote from: Mario on November 27, 2023, 12:50:01 PM
Quotectrl mouse wheel works here not,

Note that the new ribbon will wrap into several rows in this case, the Hamburger menu has been replaced.


Maybe this is the solution for me.  :)
Best wishes from Switzerland! :-)
Markus

Bolitho

2023.5.2
Seeing it in "real life" I don't like it.
To me it looks clumsy, the fields are far too long.
Probably it's the luxury of having enough screen estate ;-) ?
Can't it be made configurable?
E.g. simple ("classic" length vs. "max." length)?
Or comfortable (like e.g. firefox where you can add/fill in placeholders).
The latter might be an overkill. 

Mario

QuoteProbably it's the luxury of having enough screen estate ;-) ?
I use it on 4K monitors and the fields are indeed quite wide, depending on how you configure your workspace and how many panels are docked.

But it also allows you to use longer sort profile names, and to easily type in and see longer search patterns in the File Window search bar. Especially when you often work with Boolean operations like London AND 2023 AND Knightsbridge the added width of the search bar comes in handy. I've got used to this quickly.

I could set a maximum width for the auto-grow ribbon elements. But that would just create more empty space on wide screens. And how to determine the maximum width? Number of characters to display? Pixel width in relation to the ribbon width? What one user would see as a comfortable maximum would feel to narrow for another user.
And spending time (and money) on making the maximum element widths configurable seems a bit like overkill.

Visual Studio has something like this in the 12th level of sub-menus.
Affinity uses spacers you can place on a ribbon to separate things or control widths. With a neat UX.
But Serif also has 250 employees and they can set a team to spend a months or so on such features.

What do other users think?
The idea of experimental features is to test and discuss them before they are added to IMatch (or thrown away).
-- Mario
IMatch Developer
Forum Administrator
http://www.photools.com  -  Contact & Support - Follow me on 𝕏 - Like photools.com on Facebook

ColinIM

I admit that I don't yet use a 4K monitor but I would vote yes for the sort profile drop-down, and the search bar ribbon elements to be allowed to stretch.

I would enjoy using - and being able to see - longer names for my sort profiles, but I also feel that to have a 'cramped' field width for a manually typed search term is less than ideal.

Mario

Both the sort profile drop-down and the search bar input field grow when there is room. They share the extra space 50/50.
-- Mario
IMatch Developer
Forum Administrator
http://www.photools.com  -  Contact & Support - Follow me on 𝕏 - Like photools.com on Facebook

ColinIM

Quote from: Mario on December 17, 2023, 06:35:08 PMBoth the sort profile drop-down and the search bar input field grow when there is room. They share the extra space 50/50.
Yes, I think a 50/50 % split would be very good, if (in the end) you do choose to allow these elements to stretch whenever possibe.

Bolitho

Due to the wide ribbon it has become a looooong way for the mouse to reach the favorite icon(s) now to the uppermost right of the filewindow.

Suggestion:

Couldn't all the icons starting from the funnel icon be moved directly to the right of the slider - thus moving the search bar to the right but keeping the wide ribbon?


ribbon2.jpg

airpic

I recently started to look at the new ribbons and must admit it took some time to get used to. 

However, I noted that the new ribbons take up much more space than the old ones. I attach two screenshots comparing the two settings. 

Christoph

airpic

For my taste, the new icons are way to large and dominant. Could these icon made somewhat smaller in order to be more pleasing?

Christoph

Mario

#13
QuoteFor my taste, the new icons are way to large and dominant. Could these icon made somewhat smaller in order to be more pleasing?
You can control the icon height between minsize (depends on your system, DPI , theme) and 128 pixel vie Edit menu > Preferences > Application: Ribbon Height. The default size is the same size as before: 32px.
-- Mario
IMatch Developer
Forum Administrator
http://www.photools.com  -  Contact & Support - Follow me on 𝕏 - Like photools.com on Facebook

cg

Apparently the minsize for the ribbon on my system is 50, though I would love for it go to 32, as they seem somewhat large.

(As I inadvertently created a second topic for this here: https://www.photools.com/community/index.php/topic,13955.0.html)

Thanks!

Mario

Quote(...) I would love for it go to 32, as they seem somewhat large.

The minimum height of ribbon icons is determined by the minimum height of combo boxes (sort order in the FW ribbon) and edit controls (search bar in the FW ribbon). Plus a few pixels for margins/padding.

On my 4K at 150% scaling Windows reports these as 28 pixels. If you use very high DPI scaling (not uncommon on 4K laptop monitors which often need 250% scaling just to make text readable) or you use a non-10ß% text scaling, these minimum sizes will be higher. What scaling do you use?

IMatch cannot control the size of Windows controls like edit boxes or combo boxes. It asks Window how much height it needs and this then is the base height for ribbons. If the ribbon height would be less, the edit control or combo boxes would not fit or work.
-- Mario
IMatch Developer
Forum Administrator
http://www.photools.com  -  Contact & Support - Follow me on 𝕏 - Like photools.com on Facebook

cg

Hi Mario,

I use a 4k laptop, so my scaling is set to 250%.

I'm attaching an old pre-ribbon screen grab along with the current ribbon with the file window set to the same width.

Thanks!

Mario

-- Mario
IMatch Developer
Forum Administrator
http://www.photools.com  -  Contact & Support - Follow me on 𝕏 - Like photools.com on Facebook