Monoicons

Theme with whites …

Hi @vklidu! Any chance you share svg with icons? Wanna try to build 2.79 with it :sweat_smile:

No problem to share. Just a few things better to note (if you missed them):

  • there isn’t done all set of icons
    (compare sheets https://testmachr.wixsite.com/monoicon/resume)
  • original jendrzych’s file is remake done in Illustrator, exported to SVG
    (seems to me, SVG losts a way to change a primar color by one click as I can do in Illustrator now, means -difficult to recolorised icons if you don’t use Illustrator)

I’m not satisfied with some of the icons, but I’m not going to work on all of them for now.

Probably good to say - I’m not competiting with jendrzych’s work for the new 2.8 icons.
I did them to prove the concept, mostly :slight_smile:

Edit: SVG file deleted - Outdated

Thanks for sharing! Yep, it missing all the modifiers icons… Anyway give it a chance!

Yes - just a test of concept :slight_smile:
At the moment you can try also new jendrzych’s icons.
He just released first version of SVG icons for 2.8 on the same grid as 2.79 (to test), for now also without modifiers.

I’m not sure if I need icons on a huge lists like modifier list is.
I don’t remember if I scanned the list by icons ever or if I use just a text to find modifier.

With modifier list system (icons everywhere) they should be on many other places. At the end, they do it hard to read (maybe). Probably better could be use icons on ui elements where text is not wanted or to use for visual attraction of some parts on a list, but seems to me contraproductive to use icons on extended lists.

Already posted simple examle
https://blenderartists.org/uploads/default/original/4X/5/6/2/56275b0b7e8c2ed0e7e2e7713d577f19d9a8e261.png

Tried rebuild icons, compile blender but the only result is white blank squares instead of icons :pensive:

That’s what I call “Uber minimalism”. One white square fits all!

2 Likes

Sorry, never happened to me. Shared file use dark grey rectangle as background, that should be disabled or deleted before generating icons.

Your result is white, so If you didn’t change bg rectangle color to a white I don’t have a clue, what could cause the result like that.

Try to open and save SVG via app Inkscape.
(Maybe some OS disharmony :slight_smile: )

It’s nice work, but I think I like the colorful ones better. They’re easier to distinguish quickly - by their color.

2 Likes

I got the same feeling, but now I’m levitating in this pool :slight_smile:
You know, personal project. I want to satisfy just my self :slight_smile:

But probably you can help me understand to it.
What colours (or icons) exactly you can describe as something that helps you distinguish icons on a screen?

One aspect that helped me to see them on screen is to give them different colour from text.
Second thing that I’m able to describe is “orange” for objects icons and red-white for icons related to material or texture, violet-pink to images.

And thats all. Other icons don’t use so dominant color that I can describe (maybe folder - light brown) or they are not so close to others so I don’t think its harder to recognise them.
Blue color for modifiers is irrelevant - Modifiers are listed on separate list, and they are not mixed with others. So I can’t say colour matters in this case.

Yeah and of course blue for world icon for sure.

I’m somehow biased, but wouldn’t overestimate the part of colour in icon design. People get confused in first contact, because GUI with monochrome icons look so different from what they’re used to. I’ll emphasize with all my strength, that lack of colour isn’t a problem - real trouble starts when icons shapes and their accents are similar to each other too much. This very topic was belabored many times and all I can advise is: use to get used to.

1 Like

Take the properties panel’s tabs for example. My eyes first see that the Object icon is yellowish, and the Modifiers icon is elongated and bluish, before i see their shape. The texture icon is squarish and reddish, the material tab round and reddish, and the environment tabs is round and bluish. I see that before I consciously see what the icons are, mostly because I’ve looked at these for many years. I’d probably get used to your set over time, but I wouldn’t want to have to.

Properties header is very specific for this. Yes. Is there any other place that you can mark?

Have you seen my post from May 2?
Does it can be something you can say it could solve the problem in similar way? It’s very dirt sketch …

https://blenderartists.org/uploads/default/original/4X/e/f/9/ef96e1ccadbccba95ddac4eaec7bdb613136360e.png

With all politeness to the master, I can’t agree. From what you are saying, we can use traffic lights with the same color and make difference only by shape.

Try to replace red, orange, green with white square, triangle and circle. Do you want to say - you are able distinguish shapes as fast as colors from far?

I really like your work and from what I did, you can see I love monoicons, but it doesn’t seem to be fair now. Sorry.

From what you are saying, we can use traffic lights with the same color and make difference only by shape.

That’s exactly what I’m trying to say. Ingenuity of traffic lights design lies in the fact, that You can use them with full colourblindness. Red light is always on top, green at the bottom and yellow in the middle. Red and green never lights at the same time. Yellow always lights with only one of remaining lamps at a time, and is turned off immediately with the one it was accompanying; then the one that was dimmed turns on, so one can judge at a glance which light will be next (red or green / upper or lower). Blinking single yellow lamp (the middle one) means, that traffic lights are inactive and one should be careful and focus on traffic signs or use general traffic rules.
Our eyes can see colours only in tiny part of their view fleld, the rest of the field is monochrome. Impression of colourful environment comes from eyeballs movements and brain rendering. Try to look at traffic lights the way all lamps are in Your periferial part of field view. Keep Your eyes still and wait for light change. Will You really see the colour of lamp turning on, or You’ll just know what it should be? Brain cheats You all the time.
Red / yellow colours of traffic lights really helps to see lights from distance and to make decisions at reflex level, but that doesn’t apply to icons, to be honest.

What I definitely didn’t say is: colours are unnecessary. It’s just another layer of information, that can help in some parts of GUI and is superfluous in others. Lists of different items, such as Outliner or File Browser, are different worlds from bunches of few local icons. Colours can help there a lot, but I still believe that good design can work without much use of colours.

1 Like

1st paragraph
Nice inside view to functionality of traffic lights, but its not an answer to my question - can you distinguish icons faster with different colors or with a same color. What you answered is we can recognize shapes.

2nd
SInce I observe monitor from front view, periferial observation doesn’t seems to me relevant.
BTW Today I tried to watch forward and I saw clear orange on lights (periferial) when lights up, but as you said - my brain is cheating with me, so thats what I think I saw :slight_smile:

3rd
That’s the whole point. I can agree - colour is a layer that helps. And thats what I was talking about. Colour helps you much quicker scan a screen.


Just to refresh air in a room :slight_smile: and finish this match …
I played a bit with colors on monochrome icons and there is a few things to note:

  • there is not so many colours that can be used and keep clear ability to read icons them self even on very dark theme
  • using single color per icon even limited in groups (by type), generates Christmas tree
  • using any other than dark theme makes some icons totaly invisible
    (you would have to change all of them by HUE or something, but than it change meaning of originally used color)
  • last one for today - 2.5 colorfull icons are not such colorfull, as I could really say, I recognize them by color specially in properties header. That “greying” all inactive icons make them much more unclear than greied monochrome version.

But I’m not saying - 2.5 icons doesn’t benefit from colors they use.
(Would be nice to see them without “greying”.)

1 Like

This is a quick experiment colouring your fantastic icons, based on a simple colourcode system:

addmenu

The system is:
XYZ - RGB ff0000, 00ff00, 0000ff
Modelling - light blue 8ebaff
Animation - light green 99cc00
Materials/lighting - orange ffaf00
Video/post processing - purple 7c3bff
Settings/addons/code - grey eeeeee
Loading/Saving - cream feea96

I’ve based these colours on the ones found here

3 Likes

viewmenu

Same system applied to the view menu…

3 Likes

Because thats what I called “Christmas tree” :slight_smile:

There will be an option (in theme) to set colours to icons individually - probably, but you quickly realise difficulty - what color should I use for this icon, does it should be in this group or this group? Or should I start use another one to keep some consistency?

And as you can see you used brighter colours for second example, isn’t that because some colours from first example wasn’t already visible on second bg? :slight_smile: