[EXP] Experimental Features in IMatch (Face Lift)

[Mario]

Slowly (very) I'm working on replacing the tool bars (3rd party UI toolkit) with the ribbon control I have written.
If you have enabled experimental features (Edit > Preferences > Application) you can already see and test the new ribbon components in the Metadata Panel and the Folders & Media View.

The most complex toolbar in IMatch is the File Window toolbar.
Replacing it with a ribbon is what I'm working on right now (as time permits). This is how the new File Window ribbon will look like:



All the icons are now vectors (no bitmaps), carefully hand-drawn by yours truly
The ribbons are fully responsive and can scale easily for icon sizes between 16 pixel and 256 pixel. More options to adapt IMatch to super high-res screens we'll see now in modern notebooks and PCs.

Let me know what you think. Thanks!

[Aubrey]

I see the new ribbon in the Metadata Panel. I like it, a more modern feel.

It's not showing in the File Window, (version 2023.3.6), but I expect that is work in progress.

Aubrey.

[Mario]

It's not showing in the File Window, (version 2023.3.6), but I expect that is work in progress.

The File Window ribbon might be included as an experimental feature in a future IMatch update.
At this time, only the ribbon in the Metadata Panel and in the Media & Folders View is included.

[Mario]

I have "finished" the new File Window ribbon now and today's the first day that I've used IMatch without the normal File Window toolbar (I have to run both in order to reach all functionality until now).

My ribbons are responsive, which means that they can adapt to various screen resolutions and File Window widths.
The idea is that controls like input fields or sliders can shrink when there is not enough horizontal space. This allows all controls to show on small screens.

If the screen is even smaller or the user makes the window containing the ribbon very narrow, selected controls (by me) are moved into a drop-down "hamburger menu" to make room for the other controls.
I can control that for each control via a "always show" or "hide in this order" setting.

Since I now use my own code, I have full control over the functionality and can basically built whatever I want.
For example, may be a smarter control for all the search bar options (think: Viewer Smart Menu) or maybe a control that allows to quickly filter by rating/label without the Filter Panel. We'll see.

Since I need to draw all the icons again (this time as vectors in Designer) and switch ever toolbar and menu, this will be an ongoing process over the next IMatch releases. All "hidden" behind the experimental features option.

This is the File Window ribbon at various window widths:

(Comments welcome!)



(Note: The menus show the current icons at this time. I will replace these themes menus from the UI toolkit with standard Windows menus, which also solves the issue some users have to tell if an option is checked or not).

[javiavid]

A contribution. I understand that this is a slow process and the issue of design is something very subjective, but I think it would be good not to have too many colors in the toolbars, because they are distracting.
A way to highlight which option is activated could be like in the image I attached.

Another option could be that it was gray and when activated it would turn white.

[Mario]

I work with Ps and other Adobe products every day.
I also work with Affinity products, which use muted colors to make it easier and quicker to identify icons.
Color is important, IMHO. Your eye can match color much faster than form alone.

I've created a palette of fairly muted colors I use for ribbon icons. They don't distract and are slightly dimmed unless the mouse hovers over them. You can try that out with the ribbons already includes in your IMatch version.

This is a screen shot of Affinity Designer, a widely used and very successful product. I work with it every day too.
I prefer their colored icons over Photoshop's monochrome icons.
The screen shot shows the current set of colors I use for all ribbon icons I draw.




I'm open to suggestions from users, though.

[javiavid]

I think it's okay to use colors, maybe they try not to use too many, to make it simpler.

Number of colors
If you look at the screenshots you send me, they only use 1 highlight color + 1 gray to integrate it with the dark gray of the toolbar.
In the new icons you are creating they have 3 colors. 2 colors on the icon + another color to select it.
Maybe you can try something similar to use just 1 color + gray on each icon.

Groups
In the example, the colors that do similar things use the same color so that there are not many different colors in a row. Maybe this will also help you to make it simpler, so maybe you don't need so many colors.

[javiavid]

I attach another example of a program that has many icons and a reduced color palette, so you can see some ideas.

[javiavid]

I think I would avoid the white border when you select the icon, this adds another color and with the background color you can already see that it is selected. Look at the screenshot of the Maya software.

[sinus]

People feel differently. The screenshot of Maya looks pretty awful to me.
And others will think it looks great.

You can never please everyone.

[Jingo]

I agree Markus.. I use InDesign EVERY day and the non-colored icons don't bother me one bit - in fact, I actually may prefer them.. mainly because I know where everything is and can select items with keyboard shortcuts or a quick glance at the toolbar.  Familiarity and function are more important at the end of the day than icon color or graphics.. that's eye candy for marketing folks IMO.

[Mario]

People feel differently. The screenshot of Maya looks pretty awful to me.
And others will think it looks great.

You can never please everyone.

That's why I make these posts and added the experimental feature option.
To get early feedback from as many users as possible. If there is no consensus we (or I) need to find a compromise.

On example: IMatch has a feature that allows you to display all icons in gray scale. Which produces more muted icons which, my guess, would appeal to some users:



But, at least for the users participating in telemetry, the number of users using this feature is < 1%.
Which tells me that either

a) users don't know about this (it's in the help, but how to inform them?)
b) users like the current icons, so there is no need to change anything (?)

[mopperle]

Option a) applies to me and TBH no idea how to make users aware of it.
Personals I like colours, but not too dazzling colours

[nordkapp]

Just tried the experimental features.
For me the new icons look more modern. I like them

But I would prefer the old gray background of the icon toolbar. Here I can see quicker where the toolbar is. Maybe it is just the first impression and after using it more it will make no difference anymore

The toolbar in the metadata panel isn't complete at my layout. with the normal toolbar there is a break after the last icon that fits in the first row and the globe icon is in a next row. With the new toolbar I cannot access the globe or I have to make the metadata panel wider.

[Mario]

But I would prefer the old gray background of the icon toolbar. Here I can see quicker where the toolbar is. Maybe it is just the first impression and after using it more it will make no difference anymore

The toolbar is always at the top. The light-gray background is gone with ribbons.

The toolbar in the metadata panel isn't complete at my layout. with the normal toolbar there is a break after the last icon that fits in the first row and the globe icon is in a next row. With the new toolbar I cannot access the globe or I have to make the metadata panel wider.

Yes. No line wrapping of icons in ribbons for now.
Ribbons will place icons not fitting on screen into an overflow menu. See related discussion in the experimental ribbon thread.
This is simpler and should work fine. Unless you use a super-low screen rez or you force panels to be so narrow that important icons have to move into the overflow menu.

When you report such issues, always include a screen shot and details about your screen resolution and Windows configuration (DPI scaling (zoom), text scaling ("Make Text Bigger") because IMatch considers all this and ribbons do to.

[loweskid]

In the UK at least, approximately 1 in 12 men and 1 in 200 women have some sort of colour blindness and many aren't even aware of it. So in all this discussion about colour, bear in mind that we might not all be seeing the same thing..!

[Mario]

In the UK at least, approximately 1 in 12 men and 1 in 200 women have some sort of colour blindness and many aren't even aware of it. So in all this discussion about colour, bear in mind that we might not all be seeing the same thing..!

I always keep that in mind. This is why all icons also work in grayscale (regular toolbar or ribbons).
I use colors for quicker recognition due to better variance - which should for all users with normal eyesight and users with color blindness or restrictions.