The First iOS 7 Icon Grid Photoshop Template

Let's give Microsoft its dues - the Windows 8 Metro interface was ground-breaking. The arms race for rounder buttons and glossier toolbars was jarringly ended with squares, solid colours and no shading.

It strongly highlighted the visual inconsistencies in Apple’s user interfaces, like the industrial shine, skeuomorphic stitched leather and casino felt. For the first time anyone can remember, Apple was put firmly on the back foot and something had to change to maintain its reputation as design-first innovators.

That change is iOS 7. Unveiled yesterday evening, iOS 7 has been completely redesigned, and surprise-surprise, it has aped the Windows Metro design language. This wasn’t a big secret and most of us saw it coming. It was also pretty obvious that Apple would take the Metro concept and knock off the rough edges, refining it to something beautiful in a way Microsoft finds difficult.

Don’t get me wrong, I’ve taken the long way round to being an Apple iPhone (and iPad) owner and I’m by no means an evangelist. I don’t subscribe to the tired received wisdom that “designers use Mac”. But even I’d have to admit that the iOS 7 presentation at WWDC Keynote 2013 was stunning. I was enthralled. It’s rare that you see an interface so streamlined, elegant and transcendent.

ios7 icon grid template for Photoshop
ios 7 icon grid template .psd

You only caught a glimpse of it in Jony Ives' interview, but I was fascinated by the iOS 7 icon grid system they revealed. I just had to recreate it in Photoshop, so here it is. I think it’s the first .psd version available anywhere on the web. Enjoy.

Download the .psd iOS 7 icon grid template for Photoshop

Article written by David Lambie
David Lambie
Creative Manager
Article added 11th June 2013