Embracing the Notch

Submitted by mathew on Tue, 07/11/2017 - 08:28

Apple announced the iPhone X on 12 September 2017, and shortly after updated the tools to allow developers to update their apps. I wanted to make sure Easy Books was ready to run on the new iPhone as quickly as possible. Almost all the work was completed the next day.

But the phone itself wasn't available until 3 November, and while the simulator helps a lot, it's not a replacement for a real device. I needed to get hold of one to make sure Easy Books was really okay on the new phone.

I'd already heard rumours that the phone would be in short supply and sure enough it sold out within minutes. I live in the UK where the phone was available to pre-order at a humane time of 8:01. Unlike folks in USA, many of whom set alarms to wake up in the night to get one on the day of release.

My order went through after refreshing the Apple Store a few times on WiFi and 3G. Then of course my credit card company declined the charge. After years of buying almost every product Apple makes, it's a surprise to them every time. But after confirming it was genuine and phoning Apple to re-try the payment I was in line for a phone on 3 November.

I feel it was worth getting the iPhone X because even though I had done everything I could in the simulator, I did find a couple of issues with Easy Books. I've only just managed to get them all fixed, four days later. Hopefully that's quickly enough that nobody noticed.

Designing for iPhone X

The most obvious change is the "notch" at the top of the screen, which Apple have a more fancy term for: the "TrueDepth camera system". If as developers we've followed the recent guidelines about "safe areas" we shouldn't need to worry, but quite often we need to stray slightly from the rules because there's no built-in way to achieve what we want. It's common I think for developers to lay out screen items using hard-coded values such as 20 pixels for the status bar plus 44 pixels for the navigation bar. Easy Books has a message area that only appears while syncing, which was hard-coded to appear at the top of the screen. Obviously that would be no good on the iPhone X.

The notch is not hard to design around, especially in portrait orientation. In landscape, it's a little more involved because some content fills the whole screen, while main content needs to be inset to avoid the notch.

For apps that have not been updated, Apple are letter-boxing them to fit what seems to be an iPhone 6/7/8 screen. They don't look bad by any means, but they do look like they ought to be updated. It's going to be more obvious which apps are abandoned by their developers as times goes on.

Screen Size

Giving a good user experience on screens that vary so much in size is quite a challenge. The iPhone X screen is almost ridiculously tall and the app needs to work well on screen sizes that range from the smallest 4" screen of the iPhone 5s and SE to the 5.8" screen of the iPhone X. It also runs on iPads, from the 7.9" iPad mini to the 12.9" screen of the iPad Pro.

There is one place in the app where the screen size (or rather the aspect ratio) is a nuisance and that's when sending a single-page invoice. When presented in US-Letter, the page leaves a large gap beneath, which looks rather odd. There isn't much I can do about it though, it's just the huge difference in aspect ratio between the paper size and the phone's screen.

Camera

An issue that I could only track down with a real device was related to the new document scanner in Easy Books. This feature was only added in September and allows receipts to be scanned and attached to an expense. It detects the boundary of the receipt using a new capability in iOS 11.

The feature works on all other iPhones and iPads, but had a bizarre problem on the iPhone X. Taking the photo still worked fine, but while the camera was showing a live view, the blue highlight was not picking up the right location of the receipt.

This took a while to get working and wasn't possible using the simulator.

Face ID

Touch ID and Face ID use the same API, but I was getting a weird message that said

"Do you want to allow Easy Books to use Face ID? This app was designed to support Touch ID. It has not been updated for Face ID".

It turns out this is simple to fix, and just involves adding a single line description that explains how the app uses Face ID. But it took a long time to find that out!

There was another issue too, which also happens only on the device itself. With Face ID turned on in Easy Books there was some strange behaviour from the iPhone unlock screen. It seemed to be when Easy Books was left open and the iPhone went to sleep it was difficult to unlock the phone. Using Face ID to unlock the phone and immediately after to unlock Easy Books seemed to cause the problem. I've made a change that means the app will unlock straight away if the phone has just been unlocked a few seconds ago.

So what do I think about iPhone X?

Overall, I like it.

I don't see the big benefit in moving to the OLED screen. Maybe it's just me, but I prefer the IPS screen on previous iPhones because the viewing angle is wider. On the OLED screen I have to view it face on to avoid a blue and red tinge. Plus I now have to worry about burn in. That's something I didn't realise I needed to worry about, but maybe it won't be a problem.

Face ID works as well as Touch ID, probably a little better. What I've realised though is that I often use my phone where it can't see me. For example, while I'm working the phone lies on the table next to me. Quite often I unlock it to start a podcast, which is about the only thing I don't use the Mac for even when I'm standing in front of it. I don't pick the phone up, I just reach over and it can't see me from that angle. Still, it's not a big deal. I prefer Face ID than Touch ID. It makes for a better experience; there's no fumbling around to unlock apps that were designed to work with Touch ID, you're just straight in and using the app.

By the way, if you listen to podcasts you should check out Overcast by Marco Arment. 'Smart Speed' has saved me 100 hours and counting.