Highlighted

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

Explorer ,
Jun 30, 2013

Copy link to clipboard

Copied

Hello, I'm using photoshop CC on amacbook pro retina. I mainly use photoshop for web design and when I open a document that is 300x200 px, the 100% view is too small on screen. Any ideas, It was this way on PS cs6 also before I upgraded. I just tried to delete the prefs file and restarted PS and it did not change. I have also tried to change my screen resolution to "best for retina" and it is still the same.

Steve

Adobe Community Professional
Correct answer by D Fosse | Adobe Community Professional

...and just for kicks, I started to read from the beginning of this endless thread. It turns out that the whole "problem" was fully explained inside 20 posts or so. The rest of the thread, 360 or so posts by now, is just repetition, over and over and over again.

This one, post #20, from Noel Carboni, gave me an acute sense of déjà vu...

NC.png

And two posts later, he went all in with a detailed and comprehensive rundown on every aspect of high resolution displays. Read it, everyone, please. And when you've read it, read it again, and again, until it's understood:

https://forums.adobe.com/message/5601271#5601271

Case closed, you might think...

TOPICS
FAQ

Views

234.7K

Likes

Translate

Translate

Report

Report
This conversation has been locked.

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

Explorer ,
Jun 30, 2013

Copy link to clipboard

Copied

Hello, I'm using photoshop CC on amacbook pro retina. I mainly use photoshop for web design and when I open a document that is 300x200 px, the 100% view is too small on screen. Any ideas, It was this way on PS cs6 also before I upgraded. I just tried to delete the prefs file and restarted PS and it did not change. I have also tried to change my screen resolution to "best for retina" and it is still the same.

Steve

Adobe Community Professional
Correct answer by D Fosse | Adobe Community Professional

...and just for kicks, I started to read from the beginning of this endless thread. It turns out that the whole "problem" was fully explained inside 20 posts or so. The rest of the thread, 360 or so posts by now, is just repetition, over and over and over again.

This one, post #20, from Noel Carboni, gave me an acute sense of déjà vu...

NC.png

And two posts later, he went all in with a detailed and comprehensive rundown on every aspect of high resolution displays. Read it, everyone, please. And when you've read it, read it again, and again, until it's understood:

https://forums.adobe.com/message/5601271#5601271

Case closed, you might think...

TOPICS
FAQ

Views

234.7K

Likes

Translate

Translate

Report

Report
Jun 30, 2013 2
395 Replies 395
LEGEND ,
Jun 30, 2013

Copy link to clipboard

Copied

Photoshop has adjusted the software to compensate for retina increased resolution.  100% view should be accurate.  Other programs with out compensation may look 2X bigger.

Likes

Translate

Translate

Report

Report
Jun 30, 2013 1
Explorer ,
Jun 30, 2013

Copy link to clipboard

Copied

Thanks for your reply but something is wrong, see the attached screen shot. this is a 300px x 200px image, way too small on screen.

Screen Shot 2013-06-30 at 12.17.59 PM.png

Likes

Translate

Translate

Report

Report
Jun 30, 2013 2
LEGEND ,
Jun 30, 2013

Copy link to clipboard

Copied

OK, I am having a brain fog, but it is a mac thing.  You need to turn off a feature so it displays normally like a window rather than what you are seeing.  Does that ring any bells?

Likes

Translate

Translate

Report

Report
Jun 30, 2013 0
LEGEND ,
Jun 30, 2013

Copy link to clipboard

Copied

Think it is called the Application Frame. 

Likes

Translate

Translate

Report

Report
Jun 30, 2013 0
Explorer ,
Jul 01, 2013

Copy link to clipboard

Copied

yeah its called Application Frame, I toggled it and it makes no difference.

Likes

Translate

Translate

Report

Report
Jul 01, 2013 0
Guru ,
Jul 01, 2013

Copy link to clipboard

Copied

Maybe I'm misunderstanding your issue. That looks about correct for a 200px X 300px on a MacBook Pro retina at 100%.

You can View> 200% to see approximately how the image would display on on a non-retina device.

Likes

Translate

Translate

Report

Report
Jul 01, 2013 1
LEGEND ,
Aug 15, 2013

Copy link to clipboard

Copied

The image in the screenshot is 300px by 200px so View > 100% seems to work exactly as intended (one image pixel is represented by one screen pixel).

Like Charles Badland pointed out you can use another magnification if 100% does not meet your needs.

Likes

Translate

Translate

Report

Report
Aug 15, 2013 1
Explorer ,
Aug 15, 2013

Copy link to clipboard

Copied

Unfortunately that is not the answer – at 200% it's pixelated. I need to work in the resolution that the user (and I) will see.

It's straightforward – when you view the page/image in Safari/Firefox/Chrome you see it at 100%. It should be appearing at the same resolution in Photoshop, not the 50% (or thereabouts) that it is.

Likes

Translate

Translate

Report

Report
Aug 15, 2013 18
LEGEND ,
Aug 15, 2013

Copy link to clipboard

Copied

View > 100% is intended to display the image so that one image pixel is being represented by one screen pixel regardless of your screens resolution.

How do you work with screens of different resolutions and expect pixel images of certain pixel-dimensions to be displayed identically?

Likes

Translate

Translate

Report

Report
Aug 15, 2013 1
LEGEND ,
Aug 15, 2013

Copy link to clipboard

Copied

It's straightforward – when you view the page/image in Safari/Firefox/Chrome you see it at 100%.

Sorry, I missed that … are you saying the images are upsampled when displayed by the browsers when displaying on your retina display?

Edit: While this could of course cause confusion/irritation in my opinion it does not change the fact that Photoshop’s 100% display size seems to work just as intended.

Likes

Translate

Translate

Report

Report
Aug 15, 2013 0
Explorer ,
Aug 15, 2013

Copy link to clipboard

Copied

It seems more that the images are downsized in Photoshop. Everything appears as you would normally expect in the browser, but when you see it in Photoshop its significantly reduced.

Likes

Translate

Translate

Report

Report
Aug 15, 2013 5
LEGEND ,
Aug 15, 2013

Copy link to clipboard

Copied

It seems more that the images are downsized in Photoshop.

No.

When you open your pmlink360’s (edited) screenshot and measure the image area you will notice that is is 300px by 200px.

View > 100% means that one image pixel will be represented by one screen pixel (as mentioned before) and that means that on a screen with smaller pixels this will naturally result in a smaller display of an image of certain pixel dimensions.

If the browsers you mentioned detect the screen resolution and upsample the image that may be fine for them (to test please make a screenshot and measure the actual pixel dimensions of the image) but for Photoshop as a pixel oriented image editor resampling the image for a 100% view would seem an odd choice.

Likes

Translate

Translate

Report

Report
Aug 15, 2013 0
New Here ,
Aug 01, 2013

Copy link to clipboard

Copied

I'm having this exact same issue. I'm using Photoshop CC on a Macbook Pro with Retina display. When I am editing images, the resolution image size says that it is enormous but the actual editing view shows it at nearly half the size. Zooming in doesn't fix it -- everything is just blurry as if the image is actually tiny. When I save as a jpg, the image saves in the correct size, but it's impossible to properly edit before.

Any help for this issue would be very appreciated! Thanks.

Likes

Translate

Translate

Report

Report
Aug 01, 2013 12
Explorer ,
Aug 15, 2013

Copy link to clipboard

Copied

Yep, I'm the same – I'm needing to have a second monitor attached so I can make sure I'm seeing it at the same size other people will. It's wierd, but when you move the application window from a retina screen to a traditional screen, all the elements (palattes, menu items, toolbars) remain proportionally the same, but the image increases to the right size. Then when you take it back to retina, it does a "minimise" for the image, while everything else fits.

Would be nice if there was some way to change the resolution/appearance of the workspace, because you can't develop for the web like it is.

Seems like I'm missing something.

Likes

Translate

Translate

Report

Report
Aug 15, 2013 5
Community Beginner ,
Aug 15, 2013

Copy link to clipboard

Copied

I just upgraded to a new Retina Display MacBook Pro and had this problem start today as well. Here is a screenshot of an image I found online that is 1280x720. On the web it is huge compared to the same image opened in photoshop at 100%. SS.jpg

Likes

Translate

Translate

Report

Report
Aug 15, 2013 13
Explorer ,
Aug 15, 2013

Copy link to clipboard

Copied

That describes it much better than I – thanks for the contribution Adam.

Now, if we can just find someone to help/explain/sort out.

Likes

Translate

Translate

Report

Report
Aug 15, 2013 5
Adobe Community Professional ,
Aug 15, 2013

Copy link to clipboard

Copied

In Photoshop, 100% means each pixel you see on the screen is one pixel of the image. A 15-inch Retina display has 227 pixels per inch. A 200-pixel by 300-pixel image at this resolution then is 200 ÷ 227, or 0.88 inches, by 300 ÷ 227, or 1.32 inches. pmlink360's screen shot shows this.

Likes

Translate

Translate

Report

Report
Aug 15, 2013 1
Explorer ,
Aug 15, 2013

Copy link to clipboard

Copied

I'd be surprised that Adobe weren't aware of this and therefore provide some ability to be able to display a graphic as it would appear on different devices. All well and good to be literal in their interpretation of the resolution, but not much help when you're designing for the large variety of screens out there.

Likes

Translate

Translate

Report

Report
Aug 15, 2013 3
LEGEND ,
Aug 16, 2013

Copy link to clipboard

Copied

What's the problem with using 200%?

What does "It's pixelated" mean?  Your Retina display is so sharp it doesn't blur blocks of 2 x 2 pixels together as well as a 100 ppi display.

Let me get this straight...

You bought a display with pixels that are half the size of a run-of-the-mill 100 ppi display - ON PURPOSE, presumably so you could see things more sharply -  and now you're complaining that things shown at 100% pixel for pixel are too small or that zoomed displays are too sharp.

Thanks for making me smile. 

-Noel

Likes

Translate

Translate

Report

Report
Aug 16, 2013 1
LEGEND ,
Aug 16, 2013

Copy link to clipboard

Copied

Noel Carboni wrote:

…Thanks for making me smile. 

The original post already gave me a hearty belly laugh, from its very first line. 

Likes

Translate

Translate

Report

Report
Aug 16, 2013 0
LEGEND ,
Aug 16, 2013

Copy link to clipboard

Copied

I wonder if some people might think of »pixel« as a measurement unit for size.

Likes

Translate

Translate

Report

Report
Aug 16, 2013 0
New Here ,
Feb 16, 2015

Copy link to clipboard

Copied

You people don't understand. And making fun of us really pisses me off. This is a real bug that I can't fix no matter what I try. I know what 300 pixels across should look like. But Photoshop reduces it to half the size, but still displays it as 100%. When you zoom in to 200% it becomes pixelated, despite Retina. This makes accurate editing impossible.

Likes

Translate

Translate

Report

Report
Feb 16, 2015 2
Adobe Community Professional ,
Feb 16, 2015

Copy link to clipboard

Copied

No one is laughing. Our job is to help people who are great designers that have little time to be software techs.

Regular screens are 110 pixels per physical screen inch, Retina is 220 pixels packed into its physical screen inch.

So a 110 pixel image shows up as an inch on a normal screen and 1/2 inch on a Retina screen at 100%

If you are designing for 110 screens, using a 220 screen causes this problem.

So you can Cmd-i on your Photoshop.app and check "Open in Low Resolution" or connect an external 110 monitor to your Mac Retina for Web design.

Gene

Likes

Translate

Translate

Report

Report
Feb 16, 2015 1
New Here ,
Feb 21, 2015

Copy link to clipboard

Copied

I have found a solution.  Find the application in finder.  Right click on it and Get Info.  Check open in low resolution (see attached). 

I prefer it this way, as I am used to double clicking the magnifying glass to go to 100%.  This shortcut saves me so much time, I wouldn't want to be manually have to increase it to 200% every time I wanted to be at default zoom.

Screen Shot 2015-02-21 at 18.43.35.png

Likes

Translate

Translate

Report

Report
Feb 21, 2015 1
New Here ,
Mar 08, 2015

Copy link to clipboard

Copied

Hi everyone,

I can't seem to find the 'Open in low resolution' check box at all - Can anyone help me please? Screen Shot 2015-03-09 at 14.44.45.png

Likes

Translate

Translate

Report

Report
Mar 08, 2015 0
Adobe Community Professional ,
Mar 08, 2015

Copy link to clipboard

Copied

You have to go inside that folder, select Photoshop CC 2014.app, and cmd i on it to see the "Open in low resolution" check-box.

Likes

Translate

Translate

Report

Report
Mar 08, 2015 0
Community Beginner ,
Jul 05, 2015

Copy link to clipboard

Copied

Hello, I wish my answer will help you all.

I have experienced a lot with web designing on a retina macbook pro.

And i finally found a way to deal with this issue.

Right now i'm designing a website and i need my website to have a 1000px width. when viewing the design on 100% it looks perfect but it's way too small on the screen. And if i zoomed in to 200% the whole design become blurry and the antialiasing is really really bad.

So, to solve this issue, i created a document with 1280px width and a 2000px height per example (height doesnt matter) and 72ppi resolution and i clicked "OK".

after that i entered the image size window (cmd+alt+i) and i changed the width propotionally to 2280px and clicked "OK" and here it is now i'm working on my website design with a perfect retina display on 100%.

Now, when i want to deliver the design to a developper, i can simply change back the width propotionally to 1280px and send it to him as a .psd file. and we're done

Hope this helped you out guys.

Likes

Translate

Translate

Report

Report
Jul 05, 2015 0
New Here ,
Jul 23, 2015

Copy link to clipboard

Copied

@Vince - This still pixelates the image and it is still not as clean and crisp as it should be.

Has anyone found a REAL solution to this? This thread was started over 2 years ago and I've been searching over a week now and getting ready to throw my Macbook out the window.

Likes

Translate

Translate

Report

Report
Jul 23, 2015 1
Mentor ,
Jul 23, 2015

Copy link to clipboard

Copied

Just hook up a second non-retina screen, and use that to work on?

Likes

Translate

Translate

Report

Report
Jul 23, 2015 0
Community Beginner ,
Jul 28, 2015

Copy link to clipboard

Copied

‌if I was to buy a 2560 x 1440 external monitor, can I change the settings to say 1080 And get a 1:1 relationship between PS and web?

Likes

Translate

Translate

Report

Report
Jul 28, 2015 0
Mentor ,
Jul 28, 2015

Copy link to clipboard

Copied

AndyBarnes wrote:

if I was to buy a 2560 x 1440 external monitor, can I change the settings to say 1080 And get a 1:1 relationship between PS and web?

That would be a bad idea: the interpolation would cause the pixels to look blurry. If the screen you mentioned is a 27" or 30" screen (non-retina) the native resolution would be 1:1 in Photoshop anyway.

Likes

Translate

Translate

Report

Report
Jul 28, 2015 0
New Here ,
Aug 16, 2015

Copy link to clipboard

Copied

So far the Open in Low Resolution option works fine for me. I'm a bird photographer so being able to see the feather detail as others would is crucial. that's hard on the retina when the size of the image on the screen is reduced so much.

Likes

Translate

Translate

Report

Report
Aug 16, 2015 0
Community Beginner ,
Sep 09, 2016

Copy link to clipboard

Copied

We can set the dimensions at 2x the final size for new art or begin each new piece at 200% in the image size menu, but that doesn't help us in updating older files that were designed on previous Mac displays. For those of you about to comment with "just redesign the older files," please don't.

What pmlink was hoping for, like myself, was a designer who has found a pref that compensates for retina display at 200%(+) without distortion so that we can see the details of what we've designed, as we're designing it. If you work in Adobe design apps regularly and have experienced both retina and other displays in you're design process, you'd understand what we're needing.

For those who have belittled pmlink360 and maheshwar26 (both of whom have most def blocked notifs to this forum), I'm betting that you're not designers and/or have not experienced the issue first-hand, which begs the question: why are you posting insight on something you have no experience in? And yes, please reply with a completely insulting answer to that question like the previous comments that prompted me to type this.

Cheers

Likes

Translate

Translate

Report

Report
Sep 09, 2016 1
LEGEND ,
Sep 09, 2016

Copy link to clipboard

Copied

Yes, I have a retina display, (and a 2nd standard display) and I do build web sites and create other assets for use on large screen, (55 inch 4k) displays, so I do know the problem.

So this makes your reply insulting to me.

Likes

Translate

Translate

Report

Report
Sep 09, 2016 0
Community Beginner ,
Sep 09, 2016

Copy link to clipboard

Copied

Then what's the solution?

It's not very clear in your reply what I said to insult you. I'm thinking

you're a web designer/developer, and perhaps you knew the issue and

provided a solution, which would exclude you from my very slightly

insulting remarks to those who really could use some backlash. If you

provided an answer, it's not showing conveniently enough for people who

don't have time to flip through nine pages of rude comments to locate it.

Also, the discussion is labeled "not answered" so I'm definitely not

reading through all that.

I apologize if my initial comment was misread by you or anyone else. I

thought I was pretty clear on who I was referring to. It was also a direct

reply to Noel's comment.

Wishing you the very best, pziecina

Likes

Translate

Translate

Report

Report
Sep 09, 2016 0
LEGEND ,
Sep 09, 2016

Copy link to clipboard

Copied

If you look at the 4 post previous to your original, you will see that a few of them where provided by me, that is why I assumed that when you said 'previous comments' you where referring to mine.

The truth is there is no answer that will work satisfactorily if you only have one monitor. I am lucky in that I can have 2 monitors connected, (hi-dpi and standard) that I can simply switch my graphics card output to via the cards app, and have the system settings required automatically applied, (Windows system), and a similar set-up, is I have been told possible for Mac.

It is impossible for a hi-dpi display to display the same as a standard display. I am probably lucky in that I knew about the problems a number of years ago, so I did not update to a hi-dpi until I had a graphics card that would support how I would have to work.

The problem is not just limited to Ps users, as those producing videos are now experiencing the same problems, (standard, hd. uhd), the only programs that do not have the problem are vector based, (such as Illustrator) and text based, (such as pure code editors, word processors). For Ps and those who cannot use two monitors the only solution I can think of that may possibly work, would be to provide a 'standard definition' workspace that would zoom the images and apply image correction to optimize the image automatically when selected.

The disadvantages of this though, are that -

a: It would limit the image corrections that could be applied, (the software is already optimizing).

b: It would not work for all images, and certainly not for images that had any 'special effects' applied, (though css/svg can now apply many of these in the browser.

c: Moving back to a hi-dpi image, often requires more work to be done on the image than most people are aware of, (this is one of the reasons why I suggest starting with the highest ppi image required).

Now for the controversial part.

If Adobe does not allow me to create and work with hi-dpi images, users like me will complain just as much as those not creating hi-dpi images, and those who do not use the 1.5X, 2X method, (like me) will also complain.

So any suggestions how all types of user can be accommodated?

Likes

Translate

Translate

Report

Report
Sep 09, 2016 1
Community Beginner ,
Sep 09, 2016

Copy link to clipboard

Copied

Ok so this is a misunderstanding because when I open the landing page of

the discussion, page 1 of 9, your comments aren't showing. And when I

replied directly to Noel's latest comment on pg1, it was placed at the very

end of the thread, which happened to land under your comments on pg9. Glad

we could clear that up.

Thank you for providing this info. It's unfortunate it took nine pages,

hurt feelings, misunderstandings, and who knows how much time among us all

to find out there's no sensible solution that works for everyone and

therfore anyone.

Pziencina, you have been most helpful. Thanks for your patience and insight

Likes

Translate

Translate

Report

Report
Sep 09, 2016 0
LEGEND ,
Aug 15, 2013

Copy link to clipboard

Copied

I just upgraded to a new Retina Display MacBook Pro and had this problem start today as well. Here is a screenshot of an image I found online that is 1280x720. On the web it is huge compared to the same image opened in photoshop at 100%.

And yet the image in Photoshop is 720px high.

As you said it is.

So the browser must have upscaled it, mustn’t it? 

Likes

Translate

Translate

Report

Report
Aug 15, 2013 0
Community Beginner ,
Aug 16, 2013

Copy link to clipboard

Copied

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?

Ruler.jpg

Likes

Translate

Translate

Report

Report
Aug 16, 2013 10
LEGEND ,
Aug 16, 2013

Copy link to clipboard

Copied

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

Likes

Translate

Translate

Report

Report
Aug 16, 2013 21
Community Beginner ,
Aug 16, 2013

Copy link to clipboard

Copied

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.

Likes

Translate

Translate

Report

Report
Aug 16, 2013 3
Adobe Community Professional ,
Aug 16, 2013

Copy link to clipboard

Copied

adamleewermuthmavs wrote:

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?

Plug in a regular monitor into the HDMI port, and use that.

Likes

Translate

Translate

Report

Report
Aug 16, 2013 3
New Here ,
Jan 18, 2014

Copy link to clipboard

Copied

I agree, this is really effecting more work! Bought a new macbook pro 15 and upgraded to cc...now I am disabled with this small image size.

Likes

Translate

Translate

Report

Report
Jan 18, 2014 0
LEGEND ,
Jan 18, 2014

Copy link to clipboard

Copied

Please try and describe why selecting 200% zoom to view your design doesn't fit your needs.

Or why you can't upsample a screen grab by 200% if you want to work at double size.

-Noel

Likes

Translate

Translate

Report

Report
Jan 18, 2014 1
Mentor ,
Jan 19, 2014

Copy link to clipboard

Copied

Noel Carboni wrote:

Please try and describe why selecting 200% zoom to view your design doesn't fit your needs.

Or why you can't upsample a screen grab by 200% if you want to work at double size.

-Noel

Once again, Noel, this is about workflow - and what you proposing are workarounds, no real solutions. Designers expect the relative size of the browser @100% result to match Photoshop's 100% zoomed view. It's as simple as that.

Which is not the case currently. This confuses the user. That is why I proposed that temporary solution to just set an appropriate ppi resolution in the prefs, and use the other shortcut to zoom at "100%".

And upsampling is no solution at all when you also have to work with multiple assets for different platforms at several resolutions either.

Anyway, two sides of the same coin here, really. You come from a more programmatic background, correct? Designer's tend to think more visual in their workflow - and with retina screens some workflow discord was introduced once more.

Sooo.... The best A solution would be a simple checkbox in the preferences, or a "proof web" option in the view options that would allow designers who design web layouts to work either way.

Whether we like it or not, the rules have changed with high ppi screens and responsive layouts, and the applications as well as the users have to adapt to these changes. Photoshop never has been, and is not, great for web layouts - currently, I feel it is lagging behind very badly.

Which is why if anyone asks me, I would avoid Photoshop for web layout creation as it stands - there are too many limitations and the workflow is absolutely silly for that type of work. I really do not understand why anyone would want to design web layouts in Photoshop at this point.

Likes

Translate

Translate

Report

Report
Jan 19, 2014 2
Explorer ,
Jan 20, 2014

Copy link to clipboard

Copied

I agree with you fully, I don't see that we are asking for much here!!

One thing though - and please don't take this as an arguement - I'm curious and though curiousity comes discovery.

I've used Photoshop since day one for web layouts, I'd say currently high ppi screens + Photoshop + web-design is an 'avoid' but I'm not sure about it being bad for web-layouts, never really had any big issues until now. What would you suggest / What do you use??

Herbert2001 wrote:

Photoshop never has been, and is not, great for web layouts - currently, I feel it is lagging behind very badly.

Which is why if anyone asks me, I would avoid Photoshop for web layout creation as it stands - there are too many limitations and the workflow is absolutely silly for that type of work. I really do not understand why anyone would want to design web layouts in Photoshop at this point.

Likes

Translate

Translate

Report

Report
Jan 20, 2014 0
New Here ,
Jan 28, 2014

Copy link to clipboard

Copied

I am using a MBP Retina with photoshop Creative Cloud. I have a document that is 160px wide. I have confirmed in the image size dialog (cmd+alt+i) that the document itself is 160px wide. When I display it at 100% in photoshop, I take a selection screen shot, and it says the area is only 80px wide. Any ideas?

Likes

Translate

Translate

Report

Report
Jan 28, 2014 0
LEGEND ,
Jan 28, 2014

Copy link to clipboard

Copied

Please post the screenshot.

Likes

Translate

Translate

Report

Report
Jan 28, 2014 0
Explorer ,
Jan 28, 2014

Copy link to clipboard

Copied

This is correct. The easiest way to digest this is think about how when you zoom out from an image, the pixels get tighter and more dense. Basically this is how retina operates.

Yes your image is 160px, but the Retina doubles up on everything, so your image takes up 80pixels of screen real estate on a retina display.

I do UI/UX for iOS. When I work on an app, I create two images. One for retina displays, and one for non retina displays. Lets say I have a logo that 250px x 100px.

So I create two files:

logo.png (non-retina version, with a dimension of 250px100px)

and

logo@2x.png (retina version, with a dimension of 500px200px)

However, the pixel coordinates where I place it on the screen adheres to regular, non-retina resolution (Retina uses x2 images, but packs them into the same old school resolution size of a display).

So I take my logo.png (or logo@2x.png), and I'll still place it 20 pixels from the left of the screen, and 20 pixels at the top, because Retina uses the same mapping as a regular non-retina display.

Yes, this sucks for so many reasons if you use Photoshop. I really could care less about Retina, but that's all that Apple now sells on the Macbook Pro line.

Likes

Translate

Translate

Report

Report
Jan 28, 2014 3
LEGEND ,
Jan 28, 2014

Copy link to clipboard

Copied

Yes your image is 160px, but the Retina doubles up on everything, so your image takes up 80pixels of screen real estate on a retina display

You seem to be using the term »pixels« with two different meanings in that sentence.

Likes

Translate

Translate

Report

Report
Jan 28, 2014 0
Explorer ,
Jan 28, 2014

Copy link to clipboard

Copied

Nope. It's correct. I'm trying to explain the disconnect between what we are normally used to versus the slight of hand that a Retina display is doing.

Under the hood, it would work like this...

Image is called logo@2x.png, and the image is 160px x 160px. I have a Retina canvas that is 1024x768 (it's actually 2048x1536, but you map it like it was 1024x768).

.imageSample {

     background: url(logo@2x.png);

     width: 80px;

     height: 80px;

     background-size: 80px 80px;

     top: 20px;

     left: 20px;

}

You'll see that even though I have a 160px wide image, I tell the image to behave in a non-retina environment and positioning.

Likes

Translate

Translate

Report

Report
Jan 28, 2014 4
Mentor ,
Jan 28, 2014

Copy link to clipboard

Copied

On a side note, I am very hopeful that EvolveUI will finally fill that void for us UX designers/web designers and web developers. It sounds awesome. http://tribaloid.com/

As for what Aaron is saying: yep, you are correct.

Likes

Translate

Translate

Report

Report
Jan 28, 2014 1
Community Beginner ,
Jun 23, 2014

Copy link to clipboard

Copied

Hi Noel,

So I did a little experiment on my retina display, and it turns out you are correct (to the best of my knowledge), that my Mac's OS X is doubling the size of SOME images in the browser and native Preview app.  I will attach all of the screenshots to show this.

After reading most of the comments I believe the issue people are complaining about is: Photoshop is prioritizing accuracy of displaying true pixel size, which does note create a consistent user experience of viewing images (across browsers, the native image app on a Mac "Preview", and Photoshop).  I wonder if this could be improved with a setting like "Show true pixel size on screen -or- Mimic native display behavior".  Of course seeing actual pixel size makes sense, although I do understand why people want a consistent experience in viewing images between web/native photo app/photoshop on a Mac.

Attached are the screenshots of a 200 X 200 image in my Preview app.  However, when I take a screenshot of the image in Preview, the image is 400 X 400!  That means Preview IS resizing my image, as you pointed out.  To make things even more confusing, you can see when I open a 400 X 400 image in photoshop and Preview, the sizes match without the resize from Mac's Preview app!  Other users posted sizing issues for other images, so I am not sure how the resizing is determined for which issues.

Anyways, I learned a lot from this thread, thanks everyone for your efforts and I hope my post is of help to others.

Noel - if I have anything wrong in this post, please let me know.

pixel sizing.png

200px-comparison.png400px.png

200px get info.png

Likes

Translate

Translate

Report

Report
Jun 23, 2014 1
New Here ,
Jun 24, 2014

Copy link to clipboard

Copied

I just stumbled across this and is a problem for myself being a print/web designer. I just purchased a new 15" MBP with Retina a couple days ago loaded up Adobe CC and realized I can't see a 600x600px image very well as it looks half the size as it normally would on my old 15" MBP (Very Annoying). This is no problem with my 27" monitor but I am always on the go so the laptop is my workstation more than 50% of my time. My biggest problem is at 200% what everyone seems to be talking about is no problem to some but the photo is pixelated and that does no good being a print/web designer as you are very detailed and want to work on crisp as possible images to see all the minor details. Yes you can create a bigger file and work off that / down size but that's not the point as who wants to create two separate files for each project.

Seems many have given plenty of examples of what the problem is and seems many of you are smart enough guys to figure out what the hell we are talking about.. We all are just looking for a solution.

*END RANT*

Likes

Translate

Translate

Report

Report
Jun 24, 2014 1
Contributor ,
Jun 25, 2014

Copy link to clipboard

Copied

I agree that working with a "retina" or other high resolution display is a new experience and will require some adjustment. The problem is not really that those displays are high resolution it is that there are still plenty of "low" resolution screens and people are wanting to design for an average. Standards are going to have to evolve. Really if you want to see how your image looks on a standard resolution screen you have to use a standard resolution screen to view it. If you want to see how the image looks in a web browser on a retina screen open it in a browser. That is not the same as it is interpolated up. Also the Apple 15" retina screen only displays images 1:1 or at exactly 2X when the screen resolution is set to "best for retina" 2880x1800/1440x900. If you are using one of the scaled resolutions, as I do, it gets much more complicated. It is confusing that different tools have different interpretations of the screen resolution.

Images are not going to look perfect at anything other that 100%. There is no way for PS to display images larger without interpolation, which is what Preview and Safari etc... are doing.

There is a good expatiation of the retina display in AnandTech.

AnandTech | The next-gen MacBook Pro with Retina Display Review

Likes

Translate

Translate

Report

Report
Jun 25, 2014 0
LEGEND ,
Jun 25, 2014

Copy link to clipboard

Copied

I missed seeing your post earlier, ron1972.

Thank you for the very succinct and to the point information.

The takeaway is that Apple does "magic" in various places to compensate for the high pixel density of the Retina display, but the plain and simple fact is that Photoshop is an image editor, and defines 100% to mean "one pixel of the image maps to one pixel on the screen".

While I agree it would be convenient for Mac users if they could match the "magic" in OSX, it's not reasonable to expect Photoshop to corrupt its rigorous definition of what "100%" means.

The important point to focus on is this: Adobe is not responsible for integrating your user experience across the various applications you use on your Mac.  They ARE responsible for delivering an image editor that can be used to create imagery with well-defined characteristics.  It's really up to you to understand what's happening and deal with it.  I'm sorry that the OS makes this a little less convenient than what it used to be when the display was low resolution, but you DID pay extra SPECIFICALLY for the higher resolution.

I'm very happy to see folks like ron1972 doing their own tests, wrapping their minds around what's happening, and putting up their results here to help others.

-Noel

Likes

Translate

Translate

Report

Report
Jun 25, 2014 1
Community Beginner ,
Jun 25, 2014

Copy link to clipboard

Copied

Hi Noel,

Just for clarification (because you wrote 'you' and I wasn't sure if you were writing me personally, or grouping all of us Mac users together), I agree that showing true pixel size is the priority, and now that I can see how the OS is changing image sizes (as I posted), it all makes sense and I'm happy to know that Photoshop is showing me 'the truth' when I look at images.  

I was just trying to point out what I was seeing as the cause for Mac users to be frustrated: people didn't know why (and were blaming Photoshop, which wasn't fair - Photoshop was doing it's job correctly) images looked so different between the native image apps, the browser, and Photoshop.

Reading these posts certainly has me wondering on what new design practices & procedures our company will need to adopt to give our users the best quality images (with things like bandwidth in mind).

Anyways, glad I understand what is going on now.

Likes

Translate

Translate

Report

Report
Jun 25, 2014 1
Community Beginner ,
Aug 16, 2013

Copy link to clipboard

Copied

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.htm...

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.

Screen-Shot.jpg

Likes

Translate

Translate

Report

Report
Aug 16, 2013 70
LEGEND ,
Aug 16, 2013

Copy link to clipboard

Copied

Honestly I wish you the best, but turning on a "compatibility" setting to essentially erase all the advantages of having a high PPI display to me seems to me to be the wrong approach.

At this point I'd really like to know how what you're showing in your screen grab is better (or looks better) than running in "high resolution" mode and just getting used to selecting 200% zoom to see the image larger.  I imagine the designers at Adobe would like to know as well, since they specifically added a [200%] button to cover this issue.

-Noel

Likes

Translate

Translate

Report

Report
Aug 16, 2013 1
New Here ,
Oct 14, 2016

Copy link to clipboard

Copied

What is this 200% button you mention?

Likes

Translate

Translate

Report

Report
Oct 14, 2016 0
Adobe Community Professional ,
Oct 14, 2016

Copy link to clipboard

Copied

Likes

Translate

Translate

Report

Report
Oct 14, 2016 0
New Here ,
Oct 15, 2016

Copy link to clipboard

Copied

Screen Shot 2016-10-15 at 2.43.10 PM.jpgSo, I have the same issue:

My screen shows a 800px image on a 3008px resolution monitor.

It should fit 3.75 times about.

It does fit about 7.5 times over it

I took a screenshot, and that screenshot is then 6016px in with. So why does OS X handle the monitor as 6016 px, and not 3008px?

PS and LR are probably doing everything right then, just the monitor gets interpreted as 200%. In the setting it says clearyl 3008px, and the screenshot is exact 6016px wide.

Any solution for this?

Likes

Translate

Translate

Report

Report
Oct 15, 2016 0
LEGEND ,
Aug 16, 2013

Copy link to clipboard

Copied

What could possibly be more condescending than using that offensive label to characterize others?

If I should ever lose the ability to laugh at myself and at my mistakes, I'll consider myself doomed.

Likes

Translate

Translate

Report

Report
Aug 16, 2013 1
LEGEND ,
Aug 16, 2013

Copy link to clipboard

Copied

Adam honestly doesn't see that he's making a mistake.

Perhaps for him continuity with the way things worked before is paramount, and all else secondary.  I don't understand how that can help him move forward, but to each his own.  Knowing Apple, there won't be a compatibility pixel-doubling setting forever...

-Noel

Likes

Translate

Translate

Report

Report
Aug 16, 2013 0
LEGEND ,
Aug 18, 2013

Copy link to clipboard

Copied

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?

Likes

Translate

Translate

Report

Report
Aug 18, 2013 0
LEGEND ,
Aug 19, 2013

Copy link to clipboard

Copied

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

Forget it, I noticed you downsampled the screenshot which makes it a lot less significant.

Likes

Translate

Translate

Report

Report
Aug 19, 2013 0
Community Beginner ,
Aug 22, 2013

Copy link to clipboard

Copied

After all R&D I could not find a solutions for this! Luckily I also have Thunderbolt display, I am survived some how. If not it would be really hard to eork on macbook pro with 100% view in photoshot. I tried zooming in 200%, but I hate when images get pixelated.

upgrade to Thunderbolt, till adobe can fix this.

cheers

Maheshwar Mathad

Likes

Translate

Translate

Report

Report
Aug 22, 2013 0
LEGEND ,
Aug 22, 2013

Copy link to clipboard

Copied

till adobe can fix this.

Fix what?

Pixel images are made up of pixels and the display devices represent pixels, but »pixel« is not a measurement unit of length as such.

For Photoshop to upsamle magnifications above 100% with another algorithm than »Nearest Neighbor« (or the like) would make pixel perfect working pretty difficult so it is hardly generally desirable, but according to adamleewermuthmavs the option exists.

They posted a downscaled screenshot so it is not possible for me to judge how images are actually upsampled at »100%« when »Open in Low Resolution« is chosen, though.

Likes

Translate

Translate

Report

Report
Aug 22, 2013 1
Community Beginner ,
Aug 22, 2013

Copy link to clipboard

Copied

I also saw on illustrator and the the screen is 100%! if ratina display is causing this, then illustrator also would have been affected. Or may be its vector based so not impacted?

cheers

Maheshwar Mathad

Likes

Translate

Translate

Report

Report
Aug 22, 2013 1
LEGEND ,
Aug 22, 2013

Copy link to clipboard

Copied

I also saw on illustrator and the the screen is 100%! if ratina display is causing this, then illustrator also would have been affected.

Basically: No.

Is it news to you that vector and pixel based applications work differently?

Quote from the reference:

About monitor resolution

Your monitor’s resolution is described in pixel dimensions. For example, if your monitor resolution and your photo’s pixel dimensions are the same

size, the photo will fill the screen when viewed at 100%. How large an image appears on-screen depends on a combination of factors—the pixel

dimensions of the image, the monitor size, and the monitor resolution setting. In Photoshop, you can change the image magnification on-screen,

so you can easily work with images of any pixel dimensions.

Photoshop’s View > 100% is not intended to display an image at a certain size in inches or cm (according to its resolution), but to represent one image pixel by one screen pixel.

So how would the feature need fixing?

Edit: Have you checked out View > Print Size?

Likes

Translate

Translate

Report

Report
Aug 22, 2013 0
Community Beginner ,
Aug 22, 2013

Copy link to clipboard

Copied

There is no difference in '100% view' and 'Print size' both shows same size!

Likes

Translate

Translate

Report

Report
Aug 22, 2013 0
LEGEND ,
Aug 22, 2013

Copy link to clipboard

Copied

Have you set the correct »Screen Resolution« in Photoshop > Preferences > Units & Rulers?

Likes

Translate

Translate

Report

Report
Aug 22, 2013 1
Community Beginner ,
Aug 22, 2013

Copy link to clipboard

Copied

Maheshwar Mathad SS.jpg

Likes