{Carrer web log}


Blog about web design & development

Demystification of the iOS7 Icon Grid Design

Thursday, June 20, 2013 { 0 Comments }

There's been a lot of talk last week about the Apple iOS 7 and the icon design.

Many designers are offering there own icons solutions and redesigning the default iOS 7 icons and I have an impression that The Grid System itself is very little discussed and analyzed.

I think that iOS 7 grid system it is a masterpiece.

I also think that grid system is poorly used by Apple, the default iOS 7 icons are lacking consistency and contrast (probably the Apple will change that in the future).

The grid system can probably best understand by starting with the biggest 1024px x 1024px icon, I will use that size like default measure.

The grid system is basically based on 64 x 64, 16px x 16px square blocks.

The circles dimensions are based on Golden Proportions.

You can see on the picture how the rectangular 512px x 320px with golden golden ratio is used for the calculation of the circles.

I played with the Golden Ratio and various Grid System for years and my personal believe that the iOS 7 grid system is meaningful and very well designed.

I've used Photoshop to replicate the icon and grid design, the grid is made with Photoshop Guides (View > Show > Guides). I tried to make everything as px perfect as possible. If you have any suggestions let me know.



>>Download the Photoshop file here

Free for personal and professional use.




0 Responses to “Demystification of the iOS7 Icon Grid Design”

Post a Comment

<< Home

Content is licensed under a Creative Commons Public Domain License