Sidebar Sidebar
Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

Graphic / web design - Retina or not-Retina

W

w41uigi

macrumors newbie
Original poster
Feb 17, 2013
4
0
Hi guys,

It's been a few months since I'm thinking about replacing my 24" iMac with something new and portable. And after Apple drop prices of 15" retinas the decision became harder.

What I mainly do on my computer is developing web applications and sites, so browser, code editor and Adobe Illustrator (sometimes Photoshop) is one of my main tools.
And now, I'm wondering is it good solution to but retina MBP? It's is a really hard decision now, mainly cause the prices in my country at the moment are the same for both models.

As I said, I use Adobe software a lot, I read that everything is now converted for the retina display, but how it looks from designer perspective?
a. When I open in AI 500x500px document, and "save it for web and devices" for example, It will be 500x500 or 1000x1000[px] in real ?
b. I mean, I can't find the answer that dimension in AI/PS are retina values or standard pixels (50x50 on low-res display is 50x50 or 100x100)?
c.Working in AI or PS is somekind of pain, especially when designing web elements ?

So what do you guys think? Go for a new one or just for mbp 15" antiglare hires?

And i read a lot on this forum and a lot of articles but most of them are from the time before AI and PS was retina-ready, and now most apps are, so I think this threaded can be interesting in some ways.

Take care!
 
I have a 15" rMBP 2.6 and I use it everyday. Depending where I am at work I hook it up to 2 external displays, at home I use it as it.

70% of the time I'm staring at my IDE (Sublime Text) or a terminal console, when I do get a chance to design, I have no problem at all.

I run the resolution at 1920 x 1200 just so I can have that extra screen real estate.

Creating common UI elements (buttons, icons) I have no problem whatsoever.

Go with the Retina! :)
 
But how is it to design in 72 dpi on the retina display? Is it super tiny and/or fuzzy when viewing the correct size?

Let's say that you start a web design with a file of 1400x1400px. Will the canvas then be 700x700? And then you have to zoom in to 200% or?
 
Then everyone will see a 1400x1400 image, and the retina MBP will blow it up to a 2800x2800 image. Unless you include retina specific code in your webpage.
 
Yeah I know. But how is the workflow when designing for 72 dpi. If you choose 1680x1050 or 1920x1200 can you then design the way you alway used designed in Photoshop - or does it still double the resolution?
 
Okay, so you have to work on a tiny canvas when designing to 72 dpi? I mean - you have to zoom in to 200% to see the initial size - the way it would look in the browser? How does it look at 200% ??
 
defektion said:
as request
http://d.pr/i/lh7G/1TgQjjCW

400 x 300, 200% zoom.

There is some pixelation, but it doesn't bug me.

When I work in a retina optimized websites, I scale everything up 2x
Click to expand...

Hmm actually it doesn't look that bad.

Is it fuzzy in real life? It can be hard to make out from a screenshot. I mean would you be fine with designing a non-retina website in photoshop?
 
KimHansenDK said:
Hmm actually it doesn't look that bad.

Is it fuzzy in real life? It can be hard to make out from a screenshot. I mean would you be fine with designing a non-retina website in photoshop?
Click to expand...

It is slightly pixelated, but I can look past it

Absolutely, I'm fine designing non-retina websites in photoshop. I just know when I take it into html/css, I can use CSS3 to accomplish a lot of the things I need or if I need to USE svg's. As long as you don't rasterize your shapes, vectors, or anything you would be fine becasue then you can scale thing up and have 2 sprite sheets (1 retina optimized, 1 for normal screens)
 
KimHansenDK said:
Great.

I think I will be buying a Retina MacBook Pro then.

Thanks :)
Click to expand...

No Problem, one of the thigns that sold me on my Retina MAcbook Pro was the ability to have more than 1 external display hooked into it. As I treat my Retina Macbook Pro as a desktop replacement for my work computer.
 
My main concern is whether the retina will be good enough as my main machine. I will be using it without an external monitor at home - but will be hooking it up to 2x27" monitors at work.

But seeing as I recently became a dad, and therefore sold my iMac that I had upstairs, I will be using the laptop in the living room - when I get some time once in a while :)
 
I agree, need that external for web layout. For most of my dev work, it doesn't matter, but I do final CSS tweaks and graphic slices off of the High DPI retina display.
 
KimHansenDK said:
My main concern is whether the retina will be good enough as my main machine. I will be using it without an external monitor at home - but will be hooking it up to 2x27" monitors at work.

But seeing as I recently became a dad, and therefore sold my iMac that I had upstairs, I will be using the laptop in the living room - when I get some time once in a while :)
Click to expand...

Are both your 27" monitors at work 2560 x 1440?

One thing that I would let you know that the HDMI port only has a maximum output of 1080p (or 1920 x 1200) althought it is a HDMI 1.4 port the software (OS X) limits it to a 1080p output.

:)
 
defektion said:
Are both your 27" monitors at work 2560 x 1440?

One thing that I would let you know that the HDMI port only has a maximum output of 1080p (or 1920 x 1200) althought it is a HDMI 1.4 port the software (OS X) limits it to a 1080p output.

:)
Click to expand...

For now. Under windows it actually supports it. Weird huh... It's a pointless limitation in OS X.
 
defektion said:
I have a 15" rMBP 2.6 and I use it everyday. Depending where I am at work I hook it up to 2 external displays, at home I use it as it.

70% of the time I'm staring at my IDE (Sublime Text) or a terminal console, when I do get a chance to design, I have no problem at all.

I run the resolution at 1920 x 1200 just so I can have that extra screen real estate.

Creating common UI elements (buttons, icons) I have no problem whatsoever.

Go with the Retina! :)
Click to expand...

Since we are already on this topic I have another question.

How does the device-pixel-ratio work when using external non-retina display? I have few configurations in mind. What's the device-pixel-ratio when:

  1. Using only external display with closed lid
  2. Using both built-in retina display and external monitor but having browser window on the external one
  3. Using built-in and external displays and having one browser window placed between two screens (half of the window on retina, half on external)

Let's say that your website used raster images for icons and you have two versions of each icon, one standard and one @2x, and you switch the graphics via min-device-pixel-ratio media query. Which one will be displayed in above configurations?
 
pogoking said:
Since we are already on this topic I have another question.

How does the device-pixel-ratio work when using external non-retina display? I have few configurations in mind. What's the device-pixel-ratio when:

  1. Using only external display with closed lid
  2. Using both built-in retina display and external monitor but having browser window on the external one
  3. Using built-in and external displays and having one browser window placed between two screens (half of the window on retina, half on external)

Let's say that your website used raster images for icons and you have two versions of each icon, one standard and one @2x, and you switch the graphics via min-device-pixel-ratio media query. Which one will be displayed in above configurations?
Click to expand...


Everything on your external displays will be normal and the @2x images will not be requested. Unless you move the window over to your retina display you must refresh and request the @2x images.

I've never stuck my windows between the retina and the external window. I'll report back to you Tuesday. lol.
 
Thank you guys!

yesterday, I was in Apple reseller store here in Poland. I played a little with rMBP and things seems to look fine, but web browsing - it is really easy to see that 99% of a web is not designed for retina (and as I was using retina iPhones, i never noticed this). And the logos on sites like wikipedia or even google looks fuzzy and uncool.

as a web developer, I know that this can be a little hard to work with (especially when building some bigger size with a lot of photo content and thinking about both - retina & non-retina users) and bandwidth will be affected...
do you think that retina is worth making my work harder (as it probably will be harder, even in case of scaling everything for a web)?
because, i don't really believe that in 2-3 years even half of the market will be using retina displays. isn't that making us kind of uncompatible of the rest of the computers world, especially when we are developers?

and guy at store said me that this retina computers are the worst of apple products (especially the 13"). they overheat, they have performance issues when working with scaled resolution (and is it true? I made a big research in the web and still not sure)...

now it's even harder for me to make a decision, especially that when yesterday i calculate the price of cMBP hiRes matte and costs of replacing hdd for sdd and adding ram - it's actually more expansive the rMBP... and hanging around computer with superdrive (which i'll probably never use) is another pain..
if I could, i would pay even more for rMBP with everything above retina screen :)
 
Last edited:
Hmm I was almost all set for the rMPR, but you made some good point.

Decisions, decisions....

Edit: Maybe I should just keep hold of my 13" MacBook Air 2012 with 8GB ram, 2.0GHz i7 processor and 256GB SSD.
 
Last edited:
I use photoshop to design and edit photos daily. Got a new rMBP from work. Editing photos, a dream. Designing - not so much but ok. Basically have to view at 200% to actually see design as we would on web. 100% canvas is too small for say something like 500x500px.

It's a bit of a number considering the screen is so nice and you're designing on 200% view.

Just got the machine so I haven't experimented with ways around it. Wondering if designing at double the size and resizing for web makes sense or is just more work and larger files.

But at the same time high pixel displays seem like the way for the future so adjusting web standards and ways to design for it is inevitable.

Excited for An Event Apart conference I'm going to that has a section on designing for retina haha.
 
Unfortunately you cannot just scale it down to 50% - it will not look good.

Maybe there is another way around?
 
w41uigi said:
Thank you guys!

yesterday, I was in Apple reseller store here in Poland. I played a little with rMBP and things seems to look fine, but web browsing - it is really easy to see that 99% of a web is not designed for retina (and as I was using retina iPhones, i never noticed this). And the logos on sites like wikipedia or even google looks fuzzy and uncool.

as a web developer, I know that this can be a little hard to work with (especially when building some bigger size with a lot of photo content and thinking about both - retina & non-retina users) and bandwidth will be affected...
do you think that retina is worth making my work harder (as it probably will be harder, even in case of scaling everything for a web)?
because, i don't really believe that in 2-3 years even half of the market will be using retina displays. isn't that making us kind of uncompatible of the rest of the computers world, especially when we are developers?

and guy at store said me that this retina computers are the worst of apple products (especially the 13"). they overheat, they have performance issues when working with scaled resolution (and is it true? I made a big research in the web and still not sure)...

now it's even harder for me to make a decision, especially that when yesterday i calculate the price of cMBP hiRes matte and costs of replacing hdd for sdd and adding ram - it's actually more expansive the rMBP... and hanging around computer with superdrive (which i'll probably never use) is another pain..
if I could, i would pay even more for rMBP with everything above retina screen :)
Click to expand...

The guy in the store is the worst sales person ever. I work with photoshop, have chrome open with a lot of tabs, have my sublime text running, mail app, itunes, terminal, local django development web server, mysql

all running, the things doesn't overheat or have any performance issues.

I browse the web all the time on my retina display, sure 99% of the web isn't optimized but you just adapt. It's actually not that bad.
 
So you do not notice any slowdowns at scaled resolutions?

And what about the EFI bug where perfomance is affected?
 
You must log in or register to reply here.
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.
Top Bottom
Back