Today I Learned

A Hashrocket project

DIY Grids for Designing UI in Illustrator

I realize I may be part of the minority of UI designers who enjoy working in Illustrator. If you too are part of this special group, check out this sweet TIL:

Open a new AI file with web settings. Create a rectangle that represents the full width of your app. Example: 1080 px wide rectangle for a desktop grid. Align it on your artboard. Go to Object > Path > Split Into Grid. This dialog window allows you to add equidistant rows, columns, and even gutters. When you’ve got all of that covered, select “Add Guides,” then click, “OK.” This now allows you to assign guides to your AI file by selecting View > Guides > Make Guides (⌘5 on Apple).

Killer grid, man!