Please...improve masks. Say goodbye to unintuitive and horrible clipping masks. Use grouping masks.

What features would you like to see in Pixelmator Pro?
User avatar

2021-03-21 17:01:15

So I'd like too start this off by quoting an old post from 2018 from the Pixelmator Blog.
Making powerful but complex pro image editing tools easy to use and accessible to everyone. Even your grandparents.
It's clear that Pixelmator Pro was made to be the intuitive, beautiful, and easy to use photo editor. Unfortunately, some features are not that way.

One of my biggest pet peeves as a user of Affinity Software, as I'm sure many of us own Affinity Software, is how Pixelmator handles groups and masks. Quite simply, it's terrible and unintuitive. Reminds me of Photoshop.

https://youtu.be/aWwgeModipI

I watched this official guide video and it highlighted the limitations and stupidity of the current layer and mask system.

Let me ask a few questions to give an example of what I am talking about.


- Why do you have to disable auto selection to move a mask? Why does it have to be reenabled? How is that intuitive to a user? Even if the user selects the mask layer in the layers, it will not work for them by default behavior. Frustrating.

- Why do images not have a trimmed selection area after they've been masked? Why is the image that is no longer visible subject to smart snapping?

- Why do the masks not automatically get grouped so its easy to drag what appears to be a shape with an image fill to a user? Instead it's kept separate by default.

Pixelmator Pro (and Photoshop) Layer and Mask System: https://file.zenith.lol/tcj3lt

Unintuitive, sloppy, and old fashioned.

Now, let me show you a few solution courtesy of some fellow Mac apps, that I would love if you implemented!

Affinity Photo Layer and Mask System: https://file.zenith.lol/1LrXyi

Fast, easy, intuitive. Click once to move the entire mask group. Click twice to move the item inside the group. Easy.

Logoist Layer and Mask System: https://file.zenith.lol/zANf8c

One of my favorites...this highlights fantastic nondestructive masking in an easy to understand way.

So I hope this feedback can be taken seriously. If Pixelmator wants to claim to be the most intuitive photo editor it should at the very minimum handle masks in the same great way as Affinity software. And maybe additionally, like the nice little tool Logoist. The current system just seems wasteful and needlessly complicated for an otherwise very intuitive app.
User avatar

2021-03-22 10:02:57

Hi there, thanks for the feedback! You can bet that as we were making that tutorial, it became all too obvious to us that this particular workflow is far too complicated. But we decided to go ahead with showcasing the technique and made a note that this needs to be improved. Before clipping masks were added, filling shapes with textures was an even more involved process and we had quite a few requests from PS users for it, so we decided to add the classic version of this feature. In hindsight, it could have been implemented better! Thanks a lot for sharing those examples, too, those are definitely some interesting implementations.

To answer your questions:
- Why do you have to disable auto selection to move a mask? Why does it have to be reenabled? How is that intuitive to a user? Even if the user selects the mask layer in the layers, it will not work for them by default behavior. Frustrating.
Because the mask is kept as a separate layer and is below the texture layer. To move a layer behind another layer on the canvas, automatic layer selection needs to be turned off, otherwise, the layer above is automatically selected. I think this is standard among pretty much all image editors if we're talking about individual layers in a composition. I should also add – this doesn't mean that our clipping mask system is great, I just wanted to explain the internal logic which is: even though they interact with each other, the layers are separate and otherwise behave like any other layer.
- Why do images not have a trimmed selection area after they've been masked? Why is the image that is no longer visible subject to smart snapping?
Again, mostly because both layers are separate – they aren't one object, and trimming the layer rectangle would mean it wouldn't be possible to resize the image layer. Automatic grouping would be a solution to this, of course, it's just that that without it, this workflow isn't really possible.
- Why do the masks not automatically get grouped so its easy to drag what appears to be a shape with an image fill to a user? Instead it's kept separate by default.
I can't think of an especially good reason for this one, other than it might be easier to clip and unclip multiple layers to one mask. There might be other reasons and certain workflows that I'm missing but, overall, grouping or otherwise linking the two objects does seem to be a fairly elegant solution.

To reiterate, the answers to your questions aren't intended to be a resounding endorsement of the current system, it's just an explanation of the internal logic. We know this needs to be improved. :pray:
User avatar

2021-03-22 11:07:44

I appreciate the response and I’m glad the team is looking to improve it. Although I mentioned Affinity Photo for comparison, I believe Pixelmator Pro is a superior photo editor. There’s so much about this app that I love and I can’t wait to see how this is addressed. It will make it more fun and useful for illustration as well.

Thanks!
User avatar

2021-03-22 19:02:30

Zenith22,

apologies in advance for lengthy message, but I feel like I need to go into details to provide accurate response.

First of all -- I am not associated with Pixelmator team in any way, but may I humbly remind that developing complex software is incredidly challenging, and creating "complex pro image editing tools easy to use and accessible to everyone" is close to impossible (let's be honest :-). I'm in business software development for ~20 years (not as complex though), and after a couple of years, you get used to the way your software works so much it's almost impossible to look at it with fresh eyes.

What I'm trying to say is that using words like "terrible" and "stupidity" does not help transmit your message to the team.

And by the way, if you call Pixelmator's clipping mask "horrible", surely you have not tried masks in Figma! For me personally, this is way more non-obvious and weird way to mask layer. Take a look:

https://cdn.vlad.studio/6557452846548fa76c85557db8efd065.mp4

When I select any one of the 2 shapes, basically nothing happens. And when I select both shapes, Figma duplicates the bottom shape (?) and calls it "Mask group".

Anyway.

Second of all -- "Clipping mask" is not a single tool for all masking needs, but it's actually very useful sometimes! Pixelmator/Photoshop and Affinity concepts look very different, but the concept is mainly the same. I think it's the matter of personal preference - some people like it similar to "groups" (with children listed below the parent) and some like the mask on bottom, with children above.

I would boldly suggest that the real cause of the frustration you experienced is not with Clipping Mask. It's with Select and Arrange. And the tutorial video you mentioned -- https://youtu.be/aWwgeModipI -- demonstrates this clearly. Turn auto-select off, then on, agrh! But this is a topic for another detailed analysis.

P.S. the same tutorial but with keyboard shortcuts would be twice faster :-) U, drag, Cmd+[, Option+], Cmd+Option+G, ...
User avatar

2021-03-22 19:45:06

I could not resist and wrote a little script that

* creates clipping mask
* groups the two layer (the mask and the contents)
tell application "Pixelmator Pro"
	activate
	tell its front document
		set current_layer to current layer
		set layer_below to every layer whose index is ((index of current_layer) + 1)
		set newGroup to make new group layer at front of current_layer
		move layer_below to front of layers of newGroup
		move current_layer to front of layers of newGroup
		select (the first layer of newGroup)
		set clipping mask of current layer to true
		select (newGroup)
	end tell
end tell
Image
User avatar

2021-03-23 11:19:53

by Vladstudio Zenith22,

apologies in advance for lengthy message, but I feel like I need to go into details to provide accurate response.

First of all -- I am not associated with Pixelmator team in any way, but may I humbly remind that developing complex software is incredidly challenging, and creating "complex pro image editing tools easy to use and accessible to everyone" is close to impossible (let's be honest :-) . I'm in business software development for ~20 years (not as complex though), and after a couple of years, you get used to the way your software works so much it's almost impossible to look at it with fresh eyes.

What I'm trying to say is that using words like "terrible" and "stupidity" does not help transmit your message to the team.

And by the way, if you call Pixelmator's clipping mask "horrible", surely you have not tried masks in Figma! For me personally, this is way more non-obvious and weird way to mask layer. Take a look:

https://cdn.vlad.studio/6557452846548fa76c85557db8efd065.mp4

When I select any one of the 2 shapes, basically nothing happens. And when I select both shapes, Figma duplicates the bottom shape (?) and calls it "Mask group".

Anyway.

Second of all -- "Clipping mask" is not a single tool for all masking needs, but it's actually very useful sometimes! Pixelmator/Photoshop and Affinity concepts look very different, but the concept is mainly the same. I think it's the matter of personal preference - some people like it similar to "groups" (with children listed below the parent) and some like the mask on bottom, with children above.

I would boldly suggest that the real cause of the frustration you experienced is not with Clipping Mask. It's with Select and Arrange. And the tutorial video you mentioned -- https://youtu.be/aWwgeModipI -- demonstrates this clearly. Turn auto-select off, then on, agrh! But this is a topic for another detailed analysis.

P.S. the same tutorial but with keyboard shortcuts would be twice faster :-) U, drag, Cmd+[, Option+], Cmd+Option+G, ...
I agree, those words were misplaced. It seems I posted a little rant. However, that was more aimed at Photoshop than Pixelmator. I understand that a clipping mask is standard in Photoshop, and I always found it as clumsy as the rest of the program. I regret using those words but I decided to leave them in anyway because people have already read them. I’lll do better next time!
User avatar

2021-03-23 12:05:32

Ah, what a pleasant, civilized exchange!

I will admit that, from our perspective, strongly-worded ranty posts tend to be difficult to read objectively because the initial reaction is often defensive – I mean, we're only human and we really care about what we do. I noticed this post on Sunday evening (or thereabouts) and was definitely a little annoyed by it. :sweat_smile: But as I read it again on Monday and saw the effort put in to record video examples and provide detailed feedback, the ranty bits didn't quite affect me so much. So, to sum up, suggestions are definitely easier to process when the delivery is less scathing but the most important thing is the content and we try to look past the tone as much as we can.
by Vladstudio P.S. the same tutorial but with keyboard shortcuts would be twice faster :-) U, drag, Cmd+[, Option+], Cmd+Option+G, ...
That's true – we tend to avoid mentioning keyboard shortcuts too much because we feel they can mess with the rhythm of video tutorials, but they are super useful. Maybe we should try harder at incorporating them into future videos. Also, if we had a modifier key for temporarily disabling Auto Select (*cough* Command *cough*), that would make things a lot easier. This is also on our roadmap, but it's tricky to implement so we've been putting it off a little bit.
User avatar

2021-03-23 15:37:49

by Andrius 2021-03-23 16:05:32 Ah, what a pleasant, civilized exchange!

I will admit that, from our perspective, strongly-worded ranty posts tend to be difficult to read objectively because the initial reaction is often defensive – I mean, we're only human and we really care about what we do. I noticed this post on Sunday evening (or thereabouts) and was definitely a little annoyed by it. :sweat_smile: But as I read it again on Monday and saw the effort put in to record video examples and provide detailed feedback, the ranty bits didn't quite affect me so much. So, to sum up, suggestions are definitely easier to process when the delivery is less scathing but the most important thing is the content and we try to look past the tone as much as we can.
I completely understand. It may comfort you to know that every single one of your customers sees the care and dedication poured into this software every time it’s opened. And even if I’m a complainer, I’m still one of the thousands of customers that left a five star review. For this one thing I can complain about, there are more fantastic aspects of this software I can’t even begin to list off. So I guess I can take this opportunity to thank the Pixelmator Team for all their hard work and innovation in the photo editor space.

By the way, I called it the best image editor in the world in my review. 😉

Keep it up. And remember, it’s the little details overlooked in other software that Pixelmator can solve. And it’s those little details that make all the difference.
User avatar

2021-03-23 16:31:15

by Zenith22 2021-03-23 13:19:10 I completely understand. It may comfort you to know that every single one of your customers sees the care and dedication poured into this software every time it’s opened. And even if I’m a complainer, I’m still one of the thousands of customers that left a five star review. For this one thing I can complain about, there are more fantastic aspects of this software I can’t even begin to list off. So I guess I can take this opportunity to thank the Pixelmator Team for all their hard work and innovation in the photo editor space.

By the way, I called it the best image editor in the world in my review. 😉

Keep it up. And remember, it’s the little details overlooked in other software that Pixelmator can solve. And it’s those little details that make all the difference.
I think an emoji should sum up my (/our) feelings here best:

:red_heart: