UI Design for iOS 7

Well, that’s rather quieted the talk of Apple lacking innovation, hasn’t it? “Polarizing”, indeed. From the frothing to the analytical to the philosophical to the satirical, no shortage of reactions anywhere across the spectrum out there. But here, we’ll skip straight to the practical:

START UPDATING YOUR APPS FOR IOS 7. NOW.

The key takeaway we’ve reached (after less than 24 hours playing with the iOS 7 Beta release) is this – every App must consider even basic updates to its UI to survive in a post-iOS 6 world.

We’re not talking about simply flattening the App icon so it matches alongside the Apple stock Apps new, sleek design. Fundamental elements – from borderless buttons to translucent bars through to full-screen layouts must be considered – and added – to allow your App to take full advantage of iOS 7.

What’s the risk?

Remember what non-retina enabled Apps looked like when the iPhone 4 was released? Well, this has the potential to be worse – much worse. And remember when many people said that iPhone-only Apps would look “just fine” on the iPad when blown up to 2X scale. Yeah, that argument didn’t last long.

Simply put, pre-iOS 7 Apps running on the new OS stick out like a sore thumb – looking aged, clunky, and well…just ancient.

Yep, that’s pretty much how we see it. And here’s stuff to help you get on that:

First off, the prerelease iOS 7 Design Resources at the mothership.

iOS 7 GUI PSD added by Teehan+Lax to their design resources collection.

Introducing iOS 7 GUI PSD

Free iOS 7 UI Kit from MediaLoot

iOS 7 Icon Guides PSD

iOS 7 Home Screen PSD

New Open Source Project Bringing iOS 7 Style To iOS 5 and 6 UIKit Interfaces

iOS Library For Creating Great Looking Customizable Flat User Interface Elements

Free iOS UI Templates With A Sleek Minimalist Flat Style

UPDATES:

Open Source Control Providing iOS 7 Inspired Flat UI Elements

Parallax is an iOS library that reproduces the parallax effect of the iOS7 home screen.

Demystification of the iOS 7 Icon Grid Design

iOS Device Summary is a great visual representation of devices by screen, processor, and OS versions.

DevJuice: Glyphish icon set updated for iOS 7

jorgenisaksson/Glyphish-Gallery

JagCesar/iOS-blur grabs the UIToolbar blurring layer for your own views.

iOS 7 Wireframe Kit — blakeperdue.com

Rethinking Your Menu Buttons for iOS 7

Download 650+ iOS 7 Icons for Free

iOS 7-Inspired Line Icons

Unleashing Genetic Algorithms on the iOS 7 Icon

iOS7 Before and After Pics

After iOS 7 icons

Reproducing the iOS 7 Mail App’s Interface

The iOS Design Cheat Sheet

30 Amazing iOS 7 UI Kits – Part One

Sketch App Sources

Why We Banished the Hamburger Menu From Our iPhone App

Non-blocking UI’s with interface previews

“God is in the details.”

Creating Badass Users

Alex | June 15, 2013
  • Bob April 6, 2014 at 12:05 pm
    Don't like the flat, texturless look. It reminds me of how bad science fiction writers tried to design their future devices. Even the selling points, such as what you have repeated in the body of your text, sound like te posh, bad science fiction lines of B rated movies. It actually is telling of the generation shift within apple. The people who have the reigns of control, are the same ones who grew up watching that bad science fiction. Sadly. Call this iOS 6 owner when iOS 8 is released and apply really innovates with enabling us to choose our themes and designs... I'll be the first to buy... Or remake the ios 6.

Leave a Reply