ios7 design

With the recent iOS 7 release some of the biggest buzz has been about the major redesign of UI and app elements. Though it is definitely not necessary, some of you might be interested in matching your app design to this sleek new interface so that it seems to directly integrate into the apple ecosystem. With that in mind, the following steps will help you closely match your app to the new iOS 7 conventions.

1. Simplified Icons

The new iOS 7 app icons are all very simple, flattened representations of the apps they represent (standing in stark contrast to Apple’s older, more realistic icons). To match these icons, you will need a very simplified icon without text. You should also keep it to one color, preferably a black, white or light grey.

2. Gradients

Most of the new design elements incorporate gradient backgrounds. You should make sure that your app icon, splash screen, and background all feature gradients. Note that most of these are soft gradients, so don’t make a radical jump between opposing colors if you want to match the iOS 7 design precisely. Fortunately it’s pretty easy to create a gradient in most image editing programs, and some tools will even do it for you.

3. Elegant Text

Apple has chosen Helvetica Neue as their text of choice for most UI elements due to its sleek, elegant nature. Choose an app font in the Helvetic family to approximate their text.

4. Transparency

Apple has also made many of their menus and containers transparent, allowing the gradient to show through the menus. When creating a menu for your app, make it very light grey and set the transparency high (without making the menu disappear completely).

5. White Space

iOS 7 uses a LOT of white space. You can do the same in your app, which will highlight your multimedia, text and design. Simply make sure that you don’t flood your app with large blocks of text, and follow established mobile writing tips to make everything more streamlined.

There you go! Let us know in the comments if you have any other ideas, or if you have questions about incorporating any of these elements into your mobile app.

Close
Go top