pencil2d / pencil

Pencil2D is an easy, intuitive tool to make 2D hand-drawn animations. Pencil2D is open source and cross-platform.
http://pencil2d.org
GNU General Public License v2.0
1.48k stars 272 forks source link

Increase visibility of active layer keyframes #1322

Closed Jose-Moreno closed 4 years ago

Jose-Moreno commented 4 years ago

Issue Summary

This is a UI / UX request after having problems myself with the rapid location of the frames I was working on.

After the color optimizations made in #1311 the active layer frames become a bit too dark to see, particularly on the bitmap layer (considering blue has a low lightness value in gresycale) and get lost even more when they are selected (color turns to dark grey).

My requests for the actively selected layer are:

Video or Image Reference

Before image

After image

This image has the same gradient overlay as Pencil2D, but it goes to show just how potent it is for a bright complementary color to appear as the keyframe selection color.

image

However i'm aware it might not be visually appealing to just make all layer types have different selection colors, rather it could create confusion, and it would make it difficult to harmonize the concept of having elements selected on the timeline in the first place.

Here I'm trying a lighter grey instead of the dark grey. image

Thoughts?

davidlamhauge commented 4 years ago

I use bitmap layers more than 99% of the time. In the project I'm animating on right now I have 8-10 bitmap layers in some scenes. Since the new, more saturated colors, were introduced, I have had no problems identifying the layer or frame I was working on. I simply love it! That said, I will of course not oppose to some slight changes, if we can agree on it, but I frankly don't like the idea of having a complementary color for the selected frame. That's too much - somehow.

stevphie commented 4 years ago

I couldn't agree more with the op. I'm one of those animators who have CVD (red-green) but this is just me, probably.

MrStevns commented 4 years ago

I think it's a valid request and while the scrubber will let you know which frame is technically selected and the shadow will let you know which layer, the current frame could still be highlighted to tell you user explicitly instead of assuming they know.

I however don't think the gray will work as it's too similar to the selected (not necessary current) frame and the complementary colors makes it too much for my taste and as you also state, makes it confusing.

What about simply changing the outline of the frame instead of trying to modify the fill. If we simply changed the border of the current frame like this, would that be enough? frame selected

scribblemaniac commented 4 years ago

Yeah I have to agree with @davidlamhauge and @CandyFace. I'm not opposed to making the selected frames more obvious, but those colors are just ugly.

I think that we're making the active bitmap layer background color a bit too dark. Maybe brightening it is all that needs to be done. I agree that the selected frames are difficult to see on an active bitmap layer, but I think on all other layers they are clear enough.

As far as people with color vision deficiency are concerned, I think the current solution should work well. Active layer and frame selections are all indicated with brightness not hue so it should be easy for anyone to distinguish. For certain people, it may not be possible to distinguish the layer type using the track color, however this is also indicated with the icon on the left and likely with the layer names too. Feel free to correct me if I'm wrong on this.

MrStevns commented 4 years ago

I think that we're making the active bitmap layer background color a bit too dark. Maybe brightening it is all that needs to be done. I agree that the selected frames are difficult to see on an active bitmap layer, but I think on all other layers they are clear enough.

I don't agree, the background is darkened to show that the layer is selected, it's an favor of the layer selected, not the frame. We've never painted the active frame differently than the rest, so changing the layer background color will not fix that.

Edit: okay wait... my bad, I misread the description. I thought we were talking about the active frame not all the frames of the selected layer. I would be fine with the frames themselves being shown in a lighter color, similar to the second picture.

Jose-Moreno commented 4 years ago

@CandyFace I actually like the outline proposal you had. The keyframe actually looks "selected" and its clear enough. Nice! 😄

As for the layer background...is it possible to make it a flat color? or is the gradient overlay effect so potent that effects the bg as well? I have not yet understood how the overall presentation is achieved.

As for what scribblemaniac mentions, we could try to brighten the selected keyframes alright, but I think the keyframes in general should be a bit brighter too.

As mentioned It's not as bad with the other layers because their relative lightness is higher as any color that has yellow is closer to white in greyscale, blue on the other hand is closer to black, which is why using the gradient darkens it a whole more.

As for the colors that I used being ugly...yeah well those were for demonstration purposes, the palette should not be picked in less than 10 minutes 😋

MrStevns commented 4 years ago

I think the gradient background should stay, to stay consistent with the layer stack gradient and for the overall presentation. What we could do however is to simply paint the frames without gradient.

Here's a demonstration when there's a lot of layers colors

Here we can now see that the current layer is still shaded, but it doesn't affect the frames. I think it becomes less easy to see the current layer selected (without looking at the stack) but with the current frame being highlighted in white, that could possibly be enough?

Here's another demonstration where the frames are slightly shaded again but not as much as before, which one do you prefer? colors2

Or does neither of those solve the problem properly, let me know.

Jose-Moreno commented 4 years ago

@CandyFace Ah. Yes if the keyframes can be drawn on top that works great. I like the last GIF a lot.

When making this request, I thought that the dark grey fill selection was to be replaced by a brighter color or even the bright outline, however looking at these new ideas in motion... I think that's no longer necessary.

Having keyframes drawn on top helped a lot to clarify what's important on the layers, and the keyframe outline works as a distinct accent. Even if it's a little obvious, people don't often seem to relate the red playback indicator with the keyframe they are working on. With this new proposal looks like the user will know instantly where they are working on the timeline at all times.

So considering the following:

  1. Canvas Modification: With a keyframe container created, the active frame of an active layer indicates that the user can draw. You can only affect one keyframe at a time.
  2. Timeline Modification: Selecting the keyframe, will make the layer and frame active. The user can manipulate the container across time (and hopefully layer space by moving the keyframe over other layers in a future update). You can affect multiple keyframes.

We can say that the bright outline indicates the active keyframe for canvas modifications and the color fill indicates the active keyframe(s) for timeline modifications and that way it feels more cohesive than before. 😄 👍