Affinity Designer - lower layers bleed on the edges in pixel view mode and exporting

[Nox]

I'm currently working on some UI replacements for a game in Affinity Designer. The images are not going to be very high resolution, that's why every pixel counts.

My problem while being in the pixel view mode and exporting the image as png is that the lower layers bleed through on the edges and make the pixels brighter as they should be.

Normal View:

Pixel View:

These bright pixels are very visible in-game and make them look very disrupted. It does not make any sense for me that they are brighter.

How do I get rid of these pixels?

Edited July 19, 2020 by Nox

[firstdefence]

On the exported graphic that is now pixels, open that graphic and use the Pixel Tool (B) in Affinity Designers Pixel Persona to recolour those pixels, use the colour picker in the Colour Panel to select an adjacent colour and then use the pixel tool to stamp that colour over the bright pixels.

[Pšenda]

5 hours ago, Nox said:

It does not make any sense for me that they are brighter.

These pixels, at least those at the top/left of the image, are illuminated by the reflection of light from the bright areas below them. Try turning off the bottom and right objects before exporting, or at least turn off its emboss.

[Nox]

8 hours ago, firstdefence said:

On the exported graphic that is now pixels, open that graphic and use the Pixel Tool (B) in Affinity Designers Pixel Persona to recolour those pixels, use the colour picker in the Colour Panel to select an adjacent colour and then use the pixel tool to stamp that colour over the bright pixels.

This does not work, because the image has an alpha channel, I just did a black background to make the bright pixels more visible.

Also I don't like to manually post-process every pixel. I don't have this problem with other vector programs like Inkscape. (Edit: Inkscape produces the same bleeding now, but I could bet this wasn't the case a few years ago 🤷‍♀️)

7 hours ago, BofG said:

@Nox have a see if something like this helps:

 

That's a similar problem but your answer does not work, it just makes the layer non-anti-aliased.

6 hours ago, Pšenda said:

These pixels, at least those at the top/left of the image, are illuminated by the reflection of light from the bright areas below them. Try turning off the bottom and right objects before exporting, or at least turn off its emboss.

that does not make any sense, it's just a flat vector image without blur or some other shenanigans.

 

Affinity Designer blends overlapping layers on the edges of the forms incorrect together.

Edited July 19, 2020 by Nox
correcting a miss-assumption

[firstdefence]

Would you mind uploading the original .afdesign file for us to look at?

 

[Nox]

33 minutes ago, firstdefence said:

Would you mind uploading the original .afdesign file for us to look at?

 

Sure: 40fbc4ad-trimmed.afdesign (I just removed the non-relevant layers)

[Nox]

Because no one answered I tried another approach with gradients in the background:

Its not exactly what I planned but it works when pixel'd:

 

still, I don't know why its bleeding on my first approach.