Is your iOS app ready for Apple iPhone X?

Apple has an excellent track of providing great compatibility to existing apps whenever a new device or iOS version is released. The apps are zoomed to fit the changing size of screens. In fact, the latest versions of iOS behave just like older versions, breaking the assumptions that older app might be making about its environment.

 

With the announcement of Apple’s iPhone X, users and developers can expect to receive a completely different iPhone. Apple got a lot of effort to make the older apps function well on newer devices and iOS versions. The iPhone X is different from other devices in many ways. The screen has rounded corners and the hardware button has been removed in iPhone X.  These changes are going to impact the apps a lot.

 

However, Apple has provided app developers with a set of tool and guidelines that enable them to provide excellent user experience across iOS devices.

 

If you want to make your apps read for iPhone X, you should focus on the below features.

• You must be using Xcode 9 for future apps
• You must build apps against iOS 11 SDK
• You should make sure that the app uses a launch screen storyboard

 

 

Here is what all you need to know about the changes you should make to achieve the compatibility. After reading this post, you will also know about the design guidelines to consider when designing new apps.

 

Update the Layout

According to sources, most of the iOS apps that use standard and system provided UI elements automatically adapt to the new device. If your app is using Auto Layout and UIKT components, chances are there that your app will work without any changes. It is wise to exercise the entire application in every orientation, portrait and landscape — looking for layout abnormalities. To help you with the assessment Xcode has been provided with iPhone stimulator. You need to adhere to safe area when updating the layouts of your app.

 

The safe area describes an area of view that is not occluded by tab bar and status bar. App developers should check and update the layouts to honor the safe area. The safe area can be accessed by using the layout margins or interface builder. The safe area layout guides must be enabled in the FileInspector of the storyboard.

 

For existing apps, turning the safe area guides will upgrade constraints connected to the top and bottom layout guides. It is must to test the constraints after enabling the safe area guides.

 

Screen size and orientation

The iPhone X comes in different screen size with portrait and landscape orientation. The next thing that tends to bring changes to the interface is the UITableView that will run edge to edge. However, it is constrained by the safe area that allows cosmetics to fill the screen, but keep the content where user can see it. The background view is extended to the edges, so that there may be other options for adjusting customization. This shows why you should test the screens across all orientations, especially the left and right landscape.

 

If the existing apps have any content or controls placed in the corners, they should be moved so that they are not clipped by the rounded corners of iPhone X. To help with gestures, the content or controls along the bottom need an inset. The iOS 11 unifies the search bar with navigation bar, as a result of which the search bar looks bad on iPhone X.

 

Update the graphics

Coming to the graphics, this device uses 3X image scale factor with a display of 375pt wide.  It means it has display of 4.7”, which is same as other iPhone devices. The content and background images are created for display of 4.7”, which may not translate well on iPhone X. The status bar is a bit taller in iPhone X and does not change when a background task is running.

 

Apple has built a handy tool for iPhone X app developers, which shows the list of apps that won’t work on the new device. Apple is getting developers to start switching their apps over to 64 bit, so the chances are that all the apps are good to go.  However, it is worth checking to make sure that there is nothing mission critical getting messed up on the new device.

 

Size classes

Size classes are automatically assigned to the content areas based on their size. Basically, there are two different size classes – regular and compact, which differ in the height and width of view. A view may possess any combination of size classes such as – regular height and regular width,compact height and compact width, compact width and regular height, compact height and regular width.

 

The iOS 11 makes the layout adjustments based on the size class of content area. For example – if the vertical size changes from compact height to regular height — it means, the user rotated the device from landscape to portrait orientation.

 

Some of the considerations while designing iPhone X apps are as below –

• Focus more on the current content during context changes, as any environment change can be frustrating and disorienting
• Make sure that the primary content is clear and people shouldn’t have to scroll down the content to read important text
• Use alignment to ease communication and scanning. Alignment makes the app look neat and organized, making it easier to find information
• Your app should support both the variations of portrait and landscape orientation. Customize the app’s response to rotation based on the context and always be prepared for text size changes.

 

 

Conclusion

The changes in iPhone X seem significant, as a result of which the app development for this new device may remain manageable. The futuristic design of the device has kept you away from your goal. However, the requirements of app development remained the same as in other model.

 

This new device from Apple opens up wide range of opportunities for app designers, allowing them to make the user experience highly productive and natural.

 

If you have any thoughts about the full release of iPhone X, share in the comments below! If you too are looking to get your iPhone app compatible to the all new iPhone X contact us today!