Shillington Graphic Design Blog

  • View as list
  • View as grid

Gridulator and Guide Make grids for web easy

  • Gridulator and Guide Make grids for web easy

Category: Design / Interactive, Resources / Tools+Apps,

Posted by: Lee
Posted: Sep 7th 2011
No. of comments: 0

Its always been pretty excruciating in the past trying to create grids and guides for photoshop,  have often just done screen shots of grids in Indesign as work around and then drawn in the gudes. Now we can rest easy.

Gridulator does exactly what it says on the packet. This online tool is a great little help for creating grids for web design quickly and easily. Its really easy to understand. Simply key in the screen size you are working too, type in the number of columns and it gives you multiple options for column width and gutter size.

You can save out your options as a PNG and simply open it in photoshop, cut in paste into your layout file, transform to to fill your canvas. If you want you can then draw in guides for easy snapping of elements.

Ok you might think that sounds cool but below is an awesome plug in that someone called Cameron Mcefee has created for Photoshop. Thankyou lord for putting Cameron on this earth.

The guideguide extension for photoshop means you can create columns, gutters, margins and rows. Super quick to implement and using a similar method to InDesign creating guides within your document not as a graphic but as guides (hence the name). Yay! Simply add  to your photoshop extensions (you may use extension manager). You will then be able to open the palette through in photoshop goto menu > windows > extensions > guideguide. You can watch a video demo of this tool in action here.

Get your grid on.



Comments: 0

Leave a Comment

Please feel free to comment on this post. Please note that all comments are subject to approval and anything deemed offensive will not be published. Your email is never published nor shared. Required fields are marked *