New iOS, new iPhones – new design standards! It’s been one month since Apple has revealed iOS 11 and its adoption rate is almost at 50%. On the other hand, there’s Android as their largest competitor, which has only 17% adoption rate for one-year-old version, Android Nougat. Apple makes a big deal about releasing their new iOS every year, so their users are used to following fresh and modern iOS standards. Incidentally, that’s exactly what you should do when making an app of your own. So let’s have a look at some basic design principles that will give your app the look and feel of the new iOS.
Diving into view and depth
This time, more than ever, interacting with your iOS 11 gives you the impression that the various views reveal themselves like a VR puzzle. The most obvious example is exiting app with the Home button or iPhone X’s new swipe up gesture. When you do, you can actually see the app shrinking back into an app icon.
To get the same effect in your app, try playing with the depth and “view spread” transition animation, like the Calendar and AppStore apps do. That gives an airy and modern feel to your UX, while sticking all the content in one place.
If you would like to learn how to achieve this effect, I recommend you check out this blog.
“Swipe down to exit” is an old-but-gold effect which has been used for some time in the Photos app and has now also been implemented in video players across the system. Simple and intuitive, I think it should be implemented anywhere the full-screen multimedia shows up. I’ll also go ahead and say that the only rule of thumb for using gestures is to use standard, natural moves which the user doesn’t really have to think about (unless you are making a game).
In addition to that, we’ve got the new Drag and Drop functionality which lets us break the margins of an app with our gesture and make an app the source or destination for different media types. We’ve come a long way from moving a text cursor with arrows on a black and white display to the iPhone and playing with views like those we dared to imagine in the following scene from the movie Minority Report – so try to make the most of it.
We’ve now got large and bold titles instead of minimalistic and thin ones. We saw a glance of that in iOS 10’s Apple Music, and now it’s been adopted all across the major Apple apps (Settings, AppStore, Mail…). Titles now stick out and make for a good filler on large-screen devices. When the view is scrolled down, the title shrinks and the search bar disappears from the navigation bar. And UIKit takes care of all that with just a few lines of a code:
navigationController?.navigationBar.prefersLargeTitles = true self.navigationItem.searchController = UISearchController(searchResultsController: nil)
Peak & Pop
Every time I download an app from the AppStore and see that there is 3D touch involved in the app icon or inside the app, that app gets an instant plus in my head. Yes, I would agree that 3D touch is not a big usage leap, since it saves only a few taps. But there’s a bigger reason behind it. Apple is making this transition slow on purpose, so that users with older devices won’t be cut off from certain app functionalities. Thus, there is usually an option to choose between long tap and 3D touch. Nonetheless, it is a big experience leap and the range of use cases is certainly broadening every day. And yes, many users with 3D touch devices still use long tap instead or don’t use 3D touch at all, although they theoretically could. Well, every new UX needs some time to become ingrained in the users’ minds and break the learned routines from older systems.
How to make an existing UI survive iPhone X?
From now on, top and bottom layout guides will live only inside our memories because Apple introduced Safe area. That means that you have to hook up your constraints according to Safe area guide to make space for iPhone X reserved status bar and home indicator. On top of that, backward compatibility will be done automatically, unless..
Unless you are using XIBs instead of Storyboard. This area is still buggy, so you’ll have to play with Size Classes, or use Storyboard separately to make your UI work on iPhone X and other devices. Blah…
Login without TouchID bzw. FaceID – uh, why?
If your netbanking app still doesn’t have one of those features, then I would say- it’s time to change banks. It is a feature that is fairly easy to implement, with the additional benefit of being a big time-saver in apps that are being used every day is not to be left out! Apple suggests that TouchID/FaceID should be the first login option if they are enabled in device settings, and username + password should be used as a backup option.
There are many other things that can be done to make your app feel more alive. You can see how is Apple doing it in Human Interface Guidelines, or you can make up some things of your own.
It’s also good to mention that Business chat is coming out soon. It has nothing to do with an app UX, but it does with an overall UX. It’s a pure Apple way of customers quickly reaching your business by choosing message icon that will be integrated in Safari, Spotlight, Siri and Maps. Icon will be a link which starts conversation directly in Messages app. In addition to getting answers and support, customers will have opportunity to pay with ApplePay, or arrange meetings though Calendar app. So let’s see how is that gonna work out.