Brush Thumbnails Design Feedback

[JulienKaspar]

@LudvikKoutny

You are making it sound as if it was choice between ugly/dated and useful/easy to read.

@LudvikKoutny

Why do we even need to see stroke color in the thumbnails?

I’m just saying it’s hard to argue against personal preferences. I’d rather focus on what’s needed from the thumbnails first and how they are used in Blender.
And because grease pencil draw mode brushes are often used with explicit use of specific materials, yes the colored strokes need to be supported (Just as much as uncolored strokes).
Again, this is coming from the grease pencil team. Artists who are using the tools for production.

---

I think right now the current discussions are beating a dead horse.
Gradients don’t help with readability. Brushes can have an explicit or ambiguous color. Transparent backgrounds also work if the asset shelf background is the right value.
I agree. After the Blender Conference I’ll have time again to work further on this.

@Hologram

This is why I would rather see a swatches/ colour presets panel.

If you want to have a discussion about replimplementing how grease pencil should use color swatches, I suggest to do that not here. New features are out of scope for the thumbnail design right now. This is just about making new thumbnails for the brushes and brush engines that exist right now.
Talk to grease pencil developers and artists and make a new thread if needed.

[LudvikKoutny]

@JulienKaspar

And because grease pencil draw mode brushes are often used with explicit use of specific materials, yes the colored strokes need to be supported (Just as much as uncolored strokes).
Again, this is coming from the grease pencil team. Artists who are using the tools for production.

But you said the thumbnails are not expected to be dynamic… ? The colored strokes need to be supported, but do they need to be supported in the thumbnails?
A. If you select any brush, there will be some other part of the UI where you will see what’s the active color/material of the brush you selected.
B. What if you change the color of the brush/material? Will the brush thumbnail update? If so, does that mean that changes to brushes will be editing/overwriting the saved brushes’ settings in realtime? If not, then if I select a brush of a certain color but then change the color, the thumbnail won’t match anymore…?

What I still can not understand is how hardcoded brush thumbnail icon background helps readability, if the brush color can be arbitrary. If the brush thumbnail color can vary, then the chance the user will choose the similar color as the hardcoded thumbnail background square, is about the same chance as the user choosing a color similar to asset shelf theme background color if the brushes had transparent alpha background without the hardcoded color square.

[JulienKaspar]

@LudvikKoutny

The colored strokes need to be supported, but do they need to be supported in the thumbnails?
A. If you select any brush, there will be some other part of the UI where you will see what’s the active color/material of the brush you selected.

It’s actually important to see the exact brush look in the thumbnail. In case it isn’t clear:
Grease Pencil draw brushes can have a specific material assigned to them. When a brush asset/datablock is linked into your file it will then also indirectly link that material as part of the brush.
So the material is an integral part of the brush itself.

It’s common to set up your brush library to use very specific materials, for their texture and stroke settings and even to use specific material/texture colors.
When in a 2D animation production it makes the materials easy to update and to keep consistent between files.

@LudvikKoutny

B. What if you change the color of the brush/material? Will the brush thumbnail update?

Once brush assets are implemented, any change to the brush settings is considered drafting. It’s a temporary override to the stored brush and will be wiped if Blender is closed.
So unless you save your altered brush settings there’s no need to update the thumbnail.

Changing the material of the brush and saving those changes is not ideal if the brush was meant to be used with a specific material. When completely altering the look of your brush the thumbnail needs to be manually updated anyway.

[LudvikKoutny]

Ok, so the brushes color in the thumbnail will be dynamic, but in that case:
If I make and save a brush with bright gray color material, the brush shape on these thumbnails will be unreadable:

If I make and save a brush with medium gray color material, the brush shape on these thumbnails will be unreadable:

If I make and save a brush with darker gray color material, the brush shape on these thumbnails will be unreadable:

All 3 solutions suffer from the same problem, but the third solution is only one which doesn’t suffer from outdated/unprofessional design problem.

So #1 and #2 are loss/loss scenario while #3 is at least win/loss scenario, because the GP brush content of the asset browser will always look better/more natural in the context of all the different blender themes users may be using.

[JulienKaspar]

The thumbnails will not be dynamic. Unless I misunderstand what you mean by dynamic.
They are unchanging images just like any other asset thumbnail.
So they need to be easy to create and reproduce by anyone. Simple viewport screenshots of a brush stroke are the goal.

I agree that there is no perfect background value to support all colors.
We could use a transparent background. But then all themes are forced to use a background value in the asset shelf/browser that works. Because the thumbnails will not be automatically inverted to keep them readable.

[LudvikKoutny]

By dynamic I meant that on the second example, there’s a pink one, purple one, green one and cyan one. So they won’t be all forced to be just black or white.

To me, transparent background is a lesser evil, but I mean there are many other places where Blender already has some means of automatic value inversion. 3D View toolbar icons for example. Not sure how complex would that be for asset browser though.

[brecht]

I guess the grease pencil brushes we bundle with Blender will not have a fixed color, and this would be mainly something for individual users or studios to create? Or at least as additional asset packs.

In that case it seems reasonable to me for such colored brushes to have a different background or style than the bundled brushes. It may be a good thing to set them apart, so it’s more clear when you pick a more generic brush, and a more specific one intended for a particular project or style. And we don’t necessarily even have to figure out the design for them.

@thorn-neverwake

I haven’t found one in Blender, so perhaps it’s meant to help artists not have to use the color picker (which is color-formula dependent) every time they wish to use an existing color.

If you click the color swatch for the grease pencil brush, it will show a color palette.
https://docs.blender.org/manual/en/latest/interface/controls/templates/color_palette.html

[Hologram]

Yes I agree with you, the way thumbnails are made could be one of two methods:

1. The brush stroke is saved, other pixels are transparent.
2. The brush stroke and background are saved.

You likely use a colour background for colour brushes and a transparent background for generic brushes. I can even imagine that generic brushes can be colour coded to be either black or white, this thus signals that they don’t have a material assignment, as you said.
For brushes with material assignments, creators would have to make a version for a dark theme and light theme respectively.

[LudvikKoutny]

But isn’t this a more general issue with all asset types? Not just unique to GP? I think that if we want to communicate separation between bundled and user-made assets, then some corner icon or something would be more appropriate.

A background of a random color which makes the whole thumbnail design look outdated doesn’t seem like a good way of telling the user those assets are bundled. It really doesn’t communicate that idea well.

Something that would work would be something like a small padlock icon in the corner of the bundled asset thumbnails.

[brecht]

I don’t think it’s about a distinction between bundled and user made assets. A user could make a generic brush without fixed color, and make a thumbnail in the same style as bundled generic brushes so it fits in.

For other types of brushes, the thumbnail system doesn’t dictate any particular style. Users could add an icon in the corner, add a colored strip, a colored dot, add a white outline or falloff around the stroke, use a different background color, etc.

If someone wants to make an asset library of 10 colored pencils, or common caligraphics pens, or painterly brushes specifically for painting grass, clouds, water and trees, I don’t think it’s really Blender’s job to come up with a standard style for them.

[JulienKaspar]

Brush authors won’t bother to add thumbnail variations.
Any automatic detection of brushes that don’t use color will fail for greyscale materials. It would only work if we implement an asset metadata checkmark that the thumbnail can be inverted to fit themes. But again I think this is overkill.

The simpler the design language the better. Then it’s very easy to follow suit for asset authors.
There’s also no need to make the essential assets stick out from the rest. Brush authors are free to diverge from the default thumbnail style. But it’s also nice when they all feel like a natural extension of the UI and themes.

EDIT: Yes I agree that the thumbnail design doesn’t need to cover all possible cases for use created brushes. But a solid standard that allows them to fit in is a good base to work from.

I think that’s all I can say about this current discussion. Once there’s time I can create some more mockups.

[nickberckley]

All brushes bundled will be black by default right? Like they’re now. I hope so at least, so thumbnails should be black as well. Otherwise they’re misleading. If the plan is to make Marker Bold pink and Pencil Soft yellow and etc. please no.

[Hologram]

There could be a checkmark whether to use a dark background or a light one and authors would have to make two sets. So this would be a user decision or is that also too involved?

[Frozen_Death_Knight]

Regarding the GP Draw changes you made, one thing a lot of other art programs do is have white thumbnails for dark mode UIs and black versions for bright mode UIs while having the UI be the background colour. I am in favour of your change as well as long as what I previously mentioned gets added alongside it

[thorn-neverwake]

See the post above:

Brush Thumbnails Design Feedback

The thumbnails will not be dynamic. Unless I misunderstand what you mean by dynamic. They are unchanging images just like any other asset thumbnail. So they need to be easy to create and reproduce by anyone. Simple viewport screenshots of a brush stroke are the goal. I agree that there is no perfect background value to support all colors. We could use a transparent background. But then all themes are forced to use a background value in the asset shelf/browser that works. Because the thumbnai…

[Frozen_Death_Knight]

@JulienKaspar One piece of feedback I have about the iconography is that I think the cloth icon could be a bit more readable. The shape to me doesn’t read that well as cloth from a distance. It has too many tiny shapes and the silhouette isn’t as clean as other icons like the hand and joint icons for other brush types.

Here are some quick ideas on how the shape language could be improved.

Here they are from a distance:

Inverted filled versions:

The basic idea is to have some contrasting shapes of curves and sharp edges to give the illusion of cloth being bent. Personally I prefer the one in the middle in the first row for how it has one round corner from the fabric being pulled from the centre, which is contrasting with the sharpness of the corners.

---

As for which design language I personally prefer out of all the ones being shown in this thread, I think that Julien’s original idea is the most solid. However, with some notes.

The way I see it, having the brushes be just grey with dark contrast like this one is how all 3D sculpting brushes should be done. It is simple and to the point. It also avoids the issue where 3rd party brushes are not following the colour guidelines when most people are already just using grey matcaps, so having simplified icons that explain which brush tool family it’s from is a way to circumvent that problem.

However, I think having icons in the corner that are coloured are a good idea. They don’t take a lot of space and the bright colour contrast works in most contexts:
Like these:

Move the icon to the top right corner however. Since most brush thumbnails are being stuck in the left bottom corner, the icon won’t be overlapping with the thumbnail underneath.

Having icons that indicate directions aren’t necessary however, because the brush thumbnail is good enough.
Avoid stuff like these icons:

Just have a select few icons for each colour. Joint and hand icons can share colour for instance. One exception being the cloth joint brush, which can have the same icon as the joint brush, but the colour will instead be shared with other cloth brushes.

Pose Brush (yellow joint icon):

Cloth Pose Brush (pink/purple icon like my cloth icon designs and I also change the positioning the thumbnail and icon to follow my design suggestions):

The only time I would break from this type of icon design would be for these brush tools:

When certain tools do very specific functions such as Simplify, Draw Face Sets, or Mask, I think it is fine to have only a thumbnail with some colour to indicate what they do. So no additional changes as I see it.

As for paint related tools such as these:

The tint to the paint helps differentiate the colour from the completely grey sculpting brush thumbnails, so good idea there. I would suggest going back to the green iconography for these brushes however. Make the tint slightly green since blue and grey look too similar still. Plus, the eraser icon is orange coloured, and orange and green fit a lot better as contrasting colours than orange and white icons.

Also, move the icons to the top right corner as previously mentioned.

As for which colour that regular sculpting brushes should have for their icons, like these:

I think blue should remain as the standard colour, especially since orange is already used by the erasers and smoothing/trimming brushes. No need to re-invent the wheel.

Good work so far!

[JulienKaspar]

Here’s finally an update to the thumbnail sheet. I tried to address all the feedback and issues as best as possible and included some additional updates.

Let me know what you think.

• New thumbnails for “Cloth” and “Elastic” brush
• Added an example of an “Anchored” brush
• New icon for elastic brushes (Based on squash and stretch behavior)
• Reverted color pallette and icon colors to keep color use simple
• Reverted icons to the upper right corner for better use of space (The conflict with the “Current File” icon in the asset shelf will be addressed too)
• GP thumbnails use a light grey icon background without gradients, that supports both colored icons and various stroke values
• GP Draw thumbnails use simpler black strokes again. Draw brushes should ideally depict a single stroke to not be confused with textured strokes
• Reworked icons to match the blender UI icons better.
• Kept subtle rounded corners that match the rounded corners of default theme (Would ideally be a preference slider as well)
• Adjusted icon colors for Curve Sculpt brushes
  • Yellow = Transform (Preserve length)
  • Green = Extend length / Add geometry
  • Red = Shorten length / Remove geometry

I kept the blue color for brushes that affect “Color”. This keeps them distinct from green, which rather means “Addition”.

Any add/subtract brushes in sculpt mode are not using any color to keep them simple to create and free of unnecessary visual elements.
This will be especially important for custom brushes, since the vast majority of custom brushes will be based on add/subtract brush behavior.

The light grey background is hopefully a good compromise for readability in values. For corner cases like grey stroke color the brush author should adjust that specific background of their own brushes.
No dynamic solution is planned, so strokes will generally be black.
A transparent background is not a good solution because it can cause issues between different themes with the varying background values and selection highlight colors.

With this the base set of brush thumbnails is complete. This means this could go into Blender any time once approved.
More brushes and thumbnails can be added with further development of brush assets and the essentials library.

Some aspects that I’d still like to improve:

• More appealing Fill & Face Set thumbnails
• Less deep dark shadows on Scrape brush
• Better balancing of contrast between filled and line icons
• Likely a better “Elastic” icon. Ideas are welcome
• More readable red in GP Eraser thumbnails

[JulienKaspar]

An example of how they would look like in the asset shelf (sorted by name atm. Should eventually instead be sorted by catalog)

[OcularEvolution]

These look so good! Good design and aesthetic choices

[Gabi_love]

First of all, great work on the design, it looks great!
Just wondering from design prospective, is it better to make all the brushes have the small icon on them and should it be on the same place for consistency wise.
Top right corner makes sense for me.
It just seems off that some brushes have the icon and some don’t, it breaks continuity in the design and make it seem like a different bundle all together.