UI Designers, Get this Free iOS 8 Vector GUI Elements Kit

iOS 8 looks mostly similar to iOS 7, but there are enough interface changes to make it different, and there are actually many more subtle adjustments than most users may initially recognize. The developers and designers out there do notice that kind of thing though, and this excellent vector-based GUI element kit from the talented folks at Mercury should make those jobs a lot easier. Virtually the entire iOS 8 interface has been recreated as vector elements, which make contending with the variety of iOS screen sizes much easier.

While this is obviously going to be most useful to user interface and experience designers, just about anyone who wants to storyboard or mockup an iOS 8 app or experience will find the scalable vector kit useful for them. It’s a free zip download, those interested can get it from here:

• Grab the iOS 8 vector UI kit from Mercury

The elements kit is an illustrator file intended for Adobe Illustrator CC and newer, but it does work reasonably well with Pixelmators Vector Graphics mode, so even if you’re just wanting to poke around you can do that with without needing the Adobe creative suite.

The attention to detail on this particular iOS UI kit is considerable. Here are some added details via Mercury:

Pixel Grid Alignment: We’ve focused on making this file pixel-perfect. Everything is on a pixel, when possible, so that all assets are sharp and clean. This includes using 1px tall/wide boxes rather than strokes for divider lines and turning on raster view when redrawing icons to make sure things are as accurate as possible. Also, we’ve purposely turned “Align New Objects to Pixel Grid” off in the Transform palette because it wreaks havoc on corner radii and icons. We recommend that you do the same.

Grouping: We’ve grouped like elements together so that it’s easy for you to grab an asset and drag it to your file or do isolated editing. We’ve also grouped transparent boxes with icons and other objects that may not sit on a pixel so that they don’t get misaligned.

Global Swatches: If you look in the swatches window, you’ll notice a number of global swatches (the ones with the little white triangles in the corners). If you edit any one of these swatches (the key color, for example), it will change all the comps to reflect that change. We hope that you’ll find this handy for theming elements based on your app’s unique color palette.

Symbols: Though we tried to keep symbols to a minimum, you’ll notice that we did use a few 9-sliced symbols for things like keyboard buttons.

Of course, you can also grab PSD mockup files for prior versions of iOS too, though the one for iOS 7 is probably the last to be relevant.

Heads up to The Graphic Mac for the great find.