Layer docker UI improvement ideas

  1. Smaller indentation for groupped layers

The current indentation for groupped layers is too much. Names of nesting layers are easily stripped away. By halving the indentation, we can allow one more level of nesting without changing the width of the docker itself. One more level is often all we need.

  1. Inline Opacity level and Blending mode display

If we can display the current Opacity level and Blending mode right above the layer name, we can access those information without actually activating each layer one-by-one. This will greatly improve the usability for users with tons of layers.

8 Likes

I like both ideas very much but especially the second one. Finally finding that 1% Overlay layer that hides somewhere in the layer tree :smiley:

Currently I name my layers like the blending mode they have or use the color tag feature but that often leads to further confusion when I change the mode at some point and forget to rename the layer.

3 Likes

Is this something for which you have working code? If so, I like these proposals.

1 Like

I remember when tweaking the layer stack we had some discussion about the indentation. These are some nice suggestions. Pinging @scottyp for feedback and discussion here, scott worked on the layer stack design I think.

I am a bit hesitant about putting the blending mode and opacity info above the name, because it will become a bit crowded, but I also think it will be useful. I think it can be achieved with some adjustments.

2 Likes

Good ideas. I would make the “100% Normal” textbox darker - somewhere between layer name and background, to differentiate the rows and still make layer name the main thing. And I would switch them - name on top, properties on bottom.
I’m a bit concerned, what will happen when you want your layers as small as possible (I use them this way, as I tend to have quite a lot of layers) - those two rows of text could make minimal height much bigger. Maybe a change from name to layer properties on hover then (at least for minimal thumbnail size)? And then anything other than Normal and 100% could even get a different eye-catching color to show, that this layer is not that “default”?

2 Likes

We already show layer thumbnail popup with more details on hover.

Yes, though this requires a static mouse - in case of a drawing tablet you need to lift your pen directly at a given layer, so it’s usually quicker to just pick the layer one by one. I thought here about some kind of instant change from title to properties to quickly find a layer with a given property.
But yes, you got a point. I was just brainstorming, how to avoid higher layers, due to additional row of text

1 Like

yes :slight_smile: I understand

I was about to suggest exactly the same after seeing the screenshot :grin:

1 Like

I like the first one, but not really the second one.

For the first one, I would suggest having an option: 0-100% of indentation. By default it could be 100% or 50%, I don’t know. I like the idea of indenting it a bit less, but that is a bit too little, so… something like a slider, like for thumbnails size?

For the second one - maybe just something that would show “this layer has not Normal blending mode”? (like Fx icon), I agree with others that now it looks more crowded. I quite dislike when other programs do that.

2 Likes

I remember the discussion about how how to indent the layers. I think the main reason we did it the current way was that it is very difficult to see the indentation level when the spacing was too tight. Whether something is 2 levels deep or 3 levels deep can be quite difficult once they are farther apart in the layer stack. I think that is also why we have the little indicators. To help keep things lined up if they are farther apart.

For the current blending mode and opacity, I would think it would make reading the layers quite a bit more difficult. I could see it be pretty difficult to read if there are a lot of layers with both layer name and blending mode in the same area. I personally wouldn’t want to see it. I do like @Lynx3d idea that if we would do it, the text would be like 50% opacity to help differentiate it – and also have the layer name on top.

3 Likes

It was not my idea, but I share the concerns about distracting from the layer name, aswell as the concerns about minimum size.

Not sure where @tiar would want to put the “Fx” icon, the horizontal space for layer name already is rather small, that’s why I’d like a little less indentation too, but I just notice the suggestion drops above drops the visual tree structure, that’s not really great, I’d even like it to be more clear, not so broken up, maybe even different line colors per level.

Oh and also, we already have color labels to make layers easier to find, but of course setting them is extra work.

1 Like

Hi guys, the original poster of this thread doesn’t speak English, so I helped him with the translation. He wanted me to thank everybody’s time and apology that he doesn’t have the code to implement the change, only his ideas. BTW he is also the most active moderator of the Chinese Krita community who handled 90% of the support in the local community.

I think his ideas came (again) from SAI and CSP, as those are the most popular digital painting apps in China. SAI’s layer name section has 3 rows, each for the name/opacity/blending mode. CSP is arranged in 2 rows, similar to his mock up. (fix he later said that he came up with those ideas because of actual difficulties he experienced at work, not just because of SAI/CSP) He also pointed out to me that Krita’s indentation is larger than any other app he used.

Personally I agree with Scott though. The current indentation and single line name is clean and easy to read. It’ll not be a positive change to me if these ideas are implemented. However, I do see the value of them to more professional artists who must deal with very complex layer composition. It’ll be nice if these can be adjustable…

5 Likes

One thing I strongly remember about the layers docker redesign a while back was a lot of people have strong feelings about it…and many times strong opposing feelings. We do have an area already for options that you can change the thumbnail size. I wonder how hard it would be to have a checkbox in the layers panel with “show blending mode on layer” that toggles it on/off.

We could probably make the identation amount have a slider where people could make it more condensed. Both of the values could be saved in kritarc. Having that flexibility is probably going to be the only solution that will give everyone what they want.

4 Likes

Fx icon is already implemented:

It’s @Eranthis_stellata and - does he work in Krita and help users with Krita? Wow! That’s impressive! Huge thanks! @tysontan please tell him that if you can :slight_smile:

We could think about making those options adjustable. I would probably disagree with making them by default that way but I can see especially in the first place why it might be needed/useful.

3 Likes

Oh I forgot about layer styles showing an extra Fx icon, so yet another column of icons for the blending mode…not exactly what I’d want, I’d even like the lock icon to go somewhere else for more space for layer name.

@scottyp, that lonely thumbnail size slider surely wouldn’t mind some new friends, an indentation slider and a checkbox for showing layer properties below name sounds perfectly reasonable to me :slight_smile:

1 Like

Thanks for helping the user for translation :slight_smile: Also welcome to the forum :heart:

2 Likes

@tiar Yeah he uses Krita and helps users with their difficulties. He makes sure most support questions get answered, something I don’t have the patience to do. He’ll pass the questions to me only when it was necessary, or sometimes when it required a bug report.

@raghukamath Hi and thank you!

I have a few thing to add the the discussion:

  1. A horizontal scrolling bar at the bottom of Layer docker. This will make sure all nested layers to be seen with full name even when the screen is small.

  2. Put all options below the thumbnail size slider.

  3. Layer name should be the blackest and strongest, so it’s easier to read. Don’t give anything else distracting colors. Just let them be somewhat grey.

1 Like

Thank you for reading and discussing in all these replies! I would like to stress that I came up with these ideas because I felt the inconvienience when I was using Krita, not because I wanted Krita to become SAI or CSP.

After your discussions, I remade the mockup of the second idea. What do you think?
2_v2

I too think it’d be nice if we have the options for toggling the Opacity, Blending Modes and Layer thumbnail size adjustment grouped together in one place. It’ll provide flexibility for the users to talor Krita to their preferences, although it’ll surely increase your workload implementing them.

Also note that in the mockup the thumbnail size of both screen shots are the same – the minimal size Krita allows. The font sizes are also the same, I was able to put 2 rows of text in there just like that.

I also like the idea to put the name on top, while the opacity and blending mode placed below it with lower contrast. This will makes sure the layer name stands out.

I don’t think giving non-default opacity blending mode colors to be a good idea. It’ll clash with the color labels we already have, it’ll also make the layer docker less readable. We might be able to get away with just one dedicated color indicator, although it’ll still direct our attention away from the layer name.

Giving Indentation a slider would be nice too, that’ll make sure everyone can talor it according to their preference.

I fully understand that the developers are busy. So please take your time!

Lastly, I used Google translate to read your comments, but I don’t trust it enough to handle my own post, so I asked Tyson to help with the translation. I don’t want to bother him all the time though, please accept my apology if I decided to use Google translate in later replies.

3 Likes