Question about live mirror designing and borders

[nbiefeld]

Hello,

Please forgive me as I am new to Affinity Photo and Affinity Designer.  I have used Photoshop for over 10 years and Illustrator for 5 years.

I am using Affinity Designer to create video game assets.  Whatever I draw on one side of the character, I want on the other side.  I am using live mirroring using the Symbols feature to achieve this.  However, I want my entire design to have a border around it.  If I mark one side to have a black border, the mirror will have a border as well.  However, there is a vertical line going all the way down the center of the object. 

Also, if I attempt to fix this by applying a basic square above the two layers using the same background color as the character body to correct this center border issue, for some reason I am able to see the vertical line when I export.  It just looks like a darker shade of the background color.  I have checked and I do not have any kind of transparency.  So I am not entire sure why it is not correctly masking this issue.

Does anybody have any ideas or recommendations on how to apply a mirror image and a border around the entire object?

Thanks!

[Dan C]

Hi nbiefeld,
Welcome to the forums

Could you possibly upload a copy of your file so we can take a look into this for you? If you don't wish to make the file public you can upload it to the following link: https://www.dropbox.com/request/PnFIKF8alRaWIJd5zRWX

[h_d]

Hi,

I've uploaded a very basic file with a pixel layer in two mirrored symbols and a rectangle with no background colour, together with a .png export.

The layers and symbols look like this:

 

 

And this is the png export:

 

Is this the effect you're looking for?

(The mirroring isn't quite perfect in my example as I went back in and added some brush strokes.)

framed mirror.afdesign

[nbiefeld]

@Dan C - I have sent you a message with a link to my file

@h_d - Thanks.  I do not think it is an issue with the mirror symbols functionality, just getting the entire object having a stroke without being down the center of the object.

EDIT: Also, why is it when I export my project to a PNG file, straight lines have various thickness in my drawings?  It is very noticeable sometimes.  @Dan C has the project so maybe he can answer that as well.

[firstdefence]

Just had a play about trying to get a nice symmetry face with a black outline, probably made it a lot harder than it needed to be but was just doodling. Saved file with History

Symmetry Face.afdesign

[Dan C]

Thanks for that, I've looked into it and I can see that at 100% zoom the grey 'fix' layer you've added certainly seems to cover the stroke but when exporting to a raster format I'm also seeing the discolouration down the centre of the image. I'm not certain what's causing this currently and I'll look into it further. 

For the meantime you can workaround the issue by breaking the curve where the vertical line begins at the top and bottom the the battle cruiser and deleting this curve only. This way you retain the rest of the curve and outline and can be certain of no join showing in the centre of the image

[nbiefeld]

Thanks @Dan C

So I just need to remove the right vertical part of the path on the main body?  I did that but it removed most of the background fill of the main body.

Also, why is the top detail having various thickness on the stroke?  I am referring to the top horizontal line for the detail.  It is just a single line but it appears to have a variation on the thickness of the line.

 

[Dan C]

I've replied to your private message with a copy of the file I've edited, saved with history for you

I can see in your design that your line technically double backs on itself and overlaps one line with another, as can be seen in this screenshot, the red node marks the end of the curve, which is currently in the middle of the line:

Removing this node so that the curve is a simple straight line negates the apparent difference in stroke weight, and I suspect this issue is related to the original stroke issue within this file, that I'll be investigating further and passing through to our devs 

[nbiefeld]

Thank you so much!  Sorry if these seems like basic questions.

I got your message and looked at the file.  When I attempted to remove the vertical part of the path, it removed the top and bottom anchor points.  I can see in your file that they still remain, but are not connected somehow?  How did you accomplish this?  And how does it know how to properly fill in the background color as if those points were still connected?

[Dan C]

How did you try and remove the section of the curve? I used the node tool, selected the node at the top and chose the Break Curve option from the context toolbar, then did the same for the bottom node and deleted the separate curve that had been created from splitting the shape.

Any open curve with a fill applied with 'close' the curve with an invisible straight line between the first and last point of the curve and apply the fill between this, as such:

[nbiefeld]

Ah great.  That worked for me.  Learned something new.  I just selected the node and hit delete for the top and the bottom which caused my issue a few posts back.  Doing it like you said worked out perfectly!