: Grid-based design in Illustrator -- need help setting up a grid! I'm trying to explore grid-based layout design in Illustrator to help me create mockups for prototypes. I was wondering if anybody

@Hamaas979

Here’s a few resources on creating grids in Illustrator that I found helpful:

font.is/grid-systems-making-grids-in-illustrator/ http://www.creativebloq.com/illustration/create-modular-grid-system-illustrator-5132667


Both articles explain step-by-step how to setup a grid in illustrator CS6 by using the in-built option in the Illustrator menu. After selecting an object (i.e. a rectangle of the same dimensions as your art board), from the menu select "Object" then "Path" and finally "Split Into Grid" to see it.

While it is entirely possible to use just shapes and transforms and have a grid without guides I find guides superior as they can still be moved to separate layers (by the way, the option above doesn’t necessarily mean that you must make guides — it creates plain lines first which can then be made into guides by right-mouse click on the object(s) and then choosing "Make Guides"). Guides are faster to turn on and off than layers as well.

Vote Up Vote Down

@Phylliss782

Just use objects

Guides are fine but I prefer lines and rectangles. I keep them isolated on their own layer for easy activation/deactivation. Smart guides will make it extra simple to snap to these objects.

I set up my basic grid unit and position it in one corner of the layout. Then I use a Transform each to tile it out to a full grid. That is, if you're using a uniform grid.



It also works well for grids with complicated geometry. Here's one I used recently for a branding project. Switch your smart guide angles to match your grid and you'll be loving Illustrator ;)



The Grid builder script for Scriptographer

This is a really cool solution (if you're not on CS6). It generates your baseline grid as well as columns based on variables you fill in.



Preview mode by layer

Also keep in mind the fact that you can change between Preview mode and Outline mode in Illustrator at the layer level. This means, if you build your grid as shapes on a dedicated layer as described above you can switch to outline mode to make the objects more guide-like. Then you can switch back to a color coded or solid shape view just as easily. I often find this helpful on grids like the complicated example above.

Vote Up Vote Down