Apple call it a Retina Display, everyone else calls it Hi-DPI, whatever you want to call it, pick up an iPhone, or the new iPad and you’ll see what we’re talking about. Truly breathtaking graphic quality with no distinguishable pixels. Android tablets and phones also sometimes feature these Hi-DPI screens, but that really depends on the price you pay for your device. Either way, Hi-DPI screens are here to stay and 2012 will be the year that we see them go mainstream.
Its fully anticipated, that the new MacBook Air due for release in the next few months will be the first Apple laptop to feature a Hi-DPI Retina Screen, but for those naysayers who thought it was going to be a mobile-only thing, or ‘just a Mac thing’, there is news for you.
Microsoft have announced that Windows 8 will fully support Hi-DPI screens this year, news which has probably sent the developer world in to somewhat chaos. Over the past few months I’ve spent many many hours upscaling designs from the iPhone 3G to iPhone 4, and more recently iPad 2 designs up to the new iPad resolution, so I am well aware just how much EXTRA work is involved.
For starters, unless you have a HUGE monitor, designing for the iPad’s 2048 x 1536 is extremely cumbersome. Even with Apple’s huge 27″ iMac, there are not enough pixels to view your iPad designs 1:1.
In the past I’ve used apps like X-Scope to mirror my Photoshop screen on my iPhone or iPad to allow me to (in realtime) view my design work on the device and make sure it’s a tight and useable design. However this app relies on you viewing the artwork on your Mac at 100% too, something which is not currently possibly for the new iPad.
With the advent of HiDPI desktop machines on the horizon, we are all in for a rough ride when it comes to making things look pretty online.
So where does that leave us designers? For now, not in a great place.
Much to the dislike of every digital producer around the world, design time is going to get LONGER for more than one reason. Firstly, unless your boss is willing to invest in a new HiDPI screen for you (which are likely to be very expensive) then you are going to be stuck designing on a ‘standard’ monitor, which is not big enough for HiDPI, so yes, its going to be like the good old days when you had to scroll around the screen to see your work, and we all know that if you can’t see the entire canvas at 1:1 size, things slow down and the overall design suffers. Fact.
Secondly, now instead of saving just one image, coders will have to save down two files, code the two variations in resolution in to the HTML and also upload two different files to the servers.
The most important fact of all is clarity. When you have a screen that is so clear it’s like the printed page, trust me when I say you’re clients will notice EVERY imperfection or mistake in the HTML. Coding errors that you may get away with today, will stand out like a sore thumb next year, HiDPI screens bring a whole new meaning to the words ‘pixel perfect’. To prevent this, both designers and coders are going to need to spend more time making sure everything is crystal clear and spot on design wise. ’1 pixel out’ today, will be ’2 pixels out’ on HiDPI, and that is noticeable!
Quality of images
If you refuse to design websites with HiDPI screens in mind you will be left with all your images (yes ALL your images, icons etc) appearing at what is effectively half resolution, or in layman’s terms… BLURRY. There are already forums after forums discussing this issue already so we won’t talk about it here, but needless to say, the only website that looks half decent on a HiDPI screen at the moment is Apple’s own site, which is now 4x as heavy by the way so expect your mobile data plan to be used up much faster on your iPad/iPhone.
Do you regularly buy shots from iStockphoto or the like? Well you’d better buy more credits, because you’ll need to be buying images at a much higher resolution so that they look great on new HiDPI screens.
New HiDPI screens won’t be cheap, although it is expected that Apple won’t raise the price of their current range of models. Historically they never have raised the price of their products, they just make them better, so here’s to hoping they do the same with the new Mac’s. Other brands, well, they may well slap a premium on the price of the new screens just because they can. We’ll have to wait and see.
Well, as a designer, I’ve been dreading this day since the iPhone 4 came out. I knew that was the tip of the iceberg, and consumers would demand retina display quality throughout all their devices. As predicted, we are now in a moment in technology where lack of immediate adoption will result in us having to do twice as much work to cater for high end and low end users.
Whilst inevitable, and exciting. It’s also very annoying.
Read more about Microsoft’s take on this on their blog