Bjango home
Articles
Help
Contact
iStat Menus
iStat for iOS
Consume for iOS
Skala
Skala Preview
iStat Server
for Mac
See all apps

Pixel perfect vector nudging

When nudging vector points, Photoshop exhibits some strange behaviour, linked to how far you’re currently zoomed in. At 100%, nudging using the arrow keys will move your vector point exactly 1 pixel. At 200%, nudging moves the point half a pixel. At 300%, it’ll move a third of a pixel.

The behaviour seems intentional, but it’s not usually what I’m after. Most of the time I want to nudge in whole pixel increments. Here’s how you can do that, without zooming out to 100%.

Open your document, then create second window by choosing Window > Arrange > New Window. You can then resize the new window and place it somewhere that’s out of the way.

Edit in the other window as normal, zooming in as far as you’d like. You’ll now be able to press Command-` to switch back to the window that’s zoomed to 100%, nudge using the arrow keys, then press Command-` to switch back again. Because the other window is zoomed to 100%, nudging will move the selected vector points exactly 1 pixel.

Please note that holding shift while using the arrow keys to nudge always moves 10 pixels, no matter how far in you’re zoomed. Also, dragging points with the mouse snaps to pixels in most situations. Most, but not all.

While not perfect, this technique has helped remove some of the frustration with detailed vector path editing in Photoshop. Or maybe it’s just another reason complex shapes should be drawn in Illustrator first, then pasted as shape layers?

If anyone from the Photoshop team at Adobe is reading this, please consider adding a global Snap To Pixel option that replaces all the other similar options sprayedthroughout the UI. Just one global switch that can be either on or off that means every single action can be pixel snapped or not.

Other articles

My app design workflow
Gradient maps
Strokes in Photoshop CS6
Just like print design
Layer tags
Using algebra to create paths
Sub-pixel text rendering
Photoshop Actions & Workflows
Scale Patterns to 100% script
Text in Photoshop CS6
Masking in Photoshop CS6
Illustrator and app design
Vector shapes in Photoshop CS6
Photoshop CS6 improvements
Pixels per inch is just a tag
PNG compression and iOS apps
Everything is a grid
Smart Objects
Exporting from Photoshop
Iterate Podcast
Pixel perfect rotation
Pixel perfect vector pasting
Pixel perfect vector nudging
What if iChat was one window?
Gradients
Designing for Retina display
Designing for Retina display, part two
A new Drobo Dashboard icon
Noise and textures
Photoshop CS6 wish list
What to do with all those extra pixels?
Photoshop roundrect roundup
Colour management and UI design
How many layers are in my PSD?
Dissecting iTunes and App Store links

About the author

Marc Edwards is the Director & Lead Designer at Bjango. Follow @marcedwards on Twitter and @marc on App.net.

  • Bjango on Twitter
  • Bjango on Dribbble
  • Bjango on GitHub
  • Bjango on App.net
  • RSS Feeds
  • Marc on App.net

©2013 Bjango Pty Ltd. All rights reserved. ABN 88 062 334 580.
Apple, the Apple logo, iPad, iPhone, and iPod touch are trademarks of Apple Inc., registered in the U.S. and other countries. App Store is a service mark of Apple Inc.
Please fasten safety harness before continuing.