Apple announced its first multi-screen and foldable iPhone, iPhone Duo, yesterday. While it's an expensive and maybe niche piece of technology, it's also very impressive. They are clearly not the first to bring a foldable to market: there have been a lot of concept phones and multiple real ones from other brands. But of course, it wouldn't be Apple if they didn't add their own magic flavour on top of it.
Designing & building for iPhone Duo
The iPhone Duo's outer screen, while folded, is Apple's smallest iPhone in their current range. Unfolded, the inner screen is the biggest one on any iPhone. On top of that, there are 6 different device poses in which you can use the device, bringing along some new challenges when designing and building for iPhone Duo.
Traditionally, most apps only take portrait mode into account, and if they keep accessibility and flexible usability in mind, also landscape. So that's suddenly 4 to 5 additional layouts to think about.
The great thing is, if you're using native components like a tab bar or navigation bar, those do a lot of the heavy lifting to make sure it works decently across all layouts. Great if you have a native app, but a lot of mobile apps these days are built using React Native and Flutter. React Native might have an easier time, since it's built on top of those native components. Flutter will have a harder time fully supporting this: to this day, it doesn't support Liquid Glass either. Flutter was built to support multiple viewports and devices, but this is a different kind of complexity, and one React Native won't fully solve out of the box either.
For the design side, Apple stresses that you should still treat it like an iPhone. The inner display might look like an iPad, but these are still iPhone apps, so keep using the patterns you're used to on a phone. The biggest change is in navigation. Everyone is used to seeing buttons at the top and bottom of the screen, that's now mostly moving to the side. The front-facing camera sits there, so the space it frees up gets used for the clock, battery, connectivity status, and navigation controls too. In general, you design for 2 layouts, and your app should scale well across the other 4.
New possibilities, not just new constraints
The iPhone Duo isn't just a bigger phone that happens to fold. Apple created experience that only make sense once you have two screens.
A calculator might not need navigation, so it can be displayed edge to edge and take up all the available space. An app like Apple TV could take up the top half of the screen for video playback and the bottom half for controls when half folded on a table. Or when using it folded like an open book, the left side for your recipe instructions and the right side for a timer. Sometimes you just have to give the content more room or just display it bigger.
There's proper multitasking now. Two apps can be used side by side like the iPad has had for years, giving them their own controls on either edge of the screen. So never assume how a user might use your app, your layout should now fluidly adapt.
Even though your still building for iPhone, this makes the step to iPad support smaller. Giving you the option to easily bring support to even more devices and users.
What "adapting" your software actually means
This doesn’t mean everything will come for free automatically out of the box. You most likely still have to adjust the layout for this new iPhone. But there are a few rules you can take into account:
- The camera never really goes away. The outer camera sits in the corner and is always visible, so nothing should render underneath it. The inner camera is invisible until it's active, and then the interface has to shift to reveal it.
- The hinge is a permanent guest. When the inner screen is partly folded, there's a band down the middle your layout has to respect: no important buttons or text sitting exactly on the crease, and use an even number of grid columns so a gap lands there instead of a card.
- Small movements, not rearrangements. As someone folds the device further open or closed, controls should resize and reflow, not jump to a different edge or disappear.
If your app already uses standard components, a real tab bar, a real navigation bar, you inherit most of this automatically. You can’t try it out just yet, but the first iOS 27.1 beta with Xcode 27.1 is coming later this month, so you can build your existing app against the latest version of iOS to see how it will behave. If you don’t, your app will be met with some black bars around it, which isn’t new for iPhone. The same happened when they released the iPhone 5, which had a different screen aspect ratio, and the iPhone X, which suddenly had rounded screen edges.
How will React Native & Flutter support this?
This is where the differences in Framework will stand out. React Native is mostly a JavaScript layer which uses real SwiftUI and UIKit components in the background. That’s why they were also quick to support the Dynamic Island and Liquid Glass. You could expect something similar for the iPhone Duo, although there might be more fixes needed than before to take new safe areas and margins into account.
If you’ve largely used custom components, then you’re much more on your own. You’ll have to adapt the layout yourself to support the layout switching.
Flutter will likely have it much harder. It doesn’t wrap native components at all, but recreates them pixel by pixel in its own rendering engine. Nothing will automatically adapt out of the box when building your existing app on the new iPhone. Flutter or the community has to custom build support for the iPhone Duo, the same way they still have to do for Liquid Glass. Until that happens, you have to take full ownership of how your app behaves.
This might also raise the question, does it still make sense to build using these cross-platform technologies? While they have a lot of benefits, it’s becoming harder to easily support native platform behavior until someone puts the work in to add that support. Maybe with AI agents, native development might not be such a bad idea anymore, if time and effort are the only constraints for going cross platform.
