Apple's iPhone 4 simulator shows off Retina resolution
The iPhone 4 simulator included in Apple's iOS 4 development tools provides an early look at how much clarity the increased resolution of the new Retina Display delivers.
The iOS SDK simulator can render an app's images, user interface controls and text at the resolution of both the existing iPhone/iPod touch (320x480) and the new iPhone 4 (640x960).
The detail photo shown below, provided by an iOS developer, presents both images at the same scale, illustrating the difference the higher resolution density makes in text clarity and graphics.
Note that bitmapped images created at the iPhone's exiting resolution, including the "ai" logo and the "search AI" field in the AppleInsider mobile web page (shown below), are not affected by the increased resolution and will need to be updated to appear as sharp as the native controls used in the Safari app.
Text and vector images are rendered at the full resolution, however, without any work by the mobile app or web sites.
This capture of Safari operating in landscape orientation with its keyboard visible shows off the additional clarity and sharpness delivered by the iPhone 4's new display.
The iPhone 4's 326ppi TFT Retina Display leapfrogs existing high end Android phones with resolutions of 480x854 TFT (Verizon Droid, 265ppi) or 800x480 OLED (Nexus One / HTC Incredible, 254ppi, but drops pixels to deliver an effective subpixel resolution of 392x653) or 480x800 TFT (HTC Evo, 217ppi due to being a larger screen).
While a large number of the more than 50 million existing iPhone users worldwide are likely to upgrade to the new iPhone 4, Verizon and Sprint users who just signed two year contracts on Android phones in the last six months are unlikely to race out to buy the next higher resolution devices that become available, particularly given that US service providers are now forcing users to pay as much as $350 in early termination fees.
The iOS SDK simulator can render an app's images, user interface controls and text at the resolution of both the existing iPhone/iPod touch (320x480) and the new iPhone 4 (640x960).
The detail photo shown below, provided by an iOS developer, presents both images at the same scale, illustrating the difference the higher resolution density makes in text clarity and graphics.
Note that bitmapped images created at the iPhone's exiting resolution, including the "ai" logo and the "search AI" field in the AppleInsider mobile web page (shown below), are not affected by the increased resolution and will need to be updated to appear as sharp as the native controls used in the Safari app.
Text and vector images are rendered at the full resolution, however, without any work by the mobile app or web sites.
This capture of Safari operating in landscape orientation with its keyboard visible shows off the additional clarity and sharpness delivered by the iPhone 4's new display.
The iPhone 4's 326ppi TFT Retina Display leapfrogs existing high end Android phones with resolutions of 480x854 TFT (Verizon Droid, 265ppi) or 800x480 OLED (Nexus One / HTC Incredible, 254ppi, but drops pixels to deliver an effective subpixel resolution of 392x653) or 480x800 TFT (HTC Evo, 217ppi due to being a larger screen).
While a large number of the more than 50 million existing iPhone users worldwide are likely to upgrade to the new iPhone 4, Verizon and Sprint users who just signed two year contracts on Android phones in the last six months are unlikely to race out to buy the next higher resolution devices that become available, particularly given that US service providers are now forcing users to pay as much as $350 in early termination fees.
Comments
While a large number of the more than 50 million existing iPhone users worldwide are likely to upgrade to the new iPhone 4, Verizon and Sprint users who just signed two year contracts on Android phones in the last six months are unlikely to race out to buy the next higher resolution devices that become available, particularly given that US service providers are now forcing users to pay as much as $350 in early termination fees.
[ View this article at AppleInsider.com ]
Well...seems like you can either pay the 599 contract-free price, or get the 299 early-term price, in which case if you leave, it costs you about 599...give or take.
Man, we STILL can't escape the mobile-formatted version of AI...
Actually, we just worked on overhauling it. It looks almost the same but functions differently, hopefully more towards everyone's liking. I'll make it live shortly.
K
By the way, some of the article images are actually shown smaller (with the softening that scaling causes) than the pixel size of the actual iPhone 4. So the real thing would be even higher-res and sharper. The big keyboard images are 600 tall instead of 640. (I’m not looking at the cropping, but actual scaling.)
Note that bitmapped images created at the iPhone's exiting resolution, including the "ai" logo and the "search AI" field in the AppleInsider mobile web page (shown below), are not affected by the increased resolution and will need to be updated to appear as sharp as the native controls used in the Safari app.
What are the implications of this? And I am quite shocked no one is talking about it!
Are we now going to see web pages grow larger in terms of filesize, chewing up bandwidth, only because web designers are now going to start saving bitmap graphics at higher resolutions than 72dpi, so they display more sharply on the iPhone 4?
Actually, we just worked on overhauling it. It looks almost the same but functions differently, hopefully more towards everyone's liking. I'll make it live shortly.
K
Excellent! edit: Scratch that logo comment. I got fixated on the blown up size of the logo for a second.
What are the implications of this? And I am quite shocked no one is talking about it!
You don't know the implications, yet you're shocked no one is talking about it?
Are we now going to see web pages grow larger in terms of filesize, chewing up bandwidth, only because web designers are now going to start saving bitmap graphics at higher resolutions than 72dpi, so they display more sharply on the iPhone 4?
No. You may see sites however create 2x images specifically for iPhone 4 versions of sites, but that's about it. Sites like NYT that do not have an iPhone "optimized" version will display beautifully on this new display, as all of those images were designed with a desktop display in mind.
Excellent!
Fingers crossed! Yippee!!
You don't know the implications, yet you're shocked no one is talking about it?
I think his statement is reasonable. Sometimes we notice things in retrospect. For example, the iPad rendering the iPhone 4 at 1:1 without the ugly 2x option. I hadn't thought of that, but then wondered why it hadn't been mentioned earlier by someone more clever than me.
[No. You may see sites however create 2x images specifically for iPhone 4 versions of sites, but that's about it. Sites like NYT that do not have an iPhone "optimized" version will display beautifully on this new display, as all of those images were designed with a desktop display in mind.
Yeah, all we're really talking for websites are mostly elements, not full on images which are likely still optimized for fullsized monitors when clicked. The AI logo in the example is 4Kb go to 4x the resolution won't make that GIF even close to 4x as large, but even if it did, I'd wager it's still small compared to other data we access in browsers and won't affect DL speeds by noticable amount on a site like iphone.appleinisder.com. For those near 200MB/month they may want to get the 2GB option, but I don't think it'll be a real issue for anybody.
What are the implications of this? And I am quite shocked no one is talking about it!
Are we now going to see web pages grow larger in terms of filesize, chewing up bandwidth, only because web designers are now going to start saving bitmap graphics at higher resolutions than 72dpi, so they display more sharply on the iPhone 4?
No, if anything, they should be more streamlined. Bitmapped images are usually larger in size and do not scale, while a vector graphic is the same size or smaller if made correctly and will scale with the resolution of the screen.
No. You may see sites however create 2x images specifically for iPhone 4 versions of sites, but that's about it. Sites like NYT that do not have an iPhone "optimized" version will display beautifully on this new display, as all of those images were designed with a desktop display in mind.
I don't know. Maybe there is a way programatically to take advantage of higher resolution but when you scale images in the browser bad things happen to the quality.
I made a sample test. There are four images, the top two are jpg and the bottom two are png. Actually the results are the same so it is irrelevant which file format you use. The point is, the top image of each pair is a high res image scaled and the bottom one is regular 72 dpi not scaled. You can see for yourself that the high res image is inferior due to scaling.
Test Page
What are the implications of this? And I am quite shocked no one is talking about it!
Are we now going to see web pages grow larger in terms of filesize, chewing up bandwidth, only because web designers are now going to start saving bitmap graphics at higher resolutions than 72dpi, so they display more sharply on the iPhone 4?
Shouldn't be too tough ? the server can just check the request and serve up higher resolution graphics based on the PPI of the device. Or the website could just switch to vectors for graphics which would like the even smaller than the original image.
No, if anything, they should be more streamlined. Bitmapped images are usually larger in size and do not scale, while a vector graphic is the same size or smaller if made correctly and will scale with the resolution of the screen.
I'm by no means an expert on graphics so please correct me if I'm wrong, but I am under the impression that vectored images are best when try don't contain a lot of detail and at small sizes can be significantly larger than bitmaps.
Not the size of the AI logo In the arrticle. What would be the file size for that same image, since it is simple? Is their proxessing overhead for vector over bitmap that can slow down the page render? If vector images are generally ideal why does Apple offer Icon Composer and create all it's apps as 16^2, 32^2, 128^2, 256^2, and 512^2 as bitmaps?
I'm by no means an expert on graphics so please correct me if I'm wrong, but I am under the impression that vectored images are best when try don't contain a lot of detail and at small sizes can be significantly larger than bitmaps.
Not the size of the AI logo In the arrticle. What would be the file size for that same image, since it is simple? Is their proxessing overhead for vector over bitmap that can slow down the page render? If vector images are generally ideal why does Apple offer Icon Composer and create all it's apps as 16^2, 32^2, 128^2, 256^2, and 512^2 as bitmaps?
As you indicated, It all depends on the complexity of the image and the supported features of the vector format. Also, is the vector format binary, text, or compressed text. Any comparison would have to be done with JPG or PNG vs SVG. Then again, this presumes that the resolution of the image is suitable for all display devices and scales. Bitmaps would have to be available in multiple sizes, whereas a vector can be scaled to almost any resolution.
So at full resolution you will get twice (or 4 times by area) the view on an iPhone 4. Fonts are rendered sharper, but same size. Vector art will be sharper, but same size. Web sites stay the same.