Apple has released a new page to help developers prepare for the iPhone X. The portion of the guide that many developers will gravitate towards immediately is the Human Interface Guidelines.
Apple’s HIG includes sets of guidelines (not requirements) for designing software that best fits specific environments. With the iPhone X’s notch, referred to as sensor housing in the HIG, many developers may have to rethink some of their full screen applications.
From Apple’s Designing for iPhone X video, developers are told to take care of spacing constraints in both landscape and portrait orientations within their apps. The iPhone X’s sensor housing and home indicator area can interfere with some current app designs. In Apple’s HIG, the company clearly states:
Regardless of what Apple’s HIG indicates, many developers have gone on to create successful applications that don’t follow Apple’s suggestions. The visual limitations that the notch brings are where some developers have begun sharing creative “solutions” around the web.
Vojta Stavik jokingly shared one of the more interesting, if not visually distracting, examples of not embracing the notch.
Zev Eisenberg took it one step further by showing what the scroll indicator might look like
I think I’ve fixed the notch issue in landscape 🍾 #iphoneX pic.twitter.com/hGytyO3DRV
— Vojta Stavik (@vojtastavik) September 13, 2017
Alex Devarty shared a video of a solution that some developers may use. His example showed two different ways of handling the notch in landscape mode on the iPhone X. One where it shows the table view full width, thus calling attention to the notch. The other, adding a black fill in the space where the notch would normally be visible.
Here’s what the notch would look like on the other side 🍷 #iphoneX https://t.co/2iOlZwr4BG pic.twitter.com/UBcewcYj1x
— Zev Eisenberg (@ZevEisenberg) September 14, 2017
Not all developers are finding ways to go around the notch completely. Some have already begun to adjust their apps to match the new phone’s design, and even embracing some of its more prominent features.
Landscape Notch – Show/Hide? @stroughtonsmith @steipete @jamesthomson @flyosity @drbarnard @agiletortoise @_inside pic.twitter.com/09VfVCMP3w
— Alex Devarty (@devarty) September 14, 2017
Going with rounded corners as a first pass at the PCalc default theme on an iPhone X. pic.twitter.com/N2AnMJAVCZ
— James Thomson (@jamesthomson) September 13, 2017
A post by Edward Marks from 2011 showed that many developers were finding their own creative solutions within the status bar and iOS 4. Marks described that in using a black status bar and rounded corners, developers could “increase the usability of your iPhone application by bounding content and thus separating it from the viewport.”
If this doesn’t make you want to spend $1,000 in November, I don’t know what will. pic.twitter.com/cpgDhQIcxq
— CARROT (@CARROT_app) September 13, 2017
Images: Edward Marks
We are starting to see examples being shared today on what that could mean on the iPhone X.
I think this is the best way to deal with the notch and massive corner radii. On an OLED screen these regions will completely blend in 👌 pic.twitter.com/yUgi0PmXe1
— Mike Rundle (@flyosity) September 14, 2017
Nico was quick to point out that even from Apple’s presentation, the Apple Music app is seen ignoring the notch. Though this may just be a side effect card-style interface design.
Apps that embrace the notch on the new iPhone X look bad. Look better with a black background for the status bar. Quick comparison #iphonex pic.twitter.com/3o4bJQC4NB
— Carlos Gavina (@carlosgavina) September 12, 2017
Web developers are also affected by the notch. Stephen Radford has dissected what the notch would mean for various pages around the web. Without additional code, many pages will default to displaying white bars on either side of content on the iPhone X. Radford discovered that by adding specific code to a site, developers could avoid the notch and fill the device’s full view.
Apple: “don’t try to add a black bar to hide the notch”Also Apple #AppleEvent #iPhoneX #embracethenotch pic.twitter.com/rHMMuWAEzd
— Nico (@nameghino) September 13, 2017
Apple’s HIG makes it clear the company would prefer developers to continue developing apps as though the sensor housing is not even there. That is, until the moment that the sensor housing is in the way. In that case, they would rather have developers move valuable contextual content away from the sensor housing. This may require some developers to redesign their apps, but hopefully not need to go overboard with it.
Whether we want it or not, the notch is here, and we’ve even seen postulation that it will become the iPhone’s defining characteristic. In these early notch days there’s no doubt that developers will largely shape what the iPhone X experience will be in the year(s) to come.
