Grid System?

Discussion in 'iOS 7' started by dsdevries, Jul 19, 2013.

  1. dsdevries macrumors member

    Joined:
    Aug 13, 2009
    #1
    Does anyone understands a thing about this so called grid system for the icons in ios7? When I look at the new icons I can't see a lot of lines lining up with the lines from the grid system. And if they happen to do, it seems more like a coincident than an actual design choice. It looks as if they thought: If we just draw enough lines in the grid system, then there will always be something aligning to any of these lines.
     
  2. batting1000 macrumors 604

    Joined:
    Sep 4, 2011
    Location:
    Florida
    #3
    Why would they have talked about it in the iOS 7 design video if it was just a coincidence and not a design choice?
     
  3. C DM macrumors Westmere

    Joined:
    Oct 17, 2011
    #4
    Perhaps to make it sound like something they gave a lot of "scientific" thought to, even if they didn't. To make it seem that much more "refined" and therefore "good" and "cool" right away just from the sound of it all. Marketing.
     
  4. batting1000 macrumors 604

    Joined:
    Sep 4, 2011
    Location:
    Florida
    #5
    While that's possible, I think they actually did attempt to design the icons based on a grid system, but whether they did so to the extent they say is debatable.
     
  5. C DM macrumors Westmere

    Joined:
    Oct 17, 2011
    #6
    I would say that is likely the case. Marketing and all that played (possibly even a big) role, but there was probably some design logic and work that was part of it as well. Too bad they didn't even quite execute following their own design decisions all that consistently/well when it comes to different icons that they have for their own apps.
     
  6. kmj2318 macrumors 68000

    kmj2318

    Joined:
    Aug 22, 2007
    Location:
    Naples, FL
    #7
    Since we're talking about the grid system, I thought some people would be interested in this. I was intrigued about it since I first seen it. I was recreating it in Illustrator to try and understand the thought behind it. Here are a series steps of making the grid from what I seen.

    The new shape is no longer a rounded rectangle, it's a superellipse. This shape can be made by starting with a circle and dragging the asymptotes to the edge of the shape's bounding box. I quite like the shape, with a rounded rectangle, the circles that make up the corner are very noticeable, this is a more subtle shape.

    [​IMG]

    The outer circle is positioned to match up with the mid-point of the corners, where the corners change directions. I guess you'd call it the inflection point.

    [​IMG]

    Then, the golden ratio is used to establish the vertical and horizontal lines here.

    [​IMG]

    The inner circle matches up with the inside of the square that's created by the vertical and horizontal lines, and the outer circle matches up with that same square but from the outside. And then the diagonal lines appear, although they could have been on the very first image.

    [​IMG]

    They might even conform to Apple's hardware, and considering that Jony is the designer of both, perhaps he is just adopting grid systems for software from ones he's been using for hardware.

    Some of the icons don't seem to conform to the grid at all, like the camera icon maybe. I might superimpose the grid over all the icons to see if they somehow match up. Anyway, I like this sort of stuff. :cool:
     
  7. petersmith5544 macrumors newbie

    Joined:
    Jul 3, 2013
    Location:
    India
    #8
    Grid System

    iOS 7 Grid System Icon Template is a free Template design resource made by Dribbble user Simon Grozyan. As far as I can tell, its license is Unknown.

    Helpful hint: Dribbble users are nice. If the license is unknown, it is usually because they forgot to mention it explicitly; not because they were being stingy. Ask nicely and they will probably allow you to use it.
     
  8. hektor5wolf macrumors member

    Joined:
    Jun 18, 2012
    #9
    ????? I think OP is talking about the official grid....which Simon Grozyan remade right??
     
  9. PrometheusGeek macrumors regular

    Joined:
    Mar 19, 2012
    #10
    I like the idea of a grid, based on golden ratios, which each icon conforms to. My problem is that the new icons don't really seem to do that consistently at all. This post shows that in an illustration on mid-page:

    http://www.baekdal.com/opinion/fixing-the-ios-7-icons/

    The author of that post proposes alternative designs, which I don't care for either. But the point is, that he shows how the iOS 7 icons don't adhere to the grid themselves. So, what's the point of the Grid?
     
  10. jonnyb098 macrumors 68020

    Joined:
    Nov 16, 2010
    Location:
    Michigan
    #11
    The grid system was quite possibly not even designed by Jony. For all the evidence it seems to be from the same Cracker Jack team that brought us these new 80s style indiglow icons.

    Since a lot of the proof posted here seems legit, then the designers are just doing a horrible job of implementing their designs into this grid.
     
  11. hamiltonDSi macrumors 65816

    hamiltonDSi

    Joined:
    Jul 29, 2012
    Location:
    Romania
    #12
    Good work !
     
  12. PrometheusGeek macrumors regular

    Joined:
    Mar 19, 2012
    #13
    I can see Jony designing the grid itself. But it does seem like he handed off the icon design to another team who just didn't get it. Now, I'm not one who totally hates the icons. They're really just fine with me. But for all the talk about this cohesive grid system, it seems like it didn't pan out.
     
  13. toxic macrumors 68000

    Joined:
    Nov 9, 2008
    #14
    you obviously don't know anything about art or design. in a body of work, as opposed to a one-off piece, nothing is coincidental.

    in the initial stages, the fact that the best-looking icons (in the lead designer's opinion, not yours) conformed to a certain pattern could very well be a coincidence, but further work would not have been. how strict they are with the guidelines is also a judgment call - in the end, what looks best trumps any rule - but the initial versions would still be based on the given guidelines.

    edit: even in one-off pieces, with an experienced artist/designer, hardly anything is coincidental. in general, nothing is, if the artist is given enough time.
     
  14. C DM macrumors Westmere

    Joined:
    Oct 17, 2011
    #15
    It's already been officially pointed out and confirmed that the marketing team largely came up with the icons, so, yeah we are all sure that tons of scientific and mathematical thought went into it as Apple likes to make it seem in their promotional materials. :rolleyes:
     
  15. toxic macrumors 68000

    Joined:
    Nov 9, 2008
    #16
    this is the post you are referencing, and here is the relevant quote:
    yes, it was the marketing department, but it was designers in the marketing department, not writers or secretaries or analysts. my point still stands.

    whether or not they used science or math is irrelevant. the point is design is not chaotic.
     
  16. BlaqkAudio macrumors 6502

    Joined:
    Jun 24, 2008
    Location:
    New York
    #17
    You do realize there are graphic designers who work in marketing?
     
  17. C DM macrumors Westmere

    Joined:
    Oct 17, 2011
    #18
    Of course, but they don't really employ some sort of scientific/mathematic type of methods in their design, at least certainly not foremost by any stretch of imagination. While the developer videos and promotional materials make it sound like this grid design was some sort of scientific breakthrough that took years of work from world's top scientists before the actual implementation even started. Yes, a hyperbole, but it's an overall sense that it all tries to convey in one way or another.
     
  18. SILen(e macrumors regular

    Joined:
    Oct 6, 2012
    #19
    You don't get it, huh?

    Grid based design isn't something that Apple invented (or claimed to invent) for iOS7, it has been the norm in design of complex bodies of work.

    Websites are designed using a grid, Windows 8 Metro -> a grid...


    And just FYI - it seems that a lot of the new Apple periphals are also using a grid based design.
     
  19. Rogifan macrumors P6

    Rogifan

    Joined:
    Nov 14, 2011
    #20
    .

    I think all this hubbub over the icons is a bit ridiculous. Especially people claiming they won't upgrade or they're going to Android/Windows Phone because of the icons. As if people choose phones based on fricking icons. :rolleyes:
     
  20. C DM macrumors Westmere

    Joined:
    Oct 17, 2011
    #21
    Seems like Apple themselves is trying to say that they've really gone out of their way to work this system out and closely follow it when they certainly have been far from consistent in their implementation.
     
  21. kmj2318 macrumors 68000

    kmj2318

    Joined:
    Aug 22, 2007
    Location:
    Naples, FL
    #22
    There are a few icons that don't seem to line up at all, for example:

    [​IMG]

    [​IMG]

    [​IMG]

    [​IMG]

    The rest align to the grid in a very minute way. Like the top of Notes and Videos share the same "top bar" spacing. The street corner in Maps is the same point that the Stocks icon has the dot.

    Here's one that I thought was kind of a stretch, the guys head reaches the edge of the outer cirlcle, however, the tabs do not conform to the grid at all. So as I've said, the icons align to the grid just barely.

    [​IMG]

    What's actually kind of ironic is that the Settings and Safari icons are easily the most true to the grid.
     
  22. jonnyb098 macrumors 68020

    Joined:
    Nov 16, 2010
    Location:
    Michigan
    #23
    Agreed. Funny they brag about it in the video and on the site yet a lot of the icons don't even adhere to it.
     
  23. PrometheusGeek macrumors regular

    Joined:
    Mar 19, 2012
    #24
    Yes, exactly. What's the point of promoting this awesome grid system when a bunch of the icons don't even conform to it?
     
  24. TonyC28 macrumors 65816

    TonyC28

    Joined:
    Aug 15, 2009
    Location:
    USA
    #25
    Thanks for posting this. I'm with the skeptical ones here. The grid stuff looks cool when they explain it but most of the icons don't conform to it at all. Honestly it really does seem kinda dramatized to appear more technical and advanced than it really is.
     

Share This Page