photoshop on pixel design
- Started
- Last post
- 23 Responses
- dcs787
Hi guys,
I always design for the web so need to make sure all my designs are placed on an exact pixels rather then on a fraction of a pixel (for example 4px rather then 4.2px)
Does anyone know how to set photoshop so that all shapes, text, guides are placed on a pixel rather then loosely on fraction of pixels?
thanks for the help!
- ********0
Preferences > Units & Rules > Ruler = Pixels
- doesnotexist0
all you need to do is make sure it's set to 72 DPI.
- yes, 72 DPI as well********
- no, dpi has nothing to do with screen.acescence
- If DPI has nothing to do with screen design, try making pixel design at 300 DPI********
- DPI is just a bit of metadata added to the file header.ribit
- of course you can make pixel design at 300dpi. The screen dimension will be quoted in pixels.ribit
- and there are very few 72dpi screens on the market...ribit
- ok, but you won't get shit placed on half a pixel.doesnotexist
- There's no difference in the what you see on screen whatever the DPI.ribit
- yes, 72 DPI as well
- imnotaplumber0
place guides onto whole pixels by holding shift
- ribit0
and open up a second view of the window at a different zoom so you can see what you are doing closeup
- acescence0
ok, here's your proof
this file is 1 dpi:
this file is 5000 dpi:
- that file is not 1DPI.doesnotexist
- correctribit
- rather, you can't tell on screen.doesnotexist
- (not you, acescence). That file could be 1 DPI.ribit
- yes they are different DPI********
- the only way to tell what the DPI setting is, is to look at the file header (cos it's just metadata)ribit
- I invite you to open them in photoshop and see for yourself!acescence
- they are both 100px square and will behave identically in PSacescence
- greatdoesnotexist
- screen have a 72dpi resolution.. even if you pimp it out to 500 dpi, it won't change cause it's made for 72elektro
- ugh, still not getting it. DPI has nothing to with screen PPI. set DPI to whatever you wantacescence
- no need to bring DPI or PPI into it. Both just aren't relevant here.ribit
- Why do people keep saying screens have 72dpi resolution? Have you just arrived from the 80s?ribit
- yeah, layover from when average CRT pixel densities were around 72. Kopin makes LCD panels up to 2700 PPI nowacescence
- and iPhone is 163ppiribit
- ribit0
And here is the only difference in the files as far as I can see...
In the file header (before the bitmap data), the 5000dpi file has this metadata:
tiff:XResolution="50000000/10000... tiff:YResolution="50000000/10000...and the 1DPI file has this:
tiff:XResolution="10000/10000"
tiff:YResolution="10000/10000"
- dcs7870
i have my canvas to 72dpi/inch, i have changed my rulers to pixels and i am holding shift when moving around a layer yet I can still create and move layers to a fraction of a pixel...!! any more suggestions?
- doesnotexist0
make it in illustrator and turn snap to grid on.
- acescence0
the only thing that comes to mind is that there are reports of rendering errors with OpenGL and the GPU in CS4, as it uses the GPU on your graphics card now in CS4 instead of the CPU to do screen drawing. things like selection marquees appearing one pixel off and guidelines looking anti-aliased at close zoom. doesn't sound like your problem though
- No, this is not helpful. His problem is when drawing shapes. The actual vector lines are split between pixels causing anti-aliasing when he in fact wants aliased lines. Has nothing to do with rendering hardware.JosephKnight
- Lillebo0
(Using CS3) The only objects I am able to position at a fraction of a pixel is the path of vector shapes. It takes a bit of care to position things correctly in PS for web and pixel perfect screen graphics. Zoom in and use rulers...
- Not_Just_Another0
I've recently started doing more and more design for web, and I've found a neat (albeit lengthy) process for ensuring vector shapes stay on perfect pixels. I'd found that despite careful positioning, sometimes a guide will not snap to a pixel. So the trick I've found is to draw a marque box - and then pull the guides to it. When you now draw a vector shape (providing you're starting and ending them on your pixel-perfect guides) they'll always snap exactly where you want them...
Sorry for the lengthy (and probably incoherent) explaination :-)
Hope it helps.
- springbok0
- very helpful. didn't know about that "snap to pixels" option under the shape menus. Now, what about paths and lines?JosephKnight
- Fariska0
i often have the same problem
The solution: use the transformation toolbar at the top to specify x, y, width and height and keep your object anchored to the top left cornet.
- springbok0
- YESdoesnotexist
- booyah! that pretty much makes my marquee trick redundant!Not_Just_Another
- dcs7870
i like the rectangle 'snap to pixels' but that only works when you are creating a new box or shape... how do i make sure whatever i move around on the canvas locks on to a pixel when i move it..
- dcs7870
?
- ninjasavant0
set a 32x32 pixel grid with 32 subdivisions. Turn on the grid, then enable snap to grid. Done.
- ninjasavant0
There are a couple of hiccups though. If something is not on the pixel grid line and you try to nudge it, it will move 1 pixel but still not be on the grid. There's some other stuff you'll notice but you'll figure it out.
- JosephKnight0
My problem has been drawing paths that don't split pixels. How?
Normally you can just zoom to 100% and shift draw away without splitting, but if you zoom in and draw you'll unfortunately be able to draw between pixels.Answer? I got it. Thanks to ninjasavant.
I set my grid to "gridline every 72" / "subdivisions 72".
Then I set it to a light light gray and set it to "dots" style.
Now the grid will be invisible (instead of a dense mess).Then make sure that the grid is on. And snap is set to grid. You wont see the grid but you can now draw vector paths while zoomed in and they wont split pixels if you hold shift between points.