New icons for Blender 2.8

idea

(jendrzych) #1

UPDATE - 23-12-2018
8%20-%20SMALL
8%20-%20BIG

  1. This one seems to be a bit controversial - the Floppy Disk for the Save command - BA19.
Previous releases logs

UPDATE - 21-12-2018
8%20-%20SMALL
8%20-%20BIG

  1. All particle related icons were flipped horizontally to make them different from 3D axis - L18, M10, X14, AA11.
  2. Brand
  3. Brand new design of the Light Probe Object icon (the centre-weighted metering pictogram) and its ObData icons (the Reflection Cubemap, the Reflection Plane and the Irradiance Volume) - U15, R15, R16, R17.
  4. Redesigned Point Light icon - S13.
  5. Tweaked Lattice ObData icon - T4, X8.
  6. Retouched Modifier view restriction icons - T20, T21.
  7. Redesigned Motion Tracking Editor icon (former Movie Clip Editor) and related ObData - Z20, V21 (@William).
  8. The Movie Clip Edtior and its ObData icons reused as the VSE Editor and the Video Sequence pictograms - Z8, W24.
  9. The Texture Node Editor’s icon was flipped horizontaly to make its silhouette more distinct and different from the new VSE Editor icon - Z23.
  10. The UV Editor gets an icon in a new location in the icon sheet - Z25 (@William).
  11. The UV Map icon gets new look - W22.
  12. The Modifiers tab in the Properties Editor gets its own individual pictogram - AA17 (@William).

UPDATE - 09-12-2018

  1. New Import / Export ions - C5, C6.
  2. Updated Hidden Dot File icon - C24.
  3. Updated common File icon - D19.
  4. New Movie File icon - D22.
  5. Updated Solid display mode icon - F3.
  6. New Driver icon - K26.
  7. New Time Shift modifier icon - L25.
  8. New Collection Instance icon - U13 (the old one is now in T12 cell).
  9. Updated Render restriction icon - U25.
  10. New icon for Movie Clip - V21.
  11. New Video Sequence icon - W24.
  12. Tweaked 3D View editor icon - Z1.
  13. Updated Properties editor icon - Z4.
  14. Updated Image Editor icon - Z6.
  15. New Info editor icon - Z7.
  16. Updated Video Sequencer icon - Z8.
  17. New Text editor - Z9.
  18. New Timeline editor icon - Z15.
  19. New Movie Clip editor icon - Z20.
  20. Updated Texture Node Editor icon - Z23.
  21. Updated No-F-User icon - AA25.
  22. Tewaked Recover icon - BA22.
  23. Many tiny tweaks and enhancements. Almost every icon was touched and slightly refined. Effects of most of those actions are barely visible, since they were focused on curves optimizing and reducing number of polygon nodes.
  24. Tweaked Folder icons 48x48 pix.

UPDATE - 20-11-2018
New icons for Add menu, designed for the Image submenu:

  1. Image as an Object - Q24
  2. Background Image - Q25
  3. Reference Image - Q26

UPDATE - 19-11-2018

  1. new Volume File icon - C22
  2. tweaked 2D Projected Proportional Editing icon - I23
  3. slightly retouched Particles modifier icon - M10
  4. slightly retouched Particles icons - X14, AA11
  5. slightly retouched Physics icon - AA12
  6. Empty ObData in Add Menu - several new and a couple of repurposed icons: Plain Axes R7 (repurposed), Arrows R9, Single Arrow S12, Circle S3 (repurposed), Cube S18, Sphere S19, Cone S20, Image D21 (repurposed)
  7. brand new Community icon - X18 (for scripts written and maintained by community)
  8. brand new Experimental icon - X26 (for scripts/features that are WIP, under tests or such stuff…)
  9. a separate *.svg file with thumbnail icons for the File Browser
  10. more curvy Hearts - V22 and V23

UPDATE - 28-10-2018

  1. 48x48 icons for the File Browser were added - just three of them, because the already readymade small icons can indicate type of a file, the way I depicted in this proposal: LINK. Actually just like it’s done right now.
  2. New Material Ball icon got slight tweak - B9.
  3. New icon for Cache File - C21.
  4. New icon for Lookdev - F5.
  5. Updated Show Whole Scene Transparent - F7.
  6. Tweaked H7 icon.
  7. Added icon for the Film Strip - W24.
  8. In relation to no 7, VSE got new pictogram - Z8.
  9. Altered World icon - X3 and AA5.
  10. Brand new Object and Object mode icons - X4 and Y1.
  11. New item for Render Output - AA7.
  12. Tweaked Shapekey icon - X21.
  13. Redesigned No F-User and F-User Attached icons - AA25 and AA26.
  14. Tumbstack icons in place of Pins - CA17 and CA18.
  15. Cleaner Duplicate icon - DA21.
  16. Retouched Tool Properties icon, just to make sure nobody mistakes the screwdriver with a shovel… - AA15.

UPDATE - 28-10-2018

  1. old icons indicators were added - yellow numbers, letters and symbols to hepl tracking old icons usage
  2. redesigned Warp modifier icon - L12 - credits go to @a.monti
  3. tweaked Camera Tracking icon - Y17
  4. redesigned GP Effects icon - AA16
  5. tweaked Subdivide modifier icon - M7
  6. tweaked Smooth modifier icon - M24
  7. redesigned W26 icon
  8. simplified Physics icon - AA12
  9. tweaked OFF states of Radio and Tick buttons - CA13, DA13
  10. EDIT - not valid for the time being: removed V17 and V18 icon - CA15 and CA16 should be used instead
  11. removed the Floppy Disk icon - AA19
  12. new icon for Window Manager - CA1
  13. new icon for “Create new set of predefined …” - V9
  14. new icon for Duplicate - DA21
  15. new icons for Driver variable type: Distance, Rotational Difference, Transform Channel - BA12, BA13, BA14.

UPDATE - 25-10-2018

  1. all two states icons flipped, so that OFF is always on the left and ON on the right;
  2. fixed all misaligned icons;
  3. Driver and Animated icons flipped vertically
  4. new Collection (X16) and Collection Instance (U13) icons
  5. new GP modifiers: Hue / Saturation (L19), Noise (L20), Displace (L21), Simplify (L22), Thickness (L23), Instance (L24), Time Offset (L25), Opacity (L26), Tint (M18) - the last one replaces unused old Constraint icon
  6. old, unused icons removed

ORIGINAL POST

Some of You may remember the topic I started about twelve years ago: icons for Blender 2.5.
Time is passing, life’s running, things are changing without the exception and Blender does it too. It looks like it’s time about to design new icon set, since there’re lot of calls for modern, flat, less obtrusive pictograms and even some effort has been made already by user Vklidu - “monoicon” project.

why:

  1. icons are secondary to the content and work best in local context.
  2. An icon is a shape in first place and doesn’t need to have colour.
  3. Current icon set containing pictograms that are illustrative and multicolor - often too detailed to be read clearly in small sizes and confusing with too many color cues. Some of icons pop out too much because of their colour, attracting user’s attension to particular (inapropriate) parts of interface.
  4. Iconography for Blender 2.5 was designed to be visible on any background - dark or light and thus some crucial space has to be dedicated to double outlines. It consumes a lot of precious space; old icons actually are not true 16x16 pix, but tad smaller - 1 pix, two pixels… That’s further space loss.
  5. Present icons are small masterpieces with individually matched colours, gradients, pixelsized details. It’s really hard to replicate the style when there’s need for a new icon - even for me…

goals:

  1. Unified look across whole GUI.
  2. Best possible use of given 16x16 pix space.
  3. Simple composition rules and guidelines that are easy to follow - new items should be effortless to create.
  4. Monochrome look potentially with colour codes in places where it’s needed, with assumption, that chosen colours are global across UI and are bound to most important operations or different functions, such as (random colours):
  • blue - modifier;
  • green - creation (new geometry, new item in the list etc.);
  • purple - modification of existing geometry;
  • red - delete / erase / remove…
    and so on. Colour must cover whole icon, and will be restricted to icons crowded spaces.

Vklidu’s work was so inspiring, that I decided to try my hand at this and - as a proof of concept - redesigned some of “old” colorful icons making them monochrome, more flat (in most cases) and even more symbolic by removing redundant elements, discracting details an colours.
So far I covered:

  • row 1 - some of Editors - I bet You can name them :slight_smile:
  • row 2 - Object / Edit mode
  • row 3 - vertex / edge / face snapping points
  • row 4 - mesh primitives, Empty object and Light object
  • row 5 - shading display modes: Single Colour, Texture, Material, Rendered
  • row 6 - Object and Object Data fot Mesh and Curve
  • row 7 - file icons (bitmap file on the left)
  • row 8 - Outliners restriction icons

proof%20of%20concept

Designing such small bits is tedious and time consuming work so I have no extra time for UI mockups. Will You help me, please?


Why mono colored icons for blender 2.8?
Monoicons
Blender 2.8 viewport updates
Why mono colored icons for blender 2.8?
(ManuelGrad) #2

Wow! I loved your work for 2.5!
These monoicons seem to be a really great update of an already awesome icon set.
Much appreciated!


(Hadriscus) #3

Honestly I wouldn’t change a thing to your icon set, it’s really great as it is.


(Joel_nl) #4

Removing the colors decreases the readability IMHO. it’s harder to tell the different shapes apart.


(jendrzych) #5

@Joel_nl
It’s true constatation only if You’re talking about all icons gatheret together, but in real use, they’re apposed in UI in small bunches that are contextual. Colour ain’t that much needed here. Honestly, some of current icons pop out too much because of their colour, attracting user’s attension to particular parts of interface.
I plan to incorporate some colour codes though, the way Vklidu suggested here: LINK - it could work best in File Browser, Asset Manager or Outliner. Every place, where one has to manage big lists of items.


(TheRedWaxPolice) #6

Not a fan of this kind of icons…
Following design trends is not a good thing… stuff gets dated real quick…
Those so called “modern/flat” designs are a curse in interface design imho…


(fiendish55) #7

Nope they look minimalist, professional and clean, They are blessing of the modern interface, this is why gimp 2.0 also jump in this bandwagon and many others will follow. Keep your ugly rainbow icons with 2.79, nobody forces you to switch 2.8 with beautiful flat icons :smiley:


(jendrzych) #8

@TheRedWaxPolice
Well, old icons design has a few afflictions:

  1. they were designed to be visible on any background - dark or light and thus some crucial space has to be dedicated to double outlines. It consumes a lot of precious space;
  2. old icons actually were not true 16x16 pix, but tad smaller - 1 pix, two pixels… That’s further space loss.
  3. colour agression, I alredy talked about above.
    With such small space avaliable and need for double outline, icons got less and less distinguishable.
    Those are problems that I will try to adress.

(jendrzych) #9

@fiendish55
Old icons ain’t rainbow and ugly! No way - they’re candy like. I still love them individually :smiley:


(TheRedWaxPolice) #10

You’ll never get it… I don’t like the old icons either… and it’s pointless to discuss about it… to each their own…
Have a nice day Sir.


(Leandro Cavalheiro) #11

Welcome back @jendrzych. You did a great job in the icons for 2.5.
As a reference, I suggest taking a look at Archicad new iconset. In my opinion, they’re very simple and have a great readability.

https://www.behance.net/gallery/54319379/Graphisoft-Archicad-icon-set-design


(bud) #12

good :grinning:


(vklidu) #13

What kind / style of icons does the right job from your opinion? Thanks for direction.

Your critism is fine for feedback, but your comments does not move us to make a progress in a way you would like to see the new blender icons.

If you have a tip or vision what works better share it with us.

Flat icons in general are not just a trendy in these days, but from all history of design you can clearly see the simplest design resist longest. See some logos evolutions :wink:

Simplification of shape is definitely benefit of this process.

My question about flat icons is unification, that makes icons similar to each other, that makes hard to say what is what. So some color could help, but make it harder to keep some general rulles for extending icon set in a future as well.


(jendrzych) #14

Shape simplification, combined with really tiny space avaliable per icon, seem to be a problem, but it’s exagerrated IMHO.
Another remedy is to avoid long lists with an icon assigned to every position in the list - the best of wrong examples is the File menu in Blender 2.7x (fig. 1). Those complex lists/menus can:

  1. use carefully designed colour codes or
  2. have only a few icons assigned to most important rows or
  3. be divided in sections - right the way Devs did it in Etitor type menu (fig. 2)

fig. 1 - the worst menu and icon use ever…

fig. 2 - good example of dividing menu in sections


(renderhjs) #15

@TheRedWaxPolice
Your comments are not very positive, perhaps as a balance try to give each post also a positive / constructive push which I am sure would be greatly appreciated here.

@jendrzych
Your icons remind me of this recent right click select proposal by user fabiocroldan . It has rather interesting aesthetics and reminds me a little bit of Sketchup or Adobe software or some newer Microsoft interfaces.

Although I don’t believe that this kind of look is popular with the mainstream blender crowd one big advantage I see are the customizability as icons are treated equal to text in terms skinning - which makes elements in the UI more consistent. E.g. if you want a very light theme with the current blender icons it does not always look nice - the current icons work best with certain theme colors.

I resource I professionally and personally use for TexTools for example is https://www.flaticon.com/ as a starting point sometimes for icons I have to design / or wireframes. Although not a lot of 3D related icons available you will find a lot of style like icons there for inspiration.

Good luck with you project, looking forward to see more progress.


(Dzmitry) #16

Sure icons should not be rainbow fiesta, but have some solid style and color standardization, however I have to agree with TheRedWaxPolice and Joel_nl that removing colors completely is bad design. Blender isn’t some mobile app with few buttons.


(so3Datel) #17

I never made an icon. I do not know how this works.
I like the flat icons. But I do not like discolored icons.
Because, IMHO, the color can be used to organize and separate the icons from each other.
Example (it is not necessary to use these colors, it’s just an example)
Green - to create
Yellow - for editing or adding
Red - for removal
etc.

For example. If there is only text, I need to literally read every letter to understand what this text means.
If there is text and colorless icons, I will navigate the icons by additionally reading the text, if necessary. But I still need to look at all the icons in order. That is, I need to “read” them all to find the right one. It’s a little faster than just text.
But, if I have colored icons. I can not read all the text, and do not view all the icons. I can immediately exclude all the icons that do not fit me in color. And just look at the icons of the color I need.


(jendrzych) #18

@renderhjs
Examples You provide are really great - creme de la creme! The bar is raised really high… :smiley:

Lot of fear I see in You. Afraid You must not!
Actually, coloured icons doesn’t make much sense in most parts of Blender’s UI. Here’s proof, that flatty mono-icons work well:

There’re some spaces that should get colour cotes, though - as I stated before. Outliner, for instance.


(TheRedWaxPolice) #19

@vklidu @renderhjs
Okay, this is the kind of icons I prefer (for a 3d app), colorful and descriptive:


(jendrzych) #20

It’s not the case. Resize them to 16x16pix and check if they’re still descriptive. Linked icons (C4D?) suit well spaces similar to Blender 2.8’s toolbar, and I’m not goin’ to design them. Not right now, at least…
Anyway - this topic ain’t a wishlist. I clearly stated what’s my goal and I’ll try to fulfil the plan. I’m goin’ to listen requests untill they fit my basic concept. It’s meant to be demanding practise and fun challenge in the same time.
So no - I won’t use peacock or puke colour palette :smiley: