Jump to content
You must now use your email address to sign in [click for more info] ×

AD: Filled strokes, 3D effects and clipping


Recommended Posts

I've created a closed curve with the pen tool. I've applied a 3D effect. All good so far. Now I want to clip a gradient to the shape. For some reason, the effect seems to be applied to the clipped gradient distorting its color:

image.png.a225bee884112411f383f1c097e81634.png

How can I keep the effects applied to the curve from affecting the gradient?

Thanks!

Windows 11 Pro, XP-Pen Deco 03, AP, AD & APub

Link to comment
Share on other sites

One possible way (instead of clipping) would be, to perform a geometrical (boolean) divide operation of the curve with 3D effect and a gradient rect area and afterwards combining them as a group. - This way the 3D effect won't directly affect the gradient, since you then combine/group two completely seperated objects together to build the wanted result.

 

geometrical_divide.thumb.png.01e8f157d9383882939142d0f4825927.png

☛ Affinity Designer 1.10.8 ◆ Affinity Photo 1.10.8 ◆ Affinity Publisher 1.10.8 ◆ OSX El Capitan
☛ Affinity V2.3 apps ◆ MacOS Sonoma 14.2 ◆ iPad OS 17.2

Link to comment
Share on other sites

2 hours ago, v_kyr said:

One possible way (instead of clipping) would be, to perform a geometrical (boolean) divide operation of the curve with 3D effect and a gradient rect area and afterwards combining them as a group. - This way the 3D effect won't directly affect the gradient, since you then combine/group two completely seperated objects together to build the wanted result.

 

geometrical_divide.thumb.png.01e8f157d9383882939142d0f4825927.png

Thank you - that works a treat!

One problem with this technique - although I can scale the group once I've created it with perfect results, I can't edit the gradient in place as I hoped to do. Of course I've got the full copy of the gradient within the group, and I've tested editing this gradient, deleting the 'shaped' gradient and re-dividing and this works. Is there another way to accomplish this with a directly editable gradient?

Although I've owned the Affinity Trio for some time, I've mostly worked with AP and done very little in AD. I've got to say that although I'm not a designer, I love this program! Thank you, Affinity (or Serif I suppose), for giving common folks like me the ability to OWN high quality tools at a very affordable price.

Windows 11 Pro, XP-Pen Deco 03, AP, AD & APub

Link to comment
Share on other sites

2 hours ago, Old Bruce said:

My take on this

1055064529_ScreenShot2022-05-16at1_31_12PM.png.8197f1b8501ca3ecd4be12e2617a63f5.png

Untitled.afdesign

 

Thanks. This reverses the effect I was trying to avoid - the gradient is editable and looks fine, but it affects the FX on the shape.

image.png.5c100cac1bd9b65a89b54e4544115ddd.pngimage.png.24616581a919e2f092548c1e3b23b8f8.png

The gradient affects only the FX applied to the inside edge/portion of the shape - the FX on the outside portion/edge don't appear to be affected.

I'm not sure why this happens - a bug perhaps?

 

Windows 11 Pro, XP-Pen Deco 03, AP, AD & APub

Link to comment
Share on other sites

What Bruce suggested worked. The shape turns out as a plateau, and the 3D effect does not affect the color of the gradient. Wasn't that your goal? 

Link to comment
Share on other sites

4 hours ago, telemax said:

What Bruce suggested worked. The shape turns out as a plateau, and the 3D effect does not affect the color of the gradient. Wasn't that your goal? 

As I mentioned earlier, Bruce's method reverses the problem; the shape doesn't affect the gradient, but now the gradient affects the shape!

You can see this effect in the images I posted above - compare the FX on the shape with and without the gradient enabled.

I don't think this should happen - the shape should ignore its contents rather than being affected by them. 

Windows 11 Pro, XP-Pen Deco 03, AP, AD & APub

Link to comment
Share on other sites

Take 3 or 4 lol! This format allows editing the fx and gradient independently without either affecting the other, you can also edit the shape in tandem by selecting both layers and using the node tool to select a node or nodes and pull to any shape. Basically the shape is duplicated, the stroke removed and both layers grouped for ease of movement and a neater layer stack.

This is really just a different method to achieve a similar V-kyr end result, the gradient isn't controlled by the shape and can be scaled easily because of the rectangle.

image.png.7fc98cc5bd263648c27c65420af1376f.png

Gradient pond.afdesign

iMac 27" 2019 Somona 14.3.1, iMac 27" Affinity Designer, Photo & Publisher V1 & V2, Adobe, Inkscape, Vectorstyler, Blender, C4D, Sketchup + more... XP-Pen Artist-22E, - iPad Pro 12.9  
B| (Please refrain from licking the screen while using this forum)

Affinity Help - Affinity Desktop Tutorials - Feedback - FAQ - most asked questions

Link to comment
Share on other sites

13 hours ago, firstdefence said:

Take 3 or 4 lol! This format allows editing the fx and gradient independently without either affecting the other, you can also edit the shape in tandem by selecting both layers and using the node tool to select a node or nodes and pull to any shape. Basically the shape is duplicated, the stroke removed and both layers grouped for ease of movement and a neater layer stack.

This is really just a different method to achieve a similar V-kyr end result, the gradient isn't controlled by the shape and can be scaled easily because of the rectangle.

Gradient pond.afdesign

Thank you! My last remaining question is in regards to selecting nodes for both curves at the same time, which I haven't figured out. 

If I select both curves at once in the layers panel, then move a node, only the curve I selected last moves with the node. 

LATER: I found a method that works. After selecting both curves, I have to drag a selection box around the node of interest. Once I've done that, all works as described. Is this the best way to do this? Is there a setting that would allow underlying nodes on all selected layers to move together without using a selection box?

I think this is a bug. When I clip something inside something else, neither the clipped layer nor the layer to which it is clipped should affect the appearance of the other. I just checked the latest beta; the problem persists.

Windows 11 Pro, XP-Pen Deco 03, AP, AD & APub

Link to comment
Share on other sites

click and drag over the node, like if you were making a selection, it will select the one on top and underneath, then click hold to move the nodes.

iMac 27" 2019 Somona 14.3.1, iMac 27" Affinity Designer, Photo & Publisher V1 & V2, Adobe, Inkscape, Vectorstyler, Blender, C4D, Sketchup + more... XP-Pen Artist-22E, - iPad Pro 12.9  
B| (Please refrain from licking the screen while using this forum)

Affinity Help - Affinity Desktop Tutorials - Feedback - FAQ - most asked questions

Link to comment
Share on other sites

17 minutes ago, firstdefence said:

click and drag over the node, like if you were making a selection, it will select the one on top and underneath, then click hold to move the nodes.

Yes, that's the 'selection box' method I mentioned in my previous message. 

Perhaps I'm just clumsy (ok, I'm definitely clumsy) but after I select the layers via the layer panel (so I can select notes on multiple layers at once) and make an adjustment, I often do something that deselects the layers.

Reselecting the layers before selecting another node is an extra step I'd like to avoid. If this is the only way to do this now, that's fine because it's not the real issue (which is the interaction between shape effects and clipped content).

Since I find the same problem in the beta version, I've opened a thread in the beta forum.

Windows 11 Pro, XP-Pen Deco 03, AP, AD & APub

Link to comment
Share on other sites

2 hours ago, casterle said:

Yes, that's the 'selection box' method I mentioned in my previous message. 

Perhaps I'm just clumsy (ok, I'm definitely clumsy) but after I select the layers via the layer panel (so I can select notes on multiple layers at once) and make an adjustment, I often do something that deselects the layers.

Reselecting the layers before selecting another node is an extra step I'd like to avoid. If this is the only way to do this now, that's fine because it's not the real issue (which is the interaction between shape effects and clipped content).

Since I find the same problem in the beta version, I've opened a thread in the beta forum.

The selection box method is fine.... if you just want to move nodes, but what if you want to change the curve itself?? We can't move the handles of two selected nodes.

Another "solution":
Use a symbol. Un-sync and give one just the gradient fill. Re-sync. 
Now you just have to select a single node and can change whatever you want.

symbol.gif.38aa625bdc7f3abca908373b3e482675.gif

Link to comment
Share on other sites

29 minutes ago, JimmyJack said:

Un-sync and give one just the gradient fill. Re-sync. 

By the way, that reminds me of the new linking feature in AP. But this tool is not really intuitive.

Link to comment
Share on other sites

On 5/17/2022 at 4:30 PM, JimmyJack said:

The selection box method is fine.... if you just want to move nodes, but what if you want to change the curve itself?? We can't move the handles of two selected nodes.

Another "solution":
Use a symbol. Un-sync and give one just the gradient fill. Re-sync. 
Now you just have to select a single node and can change whatever you want.

symbol.gif.38aa625bdc7f3abca908373b3e482675.gif

Thank you - excellent suggestion! Seems creating a symbol is an expensive way to accomplish this (in terms of resources), but it does exactly what I was looking for.

Windows 11 Pro, XP-Pen Deco 03, AP, AD & APub

Link to comment
Share on other sites

On 5/17/2022 at 2:05 PM, firstdefence said:

Copied from the beta thread:

This is not a bug, it's the digital environment simulating real world physics.

  • Real world: If you place water in a bucket and shine a light on the edge of that bucket, wouldn't the light also affect the water?
  • Digital expectation: Make a digital bucket and fill it with digital water, shine a filter light on the bucket edge, stop the light hitting the water and behaving like real world physics.

When you posted this, it seemed a good explanation. Now that I've played a bit I believe something is broken in the implementation regardless of the developer's intent.

If you open the attached project, on the Layers Panel you'll see a curve. Open the FX dialog and toggle the 3D effect off - the solid yellow fill is actually a gradient! Toggle it back on again and the gradient is replaced with a yellow fill.

If you zoom in on the transition between shape and fill, you'll see a brownish outline around the edge of the fill. I believe this is the entire gradient collapsed into this small area, with the rest being filled solidly with the gradient's starting color. If this is a 'real world' effect, it's from no world of which I am aware 😊

Now, it could be that I've just done something wrong - I'm not very experienced in AD and there are a LOT of settings - and I hope that's it. If not, Houston, we've got a problem! 

Filled Shape Issue.afdesign

Windows 11 Pro, XP-Pen Deco 03, AP, AD & APub

Link to comment
Share on other sites

52 minutes ago, casterle said:

When you posted this, it seemed a good explanation. Now that I've played a bit I believe something is broken in the implementation regardless of the developer's intent.

If you open the attached project, on the Layers Panel you'll see a curve. Open the FX dialog and toggle the 3D effect off - the solid yellow fill is actually a gradient! Toggle it back on again and the gradient is replaced with a yellow fill.

If you zoom in on the transition between shape and fill, you'll see a brownish outline around the edge of the fill. I believe this is the entire gradient collapsed into this small area, with the rest being filled solidly with the gradient's starting color. If this is a 'real world' effect, it's from no world of which I am aware 😊

Now, it could be that I've just done something wrong - I'm not very experienced in AD and there are a LOT of settings - and I hope that's it. If not, Houston, we've got a problem! 

Filled Shape Issue.afdesign 33.18 kB · 1 download

Has to do with the light source.
The more the light is coming straight down the more the gradient gets washed out. Is that correct?..... ¯\_(ツ)_/¯
Take one (or a combination of) the Diffuse, Spec, or Ambient settings down and I think the gradient will show like you've made it.
(Diffuse is awfully high)

You can also change, slightly, the direction of the light (everything else was left alone). Like this:

2026326792_ScreenShot2022-05-19at3_10_23PM.png.a9960b4664726e63ec8237db5a41f8a5.png

Link to comment
Share on other sites

On 5/19/2022 at 1:04 PM, JimmyJack said:

Has to do with the light source.
The more the light is coming straight down the more the gradient gets washed out. Is that correct?..... ¯\_(ツ)_/¯
Take one (or a combination of) the Diffuse, Spec, or Ambient settings down and I think the gradient will show like you've made it.
(Diffuse is awfully high)

You can also change, slightly, the direction of the light (everything else was left alone). Like this:

 

As far as I can tell, Diffuse is set to the default at 100%, or at least that's what I see when I first apply a 3D effect to a shape on in a new document.

If I play with the Elevation/Azimuth, the closer I get to directly overhead the brighter the yellows in the gradient become until yellow is all that remains. In the real world, the oranges would not disappear.

And while I can play around with the parameters to get the gradient to work as you've demonstrated above, I can't accomplish this while retaining the appearance I want on the shape.

The method you suggested above - creating a symbol - works perfectly. But IMHO this is a work-around to the issues I've presented in this thread.

Does the Affinity team monitor this thread?

Windows 11 Pro, XP-Pen Deco 03, AP, AD & APub

Link to comment
Share on other sites

55 minutes ago, casterle said:

As far as I can tell, Diffuse is set to the default at 100%, or at least that's what I see when I first apply a 3D effect to a shape on in a new document.

If I play with the Elevation/Azimuth, the closer I get to directly overhead the brighter the yellows in the gradient become until yellow is all that remains. In the real world, the oranges would not disappear.

And while I can play around with the parameters to get the gradient to work as you've demonstrated above, I can't accomplish this while retaining the appearance I want on the shape.

The method you suggested above - creating a symbol - works perfectly. But IMHO this is a work-around to the issues I've presented in this thread.

Does the Affinity team monitor this thread?

Well you(we) are adding an FX to the whole object. Any changes will effect both fill and stroke.

Affinity may read this, but your better options are to post something in:
either
The Report a Bug section if you thing something wrong is happening.
or
The Feature Request section, to suggest, for example, an effect fill only tick box within the FX panel..... or whatever you think it should be.

Probably the best course of action would be the bug route first. If the answer comes back that this action is "by design" and not something that needs fixing, then head to the feature requests.

Link to comment
Share on other sites

7 hours ago, JimmyJack said:

Probably the best course of action would be the bug route first. If the answer comes back that this action is "by design" and not something that needs fixing, then head to the feature requests.

Done.

Windows 11 Pro, XP-Pen Deco 03, AP, AD & APub

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.