Photoshop: How do I design HiDPI/Retina and non-HiDPI assets for web?

  • 9
  • Question
  • Updated 3 years ago
  • (Edited)

I have just updated my iMac to the new 5k Retina Display and designing for web in impossible.

I spoke on the phone to an advisor who couldn't really help and told me that only Windows has support for Hi Resolution displays.

When it comes to design, a lot of the industry and hobbyists use Mac to it's a shame that there is no support right now.

As with the nature of technology, this is only the start and it won't be long before resolutions get even higher.

Photoshop needs the ability to be able to scale content to match all displays, while still making the most of the hi resolution display, not simply increasing the size of the pixels to fill out the same area.

Right now, it is impossible for me to work on my Mac for web design (I'm sure print would be fine) and after spending almost £2000 to upgrade it really is a shame.

I hope support for high resolutions gets implemented soon.

P.s. This isn't a problem with the UI, this looks beautiful and crisp on a 5k display, I'm only talking about the content.

Photo of Lee Buckle

Lee Buckle

  • 7 Posts
  • 0 Reply Likes

Posted 5 years ago

  • 9
Photo of Jeffrey Tranberry

Jeffrey Tranberry, Sr. Product Manager, Digital Imaging

  • 16406 Posts
  • 2615 Reply Likes
Official Response
Hi Lee,

Sorry, you were given the wrong information.

Photoshop supports scaling Photoshop's application UI for hiDPI/Retina displays on Macintosh using Photoshop CS6 or later.

If you're referring to the scale of the document window, you should design everything at twice as big, and use Adobe Generator or Extract Assets to generate 1x and 2x assets. Hopefully these blog posts are helpful:

(Smart Objects scale with output with the latest updates, but I think a better strategy is to design at 2x and scale down, rather than up)