Arrange buttons do the opposite of what they are supposed to

[Mxchaeltrxn]

Problem

Pressing

causes the layer to move up.

Pressing

causes the layer to move down.

Fix

These should be switched around.

List layers in the layers panel in reverse order.

[haydn]

@Mxchaeltrxn This is a funny one! It's current behaviour is actually intentional… but that doesn't mean that it's correct.

When a user moves a layer forward it is correctly being moved in front of other layers on the canvas (it's component is rendered after the layers before it and therefore appears to be in front of it). What's perhaps "wrong" is that the layers are listed on the left in the same order which means the layer that's physically at the front is listed at the bottom.

Should we reverse the order the layers are listed in? I honestly don't know. Both Sketch and Figma render [turns out Figma does not] Sketch renders layer in that order "logical order" (it seems to be default in design tools these days), however the Adobe suite (Photoshop, Illustrator etc) all render the layers in their "physical order" instead. 🤷‍♀

[Mxchaeltrxn]

@haydn After reading what you wrote, it seems that both behaviours are reasonable. However, I was not clear in my description because I was not aware of the button's complete functionality.

The bit that confuses me is the iconography and how it relates to its action. I wasn't actually sure what this button did when I saw it so I tried clicking it. I thought it was odd that the button with the downward pointing arrow moved the selected layer up in the left hand Layers column and the button upward pointing arrow did the opposite. I wasn't actually aware that it changed the layering of the layers until you told me. I couldn't find this behaviour in Figma in the browser so I couldn't compare so it could just be me misinterpreting the icon.

Perhaps labeling the section Arrange layering rather than Arrange might help because I thought Arrange meant Arrange in left hand Layers column?

[haydn]

Here's where the functionality exists in Figma:

Turns out I was wrong about Figma's behaviour — it does display the list of layers on the left in their physical order:

That seems like the best setup, I reckon we copy that behaviour.

I agree that "Arrange" isn't very intuitive — maybe the section could be called "Order"?

I'll update the issues original description with the new plan.

[Mxchaeltrxn]

@haydn I like that. I can do this one!