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

Pixel perfect mode


Recommended Posts

Hey there!

 

I've seen a lot of posts regarding this, but hey, let me put it from my perspective.

 

Affinity Designer is the fastest workflow I ever had, but gets really slowed down by the fact that it insists on not using round, natural numbers for coordinates and sizes. It's fine for drawing, but for UI design, it is just a chore of every 1 minute going back to what you just did, adjusting the additional 0.3 on this coordinate, remove the 0.5 on that width, etc... The micromanagement is killing me.

 

I've followed the guides, read all about the snapping, how it works, and so on. But I still get these floating point values on everything I move and create. It just plain doesn't works.

 

If this mode cannot be accomplished through existing settings, how about a "Pixel perfect" checkbox on the Snap manager, so that all coordinates of new objects, or existing ones without floating point, remain like such until I force them out?

 

Basically, not letting objects use floating point until I force them to.

 

I have read reasons why devs find this like a grey area, but maybe this illustrated another solution, or something closer to it. I don't remember how Photoshop handled this (aww, already forgetting it!) but this was never an issue out of the other million issues it did have.

 

Cheers! :)

Link to comment
Share on other sites

I would love this! As for Photoshop, it does the FP crud when zoomed in or out. Maddening to a UI designer. Some sort of constrain to pixels mode would be very welcomed indeed for UI folks.

Journey forth my friend, by body if needs be...

 

MacBook Pro (Retina, 13-inch, Late 2013), 2.6 GHz Intel Core i5, 8GB RAM, OS X 10.14 beta || USB Keyboard, Wireless Trackpad, Wacom Intous 3 Tablet

Link to comment
Share on other sites

  • Staff

This was already discussed and explained previously in other threads. Check Snapping, Pixels, and Exporting and Pixel Snapping for more info.

 

In resume, we were aligning to half-pixels, because at the time (betas and 1.0 release) there wasn't a way to position one pixel stroke correctly in a pixel grid since Affinity Designer could only render center aligned strokes. In those cases, the half-pixel snapping was helpful to position the stroke of a shape at the middle of a pixel so it could be rendered correctly as a one pixel stroke. Now that AD already has support for stroke alignment this is not so relevant (although can still be useful for fine tuning icons/small text and other pixel based artwork) and may cause some trouble for regular work.

 

I believe we will offer an option to enable/disable the half-pixel snapping at some point, leaving just the regular snap to full pixels activated as default. It just may take a little since there's other features being worked on.

Link to comment
Share on other sites

  • 4 weeks later...
  • 1 year later...
  • Staff

Thanks. I believe what's happening here is when you draw the rectangles (sometimes) Affinity will pick references from/snap to other objects on your drawing - in particular mid-points from other objects which also have integer values thus leading to objects which are not perfectly aligned with the pixel grid (have an additional half pixel).

For example, the bottom red rectangle on your file has a width of 62.5 px which matches exactly the mid-point of the bounding box of the grey rectangle above it in the drawing. Since the width of the grey rectangle is an integer value, when you created the new red rectangle the snapping picked the mid-point from the grey rectangle instead of snapping to the pixel grid and you ended up with the additional half-pixel you have in the red rectangle.

 

If you change the Candidates dropdown From All layers to other option - in particular Candidate List - there's less chances of this happening. You can also disable Include bounding box mid points to prevent the snapping from picking the mid-points from other objects.

Link to comment
Share on other sites

I understand, but that's not really the best way to solve the problem. I'd recommend implementing something similar to what Sketch has. Either asking the user if he wants to round down/up the size and  if he cancels, then display it as floating point, or just make a setting for that so the user has some choice in this, without affecting the snapping. That would remove this problem entirely in the future.

 

The reason why I'm advocating for adding a setting and not changing the snapping settings is because sometimes you might needs to size things in comparison to others, and the fact that snap allows this is too great of a feature to turn off just for the sake of rounding.

UI and UX designer extraordinaire, dad, avid Destiny player, and generally striving for decency.

Link to comment
Share on other sites

  • Staff

No problem

 

The problem you have is that you have "Move by whole pixels" turned on.  This mode keeps objects at their sub-pixel positions.  So, for example you will move an object from 10.3px to 11.3px.  This mode was added so that you can design in sub-pixel, but then move your objects by whole pixel distances.

 

Turn this mode off, and you will be able to correct objects onto a whole pixel, moving objects from 10.3px to 11.0px for example.

 

As MEB says, other snapping can result in off-pixel positions.  If you want to avoid this, turn off all other snapping options.  Snapping should always snap exactly, otherwise it's kind of contradictory.  To post-quantise to pixels would throw the result out.  Fine if you are designing in strictly pixel space, but not so for anything else.

 

We offer pixel snapping in combination with the other snapping options because they can be used cooperatively, if you know what you want to achieve.

 

If you have "Snap to pixels" turned on aways, then your entire document should remain in rounded pixels, subject to not performing any aspect ratio scaling that might affect the size of one axis of an object.  It is worth turning off snap to mid points in order to avoid any snapping to 0.5px positions.

SerifLabs team - Affinity Developer
  • Software engineer  -  Photographer  -  Guitarist  -  Philosopher
  • iMac 27" Retina 5K (Late 2015), 4.0GHz i7, AMD Radeon R9 M395
  • MacBook (Early 2015), 1.3GHz Core M, Intel HD 5300
  • iPad Pro 10.5", 256GB
Link to comment
Share on other sites

  • Staff

@Ben,

I don't think Move by whole pixels would affect this since sorin.jurcut said he had Force pixel alignment on all the time (that is since the creation of the document). There's no way to create objects falling outside the pixel grid if Force to pixel alignment is enabled no matter if Move by whole pixels is turned on or not. The Include bounding box mid points however still have influence here unless turned off.

Am i missing something?

 

Sure. Highlighted shapes with red have rounded pixel size. Force pixel alignment was on at all times.

Link to comment
Share on other sites

  • Staff

Yes, I see.  What you said is probably true here about snapping to mid points.  The simple solution here is to just turn off "Include bounding box mid points" - that will avoid any 0.5px positions.  All other settings will achieve exact pixel positions.

 

The fact is though, when snapping, you will see exactly what you are snapping to.  There are always indicator lines to show the snapping target.  In the absence of any other direct snap (to another object, grid or guide line), then the position will be quantised to a whole pixel with "Snap to pixel" turned on.

 

Snap to pixel is slightly different to other snapping in that it is not affected by snapping tolerance, and it happens only when another snap has not been made.  It will always snap to pixel if no other snap has been made.  Snapping to box mid points will come first, if you are within tolerance of a mid point line.  If your tolerance is set much higher than a pixel on screen, then the snap to mid points will happen first.

SerifLabs team - Affinity Developer
  • Software engineer  -  Photographer  -  Guitarist  -  Philosopher
  • iMac 27" Retina 5K (Late 2015), 4.0GHz i7, AMD Radeon R9 M395
  • MacBook (Early 2015), 1.3GHz Core M, Intel HD 5300
  • iPad Pro 10.5", 256GB
Link to comment
Share on other sites

  • Staff

+1

 

I just bought this yesterday, and having things be 23.8 pixels apart at x,y 15.9, 22.1 is making me sad.

 

That's just because you haven't got snapping turned on....  Those values just show that no snapping is being done.  (or you are snapping to things that are already at those positions).

SerifLabs team - Affinity Developer
  • Software engineer  -  Photographer  -  Guitarist  -  Philosopher
  • iMac 27" Retina 5K (Late 2015), 4.0GHz i7, AMD Radeon R9 M395
  • MacBook (Early 2015), 1.3GHz Core M, Intel HD 5300
  • iPad Pro 10.5", 256GB
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.