IOS 4 vs. 5, Pixel by Pixel (jp) | Hacker News Reader

IOS 4 vs. 5, Pixel by Pixel (jp)

stam-design-stam.blogspot.com

149 pointskposehn30 comments

It's always been interesting to me that the pin-stripe texture made it into iOS and has survived almost 5 years. Apple removed all traces of pin-stripes from 10.5 after toning it down for 10.3 and almost completely removing it for 10.4 So by the time iOS6 is released pin-stripes will have existed in iOS longer than it did in OSX.

Pinstripes are older than OS X, they were in the very first Macintosh in 1984. http://toastytech.com/guis/macos1.html

I wonder why the blog is in Japanese, but diagrams are in English? Have they been copied from somewhere? Not to detract from the topic, of course, but it bothers me when people lift images and artwork from other places without due credit.

A couple of blogs (below) give credit to Matsumoto (author of the Japanese blog):

http://obamapacman.com/2011/10/subtle-differences-of-ios-5-v...

http://usersillusions.com/post/11948201269/apple-has-made-so...

And here is a another site discussing the same images without any attribution.

http://www.ipad2iphone5.com/these-ios-5-changes-are-you-cert...

Note that the locale of iOS in the screenshots is Japanese. The author has done a number of these types of examinations before, usually with parallel Japanese & English captioning.

Probably because the number of people who can read English greatly outnumbers the number of people who can read Japanese?

It's very common for Japanese to use English labeled slides and diagrams for presentations that they know they will be taking abroad because it is much easier change the language of the explanatory text than it is to edit images to make them English.

Maybe credit notes are written in Japanese :)

The text-shadow on the chat bubbles bothered me from the start. It breaks the "flat text inside a bubble" perception and turns it into a non-sensical 3D effect. It's as iOS5 is going the way of Aqua, against the flow...

That is a good illustration of the intense attention to detail that I love about Apple products.

Or the intense attention to detail that you love about Takamasa Matsumoto.

bizarre- The columns of the home page on iOS5 are no longer evenly spaced, almost certainly on purpose.

The purpose is probably to make the home screen symmetrical. Moving the two rightmost columns of app icons two pixels to the right achieves this. Note that previously the outer margins were asymmetrical.

I'm honestly shocked that Steve let them get away with an asymmetrical home screen.

Pardon my ignorance, was Jobs obsessed with symmetry?

He did seem the obsessive type, however given that there is hardware asymmetry (the camera, volume mute etc) I doubt he was.

Yes. Many Apple products are very symmetrical, even looking at our old iBook G4, there has been an attempt to make it as symmetrical as possible.

The white plastic Macbook has screws that appear to be purely decorative, on the left side of the case . The story goes that Jobs insisted on them being there, to achieve symmetry with the functional screws on the right hand side.

This [1] was after Jobs stepped down as CEO, but it was obviously being planned while he was chief. The company went to an almost excessive extent in order for the store to be symmetrical.

[1] http://www.macrumors.com/2011/08/30/new-apple-retail-store-d...

Did anyone notice that it was asymmetrical? I know I didn't. And given other mentions of right-handedness in the OS, and the oddity of it being by accident, I'm more than willing to believe it was intentional.

But the home screen can be made symmetrical while maintaining the same distance between icons. So the question is why not do that?

Also as far as the outer margins are concerned, the badge extends the right side of the icon, so having the right margin wider was reasonable.

I suspect because they're trying to align to some type of grid.

(Even spacing between icons would require 39px of separation, and the odd numbering probably throws something off.)

Right, on iPhone 4 it would be 39 pixels but on iPhone 3GS and lower it would be 19.5 pixels, which would require the icons to be aliased and blurry.

Uh? Just normalize 35 on the borders and keep 38 on icons.

What am I missing for this to be more complicated?

You mean 37 pixels?

(640-(4*114))/5 = 36.8 pixels.

I wonder why they didn't choose this instead:

38+36+36+36+38

That would be most evenly spaced, symmetrical, and compatible with non-retina displays.

App titles. You can have less margin on the edge since you don't have to considers the app title length from the other side.

Ah, that makes perfect sense.

I guess, this would be pointless:

36+38+36+38+36 (18+19+18+19+18)

since the 2nd and 3rd icon wouldn't get the benefit of the extra spacing.

So the reasonable option would be: 34+38+40+38+34 (17+19+20+19+17)

I think it is a lot clearer if you compared the margin using 3GS screen sizes:

    iPhone 3GS screen resolution (480x320)
    iOS4 17+19+19+19+18px
    iOS5 17+19+20+19+17px
    
    iPhone 4 screen resolution (960x640)
    iOS4 34+38+38+38+36px
    iOS5 34+38+40+38+34px

Before iOS5, they were trying to maintain consistent spacing between icons while in iOS5 they changed the home screen margin to be asymmetric while maintaining the same margin ratio between non-Retina and Retina displays. They can't use 35+38+38+38+35 because that would leave non-Retina at 17.5 pixels for left and right margin.

It's not impossible to make it symmetric for both, though. With consistent spacings. E.g.

    19+18+18+18+19 (iPhone 3GS)
    38+36+36+36+38 (iPhone 4)

As I've said below[1], less margin on the edge will make more room for app title for the 2nd and 3rd icons.

[1]: http://news.ycombinator.com/item?id=3171496

Oh true, missed that. Finally pulled out the phone to realize this. And then the other option 16+20+20+20+16 / 32+40+40+40+32 already has too big a difference between the margins on the edges compared to the ones between the icons. Makes perfect sense now.

Reply on news.ycombinator.com