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

Bug: "Force pixel alignment" does not always work


Recommended Posts

  • 3 weeks later...

Same issue here. This has been around since 2014 (see https://forum.affinity.serif.com/index.php?/topic/452-pixel-snapping/) and still isn't properly implemented.

 

Meanwhile it's 2018 and I'm getting this (this is a part of Grade UI pack, which everyone who has Affinity can grab):

 

snapping-WTF.png.f2475b9db066d4c14e5280b26fc8f05d.png

 

Just moved the top box, with with pixel snapping turned on, without snapping override (Alt-key). Fraction coordinates, blurred artwork. When is this going to be fixed? As in: working? When preparing this screenshot I drew an artboard to export this part of the file. Guess what: despite pixel snapping the artboard got a half-pixel height. FFS.

 

I paid for both Affinity apps and even got my company to buy another copy of Designer. I get to read a flurry of posts about yet another platform releases, awards of the year, how Affinity can replace Adobe apps, whereas basic stuff like this still causes trouble.

 

This is extremely frustrating and disappointing.

 

Cheers,

Matt

Link to comment
Share on other sites

  • Staff

Hi arechsteiner,

Can't you adjust the snapping settings accordingly? I don't know what situation you are dealing with but if you are getting half pixels it's possible Affinity is trying to snap to the middle of an object with an odd width for example - there's a setting in the Snapping Manager to control this (Include bounding box mid points) - untick it if you have it ticked. There may other things interfering here but without seeing the file it's difficult to guess what may be causing it.

 

Hi Matt,

I will check this out to see what's going on (have to go lunch now).

Link to comment
Share on other sites

@MEB: That's exactly my point. Snapping should not override "Force pixel alignment". It' says force, so please actually force.

I use Affinity Designer for web design, I never ever want any half pixels when sizing and positioning objects. Snapping is useful so I don't want to go and turn it on and off again all the time.

From my point of view, if I tell Designer to force pixel alignment I should never see fractured pixels on newly positioned and sized objects anymore.

Enjoying Affinity Designer on Windows 10. Check out my Bootstrap themes

Link to comment
Share on other sites

  • Staff

Hi arechsteiner,

That's not so simple. Affinity can be used for much more than web design and for some types of work non-integer values (half-pixels in particular) can be useful/desirable - for example to have more control over anti-aliasing when designing icons. So we provide several snapping settings to deal with various types of work. Force Pixel Alignment should work correctly when the rest of the settings are properly configured. There's situations where this can also be tricky. Picking my example above: if you want to align or size an object to half of another one with an odd width value (for example 101 px) what should the program do? Should it set the width of the new one to 49px, 51px or 50,5px?

 

Hi matisso,

Can you please attach your afdesign file here (just the bit shown above in your screenshot - the sign-up box - you can delete the rest of the design) along with a screenshot of the Snapping Manager settings please?

 

Link to comment
Share on other sites

Thanks @MEB for the hint on snapping to objects. Indeed this might be likely is the issue, I had my mid-points snapping on while testing this on the Grade UI file (I had all of them ticked, to be exact). It's worth noting that it doesn't always behave like this. I had to make a few attempts to recreate it, because sometimes the object snapped right into the pixel grid – that would actually explain the mechanism you described. However, if it also happens that it doesn’t snap where it’s expected, well, something isn’t right. @arechsteiner pretty much nailed it – it says force, so please actually force.  :)

 

Right. So I actually played with it for a bit longer, trying different snapping options and carefully observing what is happening with the object as it snaps to different candidates. It looks like this behaviour is also caused by snapping to objects that are off-grid. Text is notorious for creating such situations, as it doesn't follow the pixel grid. You might select all the text objects in the layer palette, and choose “Exclude From Snapping” option from the context menu. Then again, that would be extremely tedious to do it for every text object in your design and for every objects that you prefer to stay off the grid, for better antialiasing or whatever different reason. That's where another limitation comes in, namely the lack of selection of objects based on their kind, attributes, or so. Enter Illustrator: Select / Text Objects. Among other selection options, like select similar objects, same opacity, colour, stroke weight, etc. ;) But still it wouldn't address the underlying issue of objects not being pixel aligned, or snapping taking priority over it, if you like.

 

2 hours ago, MEB said:

Picking my example above: if you want to align or size an object to half of another one with an odd width value (for example 101 px) what should the program do? Should it set the width of the new one to 49px, 51px or 50,5px?

 

That’s actually easy (from a user’s perspective, ofc) – ideally, give the user a choice in preferences. One option would be to force integer values, another one – allowing fractions in pixel forcing mode. Or make the decision on your own, like Adobe did.

 

For the record, in the described case Illustrator snaps to either smaller or larger integer value, ± 0.5 pixel difference depending on from which side you draw the second, smaller object. It doesn’t make any difference to the eye. When centering objects manually with the help of smart guides, the object stays pixel aligned (technically being 0.5 px off the centre of the one it’s being aligned to). If you use an align feature, and centre them, it aligns perfectly, not pixel-perfect. Then again, Illustrator also has the “Align selected art to pixel grid” feature. ;)

 

Sorry for a slightly harsh tone of my previous post. It’s just that I see a lot of potential in Affinity apps but when I try to use them in a real world environment (aka actual work) I run into various glitches and I end up doing things longer and less comfortably than I would have done it using Adobe apps. Sure, a part of it happens because I’m far (well over ten years) more experienced in the latter, but some features like this clearly work in unpredictable ways (the infamous constraints/ungrouping issue being just another example).

 

Cheers,

Matt

Link to comment
Share on other sites

56 minutes ago, MEB said:

That's not so simple.

Sorry I don't see how this could be any simpler to be honest. If there is an option that says "Force pixel alignment" I expect the program to force alignment to whole pixels, period.

For types of work where you want fractured pixels you would disable "force pixel alignment".

56 minutes ago, MEB said:

Should it set the width of the new one to 49px, 51px or 50,5px?

Anything but 50.5.

Otherwise you'd have to rename the option to "Try aligning to pixels if it's convenient". In that case please add another option "Mercilessly force pixel alignment" for web designers.

Cheers

Enjoying Affinity Designer on Windows 10. Check out my Bootstrap themes

Link to comment
Share on other sites

3 hours ago, MEB said:

Can you please attach your afdesign file here (just the bit shown above in your screenshot - the sign-up box - you can delete the rest of the design) along with a screenshot of the Snapping Manager settings please?

 

@MEB, this is just a Modal Windows.afdesign file from the Grade UI Pack, like I said. For the sake of convenience though – there you go. There's also the screenshot of the Snapping Manager you asked for. And a few more showing moments when it goes “wrong”.

 

However, I don't really think the snapping settings are the key here. It’s the snapping that takes over pixel alignment that appears to be the problem.

 

Cheers,

Matt

 

Screenshot_AD_snap-4.png

Modal Windows.afdesign

output_lC9i4l.gif

Link to comment
Share on other sites

  • Staff

Hi matisso,

Thanks for the file and screenshots. Yes, snapping takes priority which makes it problematic with text objects, scaled images (where keeping the ratio forces one of the dimensions to be off grid), odd width, heights of other objects etc. I will talk with the dev team, raise those issues/propose a few changes to see if we can improve things here.

Thanks all for your reports and feedback.

Link to comment
Share on other sites

  • 8 months later...

Any updates on this? Force pixel alignment is still an issue and shouldn't be on something touting itself as a UI design tool (amongst other things). It's rather frustrating having to double check every object you create when you've set the software to "force" a set of criteria. 

Link to comment
Share on other sites

  • 3 weeks later...

I spent 2 hours trying to get 9 artboards and all their background layers all aligned so I could export to the right size rather than 1 pixel bigger than it should be with a transparent edge. This is not OK as a workflow. There are tools like Sketch that make pixel alignment very easy and there is a button where you can select a object and say snap to pixels and bam no sub-pixels. 

In Affinity even though the property panel looks like it's on the pixel boundary 780  it isn't because if you turn on 3 significant places on the pixels display (trick I found in forum on this issue) it's actual 780.029. I don't want to have to wrangle to 3 significant places to get my art aligned for export! Nor do I want to have to be worrying about 100ths of a pixel cluttering my property display.  If the force pixel alignment is ON then it should never allow a layer to be off the pixel grid when creating or moving it and ALL X/Y should be integral. 

I have to admit I was a big fan and advocate to other UX designers of this product until now, but it's such a ridiculous thing to implement as it is that I have lost a lot of faith in it.

Stop adding new features and fix the fundamentals you are being told about by professional designers. Or stop claiming this is a professional tool because it clearly isn't. Because for all it's excellent parts it let down by flawed thinking in the fundamentals. I'm not the only voice here there are many threads here on the same topic from professional designers. 

Link to comment
Share on other sites

Here is just a sample of threads caused or related to this behavior - there were 17 pages I stopped at page 4

https://forum.affinity.serif.com/index.php?/topic/67434-copied-artboard-slices-consistently-off-by-1-pixel/&tab=comments#comment-348837

https://forum.affinity.serif.com/index.php?/topic/53609-merging-layers-causing-blurring/&tab=comments#comment-359703

https://forum.affinity.serif.com/index.php?/topic/68654-wrong-size-of-file-after-export/&tab=comments#comment-355211

https://forum.affinity.serif.com/index.php?/topic/67434-copied-artboard-slices-consistently-off-by-1-pixel/&tab=comments#comment-348837

https://forum.affinity.serif.com/index.php?/topic/64600-wrong-document-dimension-when-exporting-with-export-persona/&tab=comments#comment-344034

https://forum.affinity.serif.com/index.php?/topic/63279-jpeg-exported-file-shows-unwanted-lines-across-the-picture/&tab=comments#comment-328046

https://forum.affinity.serif.com/index.php?/topic/62569-ad1-pixel-lines-not-displaying-as-1-pixel-wide-not-crisp/&tab=comments#comment-324370

https://forum.affinity.serif.com/index.php?/topic/54222-force-pixel-alignment-for-transform-panel-in-ad/&tab=comments#comment-274729

https://forum.affinity.serif.com/index.php?/topic/54024-force-pixel-alignment-move-by-whole-pixels-not-working-with-groups-photo/&tab=comments#comment-273680

https://forum.affinity.serif.com/index.php?/topic/61483-export-picture-size-change/&tab=comments#comment-320572

https://forum.affinity.serif.com/index.php?/topic/63801-export-dimensions-depend-on-artboard-alignment/&tab=comments#comment-330850

https://forum.affinity.serif.com/index.php?/topic/63900-export-size-bug-mac/&tab=comments#comment-331416

https://forum.affinity.serif.com/index.php?/topic/58210-one-pixel-is-added-to-my-exported-picture/&tab=comments#comment-308623

https://forum.affinity.serif.com/index.php?/topic/29400-size-adds-1px-when-creating-slice/&tab=comments#comment-296362

https://forum.affinity.serif.com/index.php?/topic/57619-unwanted-white-border-when-exporting-via-batch-process/&tab=comments#comment-296175

https://forum.affinity.serif.com/index.php?/topic/32639-force-pixel-alignment-not-work/&tab=comments#comment-158750

https://forum.affinity.serif.com/index.php?/topic/3237-white-borders-after-pdf-export-on-top-and-right-edge/&tab=comments#comment-258100

Link to comment
Share on other sites

Good luck getting any other response than "the developers know, this is not an easy fix, it is on the list, blah blah blah" as soon as my current contract ends, where I unfortunately have to use this software, I will be out. There are a handful of great features in AD, but too many core flaws for this to be the single software solution for anyone who relies on precision.

Link to comment
Share on other sites

Yep They need to realise this. Trouble is over precision in it's behaving like a cad tool not a screen  design tool. They definitely need a stabilizing release. It's not hard to implement you just need a round() on the X/Y in that mode.

I'm going to start a list like Arya Stark

1 Pixel forcing on artboards

2 Nested constraints

What else? ...These have to be major face palms that break workflow not niggles.

Link to comment
Share on other sites

  • 4 months later...

Add my voice to the concern. I left Illustrator precisely because of it's inability to produce and maintain clean pixel lines during the creative process. For a while AD looked like it was solving it. But it doesn't. Product owner really needs to understand, like they did at Figma, that every UI / Web designer wants clean lines 99.99% of the time. Every design that doesn't make it a thoughtful process to create a blurred line is wrong by nature. Now clearly it's super difficult to handle correctly but apparently the folks at Figma pulled it out. If so there's a model to replicate. 

Link to comment
Share on other sites

  • Staff

Hi Grégory Makles,
Welcome to Affinity Forums :)
Sigma, Sketch and other similar tools were developed specifically for UI/prototyping. Affinity Designer covers a wider range of uses which require more broader snapping options.
When creating a new UI/Web Design project (after creating a new document), go to the Snapping Manager and select Pixel Work from the Presets dropdown. This sets up the basics for pixel work. If you want to be able to align objects also tick Snap to object bounding boxes. These settings also affect artboards (Force Pixel Alignment), so duplicating, moving and scaling them shouldn't be an issue. Where you may have issues is when drawing single vertical/horizontal lines since they will not fill a single column/row of pixels (they are placed between columns/rows so they aren't sharp) - you can't also change their alignment as for closed shapes. One tip that may help here a bit is setting the Nudge distance in Preferences to 0.5px. After drawing a line you can then use the cursor keys to nudge the object 0,5 pixels to quickly align it with the pixel grid. Maybe we can improve things here forcing single lines to snap immediately to the pixel grid (I will pass this to the dev team for consideration).

Another thing that may also help is using the View Mode - Pixel and Pixels (Retina) - as appropriate to force the rasterisation of objects for screen rendering so you can easily detect object (lines) that are not pixel aligned. 

Hope this helps a bit. Thank you for your feedback.

Link to comment
Share on other sites

  • 5 months later...

I would like to jump into this thread since it is one of the more expressive and factoral threads on this repeated issue. I have had a serious headache with this problem myself, namly the export persona constantly exporting images with a 1px gap. I have since, through shear perservance learned the work flow to get around this problem. I do agree force pixel alignment should do what it says and the whole document works precisely on whole pixels regardless of scale, snapping or repositioning. Perhaps affinity should even add this as a clear option when creating a document in the first place. Add a tick box option next to the 'document units' dropdown menu and call it 'work with whole pixels'. Then have the additonal force pixel button in the toolbar.

My problem I face now is when a scale an object, let's say a simple piece of text. It does not scale to whole pixels. It introduces the stupid fractured pixels, even though the whole docuemnt is working in forced pixel alignment. Due to this I have to constantly monitor and be aware of resizing everything to make sure it is working in full pixels. Is there a way when I scale an object, ie grabbing the blue handle points and increasing or decreasing its size, while maintaining full pixels? This would help massively on my end in solving how affinity works.

Like others though this is really beginning to dent my ability to use Designer going forward. It is literally adding hours to my work flow.

 

https://www.loom.com/share/d4d68bbd50ac4a68892ca40852a5cf72

Link to comment
Share on other sites

I must confirm what @Davidlower wrote regarding the added "ghost" pixels or gap when exporting. That's particularly frustrating but this is the result of AD not knowing what to do with additional fractions of a pixel when exporting, I guess. I can't imagine this being useful in any type of work, not only UI.

Link to comment
Share on other sites

On 7/14/2019 at 1:20 AM, Davidlower said:

... I do agree force pixel alignment should do what it says and the whole document works precisely on whole pixels regardless of scale, ...

Scaling is the problem, you would have to have a round up/down to whole pixels involved which would result in objects getting further from their original H:W ratios as you continue working.

Mac Pro (Late 2013) Mac OS 12.7.4 
Affinity Designer 2.4.0 | Affinity Photo 2.4.0 | Affinity Publisher 2.4.0 | Beta versions as they appear.

I have never mastered color management, period, so I cannot help with that.

Link to comment
Share on other sites

  • 9 months later...

It’s nearly a year since I posted and from the original thread even longer. Is this problem going to be address or fixed? Affinity designer is boasting that it is a vector program for logo design and website UI design. How can this program justify this ongoing issue? I think affinity is brilliant and the export persona is great. But I’m so nervous using this software now because I design a full website and then export the icons, images and text for the website. Guess what everything has a white stripe or is not the correct proportion.

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.