Sample of the final icons, ready to use and be scaled across the platform
Sketching
I started by sketching out some ideas for icons, based on a square grid, so that all icons would fit in the same space, regardless of aspect ratio.
Refinement and review
I brought the sketches into Illustrator to begin working through some ideas. It's a messy process at this point, but I don't like to limit the ideas by worrying too much about the grid, pixel perfection, or layer naming. This is a rough canvas.
Building a cohesive set
Now is the time to put the grids to use. I start by building the icon at the largest size in the UI, 64px. Creating lines at a weight that will scale down (and up) well, without loss of detail. By using the green guides, I am able to see what the aspect ratio of the icon should be, in order to fit into the full set. If creating a horizontal icon, it should fit into the same bounds, rotated 90º.
starting to conform on the grid, building in aspect ratios
Testing scaling to make sure there was no loss of detail at 16px
