The state of Tango! Icons in UI elements

The place to bring up any design issues, or post your own creations

Moderator: Moderator Team

Post Reply
User avatar
KevDoy
Posts: 8
Joined: Fri Jun 29, 2018 12:57 am
Contact:

The state of Tango! Icons in UI elements

Post by KevDoy »

Just like many open source projects, ReactOS uses Tango! Icons in many places. In the past 10 years we've seen more and more of the community move away from these icons due to them being dated in the sense of accessibility and style. Tango!'s official website is not even online anymore (honestly a shame).

I'm curious what the community thinks of replacing some of the Tango Icons, at least in application's navigation with a more modern alternative. I've been working on a modern replacement for Tango using symbols, following UX/UI trends.

Current, with Tango! Icons:
[ external image ]
reactos-tango.jpg
reactos-tango.jpg (247.25 KiB) Viewed 4542 times
Mockup of what ysUI Icons would look like:
[ external image ]
reactos-ysui.jpg
reactos-ysui.jpg (243.54 KiB) Viewed 4542 times
The icon set is not yet complete, but I figured I'd share this to get community thoughts.


Cheers!

Edit: Added images inline
Last edited by KevDoy on Fri Jun 28, 2024 9:13 pm, edited 1 time in total.
reactosfanboy
Posts: 17
Joined: Sun Feb 01, 2015 1:54 pm

Re: The state of Tango! Icons in UI elements

Post by reactosfanboy »

Can you post a picture of how it would look like in Classic theme, please?

I do think that your Explorer-navigation-icons do look superior over Tango.
But I do also think that stripping the colors from them entirely does actually worsen the user experience (even if that is what more modern Windows versions did as well).

E.g. in the File-Open-dlg of Windows 10 I always search like an idiot for the "New folder" button, although it is actually very present, but it lacking the Yellow-folder-icon just makes it much harder to spot it quickly with the eyes:
win10fileopendlg.png
win10fileopendlg.png (25.75 KiB) Viewed 4574 times
That is subtle but it annoys me every day of using Win10.


But yes, especially the shredder icon and also the "Folders"-icon, that we used until now, looked very poor and outdated. Yours are better.

When replacing icons, it is also wise to always have the size of those icons in mind, since they will have direct impact on shells dlls size, are always loaded, and therefore also impact the minimum memory requirements of ros.
User avatar
KevDoy
Posts: 8
Joined: Fri Jun 29, 2018 12:57 am
Contact:

Re: The state of Tango! Icons in UI elements

Post by KevDoy »

reactosfanboy wrote: Fri Jun 28, 2024 4:30 pm Can you post a picture of how it would look like in Classic theme, please?
I don't have a VM currently up and running and for sake of time, if you could drop in a screenshot similar to the one above in classic mode, I'll gladly mock that up.

Cheers.
User avatar
KevDoy
Posts: 8
Joined: Fri Jun 29, 2018 12:57 am
Contact:

Re: The state of Tango! Icons in UI elements

Post by KevDoy »

Here's a mockup with the classic theme:
reactos-ysui-classic.jpg
reactos-ysui-classic.jpg (104.37 KiB) Viewed 4528 times


I probably would adjust the shade of black to better match the theme, but it still fits.



Edit:
Some additional color and sizing adjustments to make it fit the classic theme a bit better:
ysui-classic.jpg
ysui-classic.jpg (97.85 KiB) Viewed 4499 times


Edit2: if any decision makers like this, if anyone has a list of the icons that are embedded in explorer.exe, I'm happy to put together a github pull request.
manuel
Posts: 447
Joined: Thu Jan 28, 2010 11:20 pm
Location: México
Contact:

Re: The state of Tango! Icons in UI elements

Post by manuel »

Hello, thanks for the contribution, although personally I think that those icons without background color are somewhat simple, perhaps if they were modified and given some color.

I also agree that it would be good to look at other options apart from Tango, on Linux there are many attractive icon packs, perhaps it would be good to take a look at one of these and replace the entire Reactos icon scheme.
manuel
Posts: 447
Joined: Thu Jan 28, 2010 11:20 pm
Location: México
Contact:

Re: The state of Tango! Icons in UI elements

Post by manuel »

Very general mockup of what Reactos could look like with Adwaita icons
reactos icons adwaita.png
reactos icons adwaita.png (252.2 KiB) Viewed 3667 times
reactosfanboy
Posts: 17
Joined: Sun Feb 01, 2015 1:54 pm

Re: The state of Tango! Icons in UI elements

Post by reactosfanboy »

download/file.php?id=285
That one did look quite nicely imho. I just missed some colors in the icons.
My personal opinion: If there was a PR that would just replace the shredder-icon with the one you suggested here, I would most likely approve that already (even with the current black color, but personally I think coloring that in red would be best, same as XP did). Our old shredder-icon is horrible, everything is better than that.

The "folders-icon (just the one in the symbols-bar)" you proposed I think would be an improvement as well, but here as well: I liked it even more, if it was somehow colored (yellow-ish for example).

But the download/file.php?id=297 is just ewww to me, the icons are much too large, they are ugly, and don't really fit any schema.
User avatar
dizt3mp3r
Posts: 1898
Joined: Mon Jun 14, 2010 5:54 pm

Re: The state of Tango! Icons in UI elements

Post by dizt3mp3r »

I prefer the tango icons or something more closely resembling the original XP icons
Skillset: VMS,DOS,Windows Sysadmin from 1985, fault-tolerance, VaxCluster, Alpha,Sparc. DCL,QB,VBDOS- VB6,.NET, PHP,NODE.JS, Graphic Design, Project Manager, CMS, Quad Electronics. classic cars & m'bikes. Artist in water & oils. Historian.
User avatar
KevDoy
Posts: 8
Joined: Fri Jun 29, 2018 12:57 am
Contact:

Re: The state of Tango! Icons in UI elements

Post by KevDoy »

reactosfanboy wrote: Wed Sep 25, 2024 5:29 pm download/file.php?id=285
That one did look quite nicely imho. I just missed some colors in the icons.
My personal opinion: If there was a PR that would just replace the shredder-icon with the one you suggested here, I would most likely approve that already (even with the current black color, but personally I think coloring that in red would be best, same as XP did). Our old shredder-icon is horrible, everything is better than that.

The "folders-icon (just the one in the symbols-bar)" you proposed I think would be an improvement as well, but here as well: I liked it even more, if it was somehow colored (yellow-ish for example).
I appreciate the kind words and feedback here. I'll take a look at doing some more testing and potentially putting together a PR.
reactosfanboy wrote: Wed Sep 25, 2024 5:29 pm But the download/file.php?id=297 is just ewww to me, the icons are much too large, they are ugly, and don't really fit any schema.
I could see these icons working, just not in the UI/navigation elements. For the folders, desktop, and inside the explorer I could see them making sense. Although, I'm not sure these are the right icon set.
User avatar
KevDoy
Posts: 8
Joined: Fri Jun 29, 2018 12:57 am
Contact:

Re: The state of Tango! Icons in UI elements

Post by KevDoy »

reactosfanboy wrote: Wed Sep 25, 2024 5:29 pm My personal opinion: If there was a PR that would just replace the shredder-icon with the one you suggested here, I would most likely approve that already (even with the current black color, but personally I think coloring that in red would be best…
Back in June I had found the likely path for the explorer’s icons in question, and have now forgotten as I found icons in several locations. Just to make sure I get it right, do you know the exact path to the icons?


Edit:

I imagine it’s likely one of the icons in /dll/win32/shell32/res/icons

However, there are several instances of the shredder there and I want to make sure that I pick the correct one.

161.ico
16710.ico
16710.ico
16717.ico
16718.ico
16721.ico

Cheers


Edit 2:

It’s likely these instead.

/dll/win32/browseui/res/
214.bmp
215.bmp
User avatar
leppy232
Posts: 30
Joined: Tue May 12, 2020 5:30 pm
Location: El Estado de la Hoja de Oro
Contact:

Re: The state of Tango! Icons in UI elements

Post by leppy232 »

Personally, I like these proposed icons, they might be simplistic but they seemingly work in every environment. I'd wonder what it would look like with a darker color scheme, I imagine just value reversed.
As for the example of "create new folder", I think the color neutral symbol for that is a folder with an asterisk or star at the top right corner.
Currently using: 0.4.15-x86-dev-4872-g8a3db97 (VirtualBox)
Pretty good so far, keep up the good work! :D
Formerly tested on: Dell Inspiron 2200, HP Pavilion p7-1155, want to test on: Dell Inspiron 8500, custom-build ROS machine (P4 2.8GHz, GF6800 Ultra)
User avatar
KevDoy
Posts: 8
Joined: Fri Jun 29, 2018 12:57 am
Contact:

Re: The state of Tango! Icons in UI elements

Post by KevDoy »

reactosfanboy wrote: Wed Sep 25, 2024 5:29 pm My personal opinion: If there was a PR that would just replace the shredder-icon with the one you suggested here, I would most likely approve that already (even with the current black color, but personally I think coloring that in red would be best, same as XP did). Our old shredder-icon is horrible, everything is better than that.
I have submitted a pull request with the delete icon, in red. https://github.com/reactos/reactos/pull/7435
This would be a neat proof of concept to see if we should move forward overall. I agree with leppy232, for example.

We'll likely need to make some modifications to how the bmp that contains the icons is structured as it currently uses a black backdrop, although, that can be tackled later.


leppy232 wrote: Wed Oct 09, 2024 3:37 am Personally, I like these proposed icons, they might be simplistic but they seemingly work in every environment. I'd wonder what it would look like with a darker color scheme, I imagine just value reversed.
As for the example of "create new folder", I think the color neutral symbol for that is a folder with an asterisk or star at the top right corner.
I appreciate the support here. I completely agree that they are far more UI agnostic. There could certainly be different ways we could have the "new" indicator on icons. ysUI employs a "+" in a circle, but it's open source so that can be changed specifically for ReactOS if it came down to it.
hbelusca
Developer
Posts: 1206
Joined: Sat Dec 26, 2009 10:36 pm
Location: Albi, France
Contact:

Re: The state of Tango! Icons in UI elements

Post by hbelusca »

The proposed new icons look ugly because they are monochrome. Which is completely at odds with the e.g. classic theme. Either use a complete iconset, or just keep the existing complete one.
And make that iconset choosable by the user, instead of having it to impose on everybody else already using ReactOS since ages, without a possibility to switch it back over.
User avatar
KevDoy
Posts: 8
Joined: Fri Jun 29, 2018 12:57 am
Contact:

Re: The state of Tango! Icons in UI elements

Post by KevDoy »

hbelusca wrote: Wed Oct 09, 2024 12:02 pm The proposed new icons look ugly because they are monochrome. Which is completely at odds with the e.g. classic theme. Either use a complete iconset, or just keep the existing complete one.
And make that iconset choosable by the user, instead of having it to impose on everybody else already using ReactOS since ages, without a possibility to switch it back over.
Respectfully, I disagree with you here. I don’t think icons are ugly based on if they have color or not. Besides, if monochrome icons were ugly, most UX designers would be doing a disservice to their users ;)

That being said, consistency is key and I agree it should be a complete icon set for UI elements. Folders, applications, etc should have be a separate icon set.

I like the idea of being able to choose an icon set for UI element or tweak if they are colorful or monochrome.
User avatar
dizt3mp3r
Posts: 1898
Joined: Mon Jun 14, 2010 5:54 pm

Re: The state of Tango! Icons in UI elements

Post by dizt3mp3r »

Not for classic use though.
Skillset: VMS,DOS,Windows Sysadmin from 1985, fault-tolerance, VaxCluster, Alpha,Sparc. DCL,QB,VBDOS- VB6,.NET, PHP,NODE.JS, Graphic Design, Project Manager, CMS, Quad Electronics. classic cars & m'bikes. Artist in water & oils. Historian.
Post Reply

Who is online

Users browsing this forum: No registered users and 2 guests