Designing apps for the iPhone X notch
Get it right and it looks great. Get it wrong, and, well...
A number of people have written blog posts about the new sensor housing in iPhone X, but Max Rudberg has published the best yet in his article UI Design for iPhone X: Top Elements and the Notch.
Not only does Rudberg walk us through the key parts of Apple’s design guidelines for iPhone X, but he gives hands-on examples of how various components can look and work alongside the sensor housing. So, for the navigation bar he compares translucent bars, transparent bars, and a card-like approach as seen in Apple Music.
There’s a lot of fine-grained detail to absorb before you start updating your apps for iPhone X, but I really recommend you pay close attention to his discussion of alignment in landscape mode – it’s harder than it looks!
If you’re short on time, here’s a quote that sums it up nicely:
Eventually, they will get rid of the notch. It could be 2, 5, or even 10 years, but it’s a stop gap, not a permanent design solution. In the meantime, treat it like the elephant in the room. We all know it’s there, but for the most part, you should design as if it’s not.
Link: UI Design for iPhone X: Top Elements and the Notch
SPONSORED Join a FREE crash course for mid/senior iOS devs who want to achieve an expert level of technical and practical skills – it’s the fast track to being a complete senior developer! Hurry up because it'll be available only until February 9th.
Sponsor Hacking with Swift and reach the world's largest Swift community!
