September 10, 2015 by firstname.lastname@example.org
Making sense of the iOS Themes – Deference (Part 1)
When designing applications for the iPhone it’s important to have a foundational understanding of the often neglected iOS Human Interface Guidelines. These guidelines provided by Apple are extremely helpful as a quick start to learning some of the essentials of designing for iOS. Before you get started designing an app for iOS I strongly suggest that you familiarize yourself with these guidelines and how they’re applied in iOS. The power of design patterns like these are also helpful because they reduce memory load for users through instant recognition and through commonly understood conventions of iOS apps.
As listed on the iOS HIG website, the main themes of iOS are:
Okay, let’s dive in to the first theme…
The UI should never compete with the content, only help people understand and interact with it.
Examples of apps that use Deference to showcase the content and provide a richer app experience.
Pocket is an app designed for reading articles that you save from the web does a good job of showcasing the content of an article in full screen when the user is reading.
Another app designed for reading is Medium. In addition to a great reading experience Medium also has a very focused search and new article screen.
Weather apps like the native iOS Weather app and Yahoo’s weather app both have an excellent use of typographic hierarchy, use of the entire screen and a rich interface.
Additional examples include the control center and one of my own apps called Relax Rain, an ambient sound app that plays rain sounds. The control center when open, blurs out the content directly behind it and fades out the other areas of the screen. In my app Relax Rain I’ve tried to emphasize the name of the sound and have paired it with a rich photograph to add an additional layer of meaning.
Tips to help with Deference:
- Focus + simplify your app – start with the high level of your app all the way down to each element that is on screen. The more simple and purposeful each touch point of your app is the more intuitive it will be for users.
- Define the apps core functionality and strip down your interface to only the essentials of what you’d like the user to do. If it’s reading content make sure that’s the focus and only add UI elements that help that end.
- Use the 80/20 rule – What is vital to your app and what is trivial. Learn more about how this rule can apply to mobile app design.
- Follow conventions and proven principles
- Use existing conventions of iOS to guide you as you design. This is especially important for typography, buttons and icons.
- Use hierarchy to help prioritize content and UI elements in your app.
- Defer to content and functionality – this is the heart of the iOS experience, as much as possible make your content the king of the interface. This includes using solid typographic conventions, simplifying your interface, employing a good use of balance and white space and other conventions that we’ll get in later posts.
If you’re more on the development side and are interested in making the switch from Objective C to Learning Swift check out this helpful article from Marco Mustapic at Toptal titled An iOS Developer’s Guide: From Objective-C to Learning Swift.
I’m currently writing a book on iOS app design and how to apply the best design practices to help you design better apps for iOS. Learn more about the book here and sign up to get notified when it’s launched! As a thank you for signing up I’ll also send you an 11 page iOS App Design Kit to that will help you create your next iOS app.