100% zoom is too small on screen (designers don't get high resolution displays)

Adam S Riley

Participant

Shame the pixel aspect ratio option isn't able to effect height as well as that would be perfect as it stretches the document, dimensions remain the same and the quality is maintained (looks "retina"). If a script is available it would be perfect.

Adam S Riley

Participant

My "temporary" solution is to use an app that changes the display resolution to 1680x1050, which means I get more screen space and photoshop now looks alot smoother than before (even better than on non retina macbook). The default 1680x1040 option in display settings is too sharp. Obvisouly the only problem is switching back and forth when I'm not designing.

D

domb182

Participant

This post is to long so i'm not sure if it's been solved yet.

Anyway to see the images at the correct size, on a retina display mac;

1) Navigate to the PSD app in applications

2) Right click - "Get Info"

3) Check "Open in Low Resolution"

4) Open App

Thanks

Astley Marketing

Participating Frequently

Hey, it's not solved yet but thanks for the short answer though... we've noted that one a few times already to help people out before Adobe catchup with the rest of us!

But instead of forcing a compatablility mode from the OS, I think the simplest suggested solution here so far was to have a "web preview" tickbox that just compensates for the difference.

Photoshop Retina is great for photo's but I'd rather not have to keep unchecking the option from the view menu or from Get Info when switching tasks, so a file-based setting would personally suit me better. I made the mistake of commenting early on before many people had switched to the Retina MBP. Glad to see that it's slowly gaining tracktion.

C

Chawko

Participant

I'm having the same problem and it's ridiculous that it's so hard for people to accept what our problem is rather than lecturing us on what pixels are. I realize why it currently works the way it does but I'd like to be able to use the program in the way that OP and others have described. I hope that a solution comes about soon.

N

nathanpowell

Participating Frequently

Ideally, 960 pixels would diplay exactly the way they would in a web browser.

Shadows/gradients/text/borders are (should be) elements rendered by our browsers via CSS. The Retina display shows these perfectly.

The following are NOT solutions:

designing at double size: causes major headaches for the front end guy and designer for pixel perfection
designing with the "low resolution" checked or looking at it at 200% zoom is just completly inacurate from what the user will see

The only solutions I can find are

Use another display (which sucks when you need to do things on the go)
Photoshop gives us a Proof render engine that mimics browsers

I'll keep my fingers crossed that Adobe is working on the number 2 solution.

Astley Marketing

Participating Frequently

I've got used to using the 'low resolution' mode in Photoshop, it's not ideal but at least you're designing at the correct scale.

I copied this from Apples website:

Problem: I'm noticing functional or visual issues with an application. How can I make it work better?

Resolution: Try opening the application using Low Resolution mode:

1. Quit the application if it is currently open.

2. In the Finder, choose Applications from the Go menu.

3. In the Applications folder that opens, click the application's icon so it is highlighted.

4. Choose Get Info from the File menu.

5. Place a checkmark next to "Open in Low Resolution" to enable Low Resolution mode.

6. Close the window and double click the Application to reopen it.

Note: You may also contact the developer of the application to determine if they are offering an update to the application for the Retina display.

Lol to the last line!!

A

Anonymous

The fix to this is simple. When you are working on web designs in Photoshop on a retina display, work in retina sized documents. Designers should start producing retina size graphics in adition to normal size ones anyway. So if your design is normally 1000px wide, make your document 2000px wide. That will ensure everything looks nice and smooth. When you are finsihed you just scale down the design before you export the graphics.

Legend

Actually, designers should have been doing that for a long time already now. It's been possible to zoom in on documents for quite a while. The gestures to do so on a table are extremely natural.

It's satisfying when, say, pondering whether to buy a "widget" when you can zoom in on that "widget" image and see more detail.

-Noel

Legend

For the original posters and all those thinking of posting a "me too" response in this thread.

Think hard about what 100% means... When you can answer "100% of what?" you will understand why it works as it does, and why it is RIGHT.

The only point to be made here, and which hasn't received direct attention so far, is that Photoshop could upscale your document to 200% using an interpolation method other than "Nearest Neighbor", which would hide the pixel edges. I'm sure the Adobe developers hotly debated whether to do this internally. In fact, Photoshop does do smooth interpolation right up to 195%.

For those of you unhappy with how your image looks at 200% zoom, how does it look at 195% exactly?

While I don't have a Retina-equipped Mac, just based on what's been stated I'd be willing to bet Safari upsamples images to 200% using a smooth interpolation method.

-Noel

P.S., I blame Apple for this, but not in the way you think... Apple has always catered to people who would rather not "get technical" about what they are doing with their computers. While there are certainly some very brilliant Mac users (several have spoken in this very thread, and the chief engineer at my company who is a bona fide genius is a Mac guru), there are also a lot of Mac users who don't know and don't care how things work. To them, the selection of menu item XXX followed by action YYY is implicitly expected to be the same from machine to machine. It's not hard to see how, in the culture of "let Apple worry about the geeky stuff", touchy feely folks - the type who put rulers to monitors - won't immediately see why 100% zoom works as it does and why it's the only way Adobe could possibly have implemented it.

Unfortunately, where Photoshop is concerned, you just have to get a bit geeky.

station_two

Inspiring

Clueless users are not an exclusive domain of Apple. There are plenty of utterly cluless Windows users too.

However, I will admit that it's easier for a clueless user to get somewhere with a Mac than with a Windows box.

A

Anonymous

station_two wrote:
Clueless users are not an exclusive domain of Apple. There are plenty of utterly cluless Windows users too.
However, I will admit that it's easier for a clueless user to get somewhere with a Mac than with a Windows box.

Good one, station_two:) Mac user here. Far from clueless. I do not find it surprising that many users, no matter what the OS, do not understand the relationship between screen pixels, image pixels, print size, etc. It is a complex subject and takes some time to wrap one's mind around.

Participant

I do have to thank Noel for giving me a better search term for this problem. Never dealing with a retina display before I didn't know what to search for so I typed out the exact problem, which brought me here. But with Noel's "help" I searched "retina display problems with photoshop" and found this very helpful and non condescending answer from Julieanne Kost's blog http://blogs.adobe.com/jkost/2013/01/viewing-photoshop-cs6-in-low-resolution-on-a-retina-display.html

The solution is quit simply and a lenghty lesson on "how images and displays actually work" is not needed.

Select the Photoshop application in the Finder and choose File > Get Info. If you have a Retina display, under General, there will be an option to “Open in Low Resolution” check that and when you reopen your image in photoshop it will appear like you are use to.

The image on the left was opened in photoshop on the retina display as normal. The image on the right is opened with "Open in Low Resolution" checked.

c.pfaffenbichler

Community Expert

The image on the left was opened in photoshop on the retina display as normal. The image on the right is opened with "Open in Low Resolution" checked.

That is the same image in both screenshots?

Could you please post the image itself or a link to it?

Legend

Noel Carboni wrote:
What I don't know - and it's not because I don't have a Retina display, but because it hasn't been described in detail - is exactly how the designers who feel Photoshop is failing them actually do their work.

Try this... It's a large image so I've hosted it here.

Low resolution mode eradicates this problem, but isn't really a good solution - It's like giving a novel writter a pen with very little ink!

Thanks, but it's the things that are unsaid (e.g., "forcing me to design") that are still unclear. Clearly you have expectations in your step by step workflow that are not being met. I just don't know what they are. Details matter.

Please know that I fully understand that the pixels in your screen grab don't match the pixels in your layout materials. I have understood it since the very first post in this thread.

There's no fundamental difference between screen grabbing Safari on a Retina display and someone with a "standard" ppi display doing screen grabs when their browser is zoomed-in.

The problem seems to be one of expectations... You expect your screen grab to exactly match the content that went into the design and is being viewed through the browser. Therein lies the problem.

You need to start to accept the fact that the pixels in the data going into the web page really have nothing to do with the pixels being displayed in the browser. We've just been talking about sizes here, but there are also things like color management that make this true.

It's clear that you have developed the expectation that's now not being met because coincidentally in the earlier days of web design, the sizing DID match - and you developed your workflow and habits around that.

I'm afraid I would still find it impossible to write a step by step replacement web design workflow for you, since you haven't been specific about just when you make use of screen grabs, what you're expecting to paste where, who communicates what sizing to whom in what coordinates, etc.

At this point I can only surmise that using pixel sizing for expression of the layout is at the very core of your needs, though I question whether even that is valid. There's nothing fundamentally wrong with using physical units such as points or inches.

Given these things, I can make another potential suggestion that might help you in the short term:

What would happen if you made it a habit to zoom your browser out to 50% to do your screen grabs. It's just a few keystrokes. Then paste the results into Photoshop and view your design at 200% zoom there.

An alternative to this would be to always downsample your screen grabs in Photoshop. You could even set up a function key to do that for you automatically.

-Noel

Participant

The problem is that for the last 10 years that I have been using photoshop on a mac, the images always displayed bigger and sharper on the screen no matter if I am connected to a monitor or not. Now that I have upgraded to a mac with retina display the images open smaller than I am use to. I, like the others asking for help are only asking if there is a setting somewhere that allows us to set it up so the images appear like they did before.

Lets break out the ruler - Top image is the same picture I used before, on my mac screen in inches at 100%. Clearly it is showing bigger than an inch. Bottom image is the same picture at 100% but on my monitor hooked up to the mac and is really over 3 1/2 inches. This is how it use to display on my mac, nice and big and sharp. I am guessing it is a retina display issue.

So without more condescending answers that help no one, is there a way to have the images display on my mac like they do on my monitor - the way they did before I had a retina display?

Legend

I'm sorry, I don't mean to be condescending. But the problem is you've paid extra for something that's actually an improvement, but now you don't want it to work any differently than what you had before.

You don't appear to understand how images and displays actually work. I'll try to provide an explanation...

Images are made out of pixels. Little squares of one and only one color each that when stacked in rows and columns together make up what we call an image.

Your display has the ability to display little lighted squares of one and only one color each (it's really a bit more complicated than this, but I'm trying to keep it simple). Stacked in rows and columns these tiny display sites make up your display screen. Before the Retina display, every square inch had roughly 100 x 100 of these display sites. Now (assuming a 15" Macbook Retina display) you have 220 x 220 of them in every square inch.

In order to fit so many more in a square inch they have to be much smaller. With me so far? Each tiny display site is 1/220 of an inch on a side, by definition.

When Photoshop displays an image, it sizes it per your guidance - you set the Zoom factor.

100% zoom - by definition - means that one pixel from an image will occupy one display site on the screen.

Can you now see how, since the display sites are much smaller on a Mac retina display, an image displayed at 100% will appear smaller?

Now here's where some additional magic comes in: The folks who programmed your operating system and browser realized that you would probably not like to see everything less than half the size it was, so they automatically use 200% (or more) zoom behind the scenes so that the pictures and stuff on web pages and application controls are displayed nice and big. This happens with older non-retina applications automatically as well - it's called pixel doubling.

To directly answer your question:

Set an appropriate zoom level in Photoshop to make the image as large as you'd like to see it and you will be fine.

It may help you to feel better to think, when you see the sharp edges of the pixels at zoomed-in sizes, that you have a display that's got such high resolution and is so accurate that you can see the edges of the actual pixels, while all the folks who don't have Retina displays are just seeing them blurred together.

-Noel

Participant

Thanks for the insight, since I just started designing yesterday you've been a great help! I'll go ahead and post the answer to our problem down below. Now to find a youtube tutorial on adding this mask layer thingy, or maybe it's layer mask? Hopefully the tutorial tells me.