Designing Retina Web Graphics in Photoshop: Should You Work at 1x or 2x?(

over 6 years ago from Dan Rodney, instructor, web developer, designer

  • Dan RodneyDan Rodney, over 6 years ago

    Chris Keith, thank you for such a thoughtful and well thought out response. You didn't have to spend time writing such a detailed and well formatted response, but you did and I thank you as well. This is the type of discussion I was hoping for!

    I can see where you're coming from and you make some good points. I do believe that designers should be working on a 2x display now (or will be at some point), so that influences my judgment of these topics. I see 2x as becoming the standard and 1x becoming irrelevant (it's just a matter of when). Phones/tablets are all 2x, but desktops will lag behind with 1x displays for years.

    1. Display Quality I personally think it's important to see the full quality when judging graphics, type, etc. so for me this a big one. I can understand how some people might not think so, but I can't stand designing at 1x on a 2x display because I know I'm not seeing an accurate display. I'm creating fewer and fewer 1x graphics as time goes on, so I'd rather see what I'm really creating (2x graphics) rather than being limited to 1x. To me it's about looking to the future.

    The math thing is clearly the biggest argument against designing at 2x. I totally get that and understand that bothers many people. I don't mind working in even amounts (I don't see it as a hassle), but I can understand how some people would. In the end, to give specs to developers you don't have to do the math to divide by 2 if you reduce the Photoshop file by 50%. Photoshop will do all the math for you. But you do have to work in even amounts to make sure the math will work out properly.

    2. Previewing on Mobile Devices Again it's a preview quality thing, not really a zoom thing (which isn't a big deal). But if the pixelated display on your Mac/PC doesn't bother you, then I can see how this wouldn't either. I want to see exactly what I'm creating, not just a low-res preview of it.

    3. Using Adobe Generator to Generate 2x and 1x Assets I again think about how I'm creating fewer and fewer 1x graphics. I'd rather see and ensure my 2x graphics look good so I know they'll export properly. If 2x is mostly what I'm exporting, why would I want to look at my file in a lower resolution? And I don't always have the luxury of source assets that are way beyond 2x. Sometimes, but not always. Maybe your clients get you better assets :)

    4. Zoom Level This is the least important of all the issues. I believe that we will all have 2x displays at some point (if we don't already have one). So I judged this issue based on what is ideal for designing on a 2x display. Working on a 2x display in a 2x file you just hit the keystroke for 100%, which is why I chose that as the winner. Yes a 2x file on a 1x display is the worst for a zooming keystroke, but that will just make you want to get a 2x display faster :)

    I hope that further explains my approach. Thank you for sharing yours, I really do appreciate it. And I agree that Adobe is totally moving towards Adobe XD. It's just going to take awhile for that to be ready for production work. I very much look forward to when it is!

    1 point