DuoAppsNot a stretched iPhone: designing for the inner display of iPhone Duo
Open, iPhone Duo gives your app the largest display ever on an iPhone, regular in width and in height: use it to show more, not the same thing bigger. Apple names three layouts: a split view, the list beside the open item; two columns, like Music; and, for information-dense apps, the tab bar as a sidebar, like Health. Two views on one screen go in an arrangement view. Decide on the space your app has, never on the display.
The problem
Open, iPhone Duo gives your app the largest display ever on an iPhone, regular in width and in height. An iPhone layout that simply grows to fill it becomes a stretched-out iPhone app: a header image taller than half the screen, rows of text running across it, and a list whose items still open one at a time, full screen, when the list could stay beside them.
Apple’s answer isn’t a new design for the inner display: it’s the same app, showing more at once. The hierarchy, the features, and the controls stay those of the outer display (Open, close, lose nothing); what changes is how much fits side by side: one more level, a second column, or a sidebar.
The rules
- 1
Use the inner display to show more, not to show the same thing bigger. Open, your app has regular width and regular height, in landscape and in portrait: the extra space lets you show more content, like a sidebar. Apple warns against just a stretched-out iPhone app and names three layouts: a split view, two columns, and the tab bar as a sidebar (rules 2 to 4). None of them is a new app for the inner display: your app keeps one regular-width layout and lets it expand into the space.
- 2
A list and its items: show the list beside the open item, in a split view. It shows one more level of your hierarchy at once: closed, Mail shows either the list of emails or one email; open, it shows both side by side. The system’s split view expands on the inner display and collapses to one column on the outer display; when the device folds, it adjusts its columns’ width and margins to the fold, as in Notes. The list keeps its controls above it; only the column along the edge has its controls on the side (Where the bars go, rule 8).
- 3
A long screen stacked in one column: let it rearrange into two columns when there’s more width. Apple’s example is Music: a vertically stacked layout that rearranges itself into a two-column layout on the inner display. Apple suggests starting with an audit of your centered layouts, asking of each one whether it can become two columns. The elements and their order stay the same: the layout expands, the screen isn’t redesigned.
- 4
An information-dense app with a tab bar can present it as a sidebar on the inner display: a column of destinations, with room for richer navigation. Apple notes that this isn’t for every app: it works best for information-dense apps, like Health. By default, tabs stay a tab bar on both displays, vertical when the controls are on the side; the sidebar is an option your app sets for the inner display.
- 5
Two views on one screen: place them with an arrangement view. It holds a primary and a secondary view and arranges them by the space’s size, orientation, and fold. Choose a split arrangement when one view details the other and neither should ever be hidden, like a podcast and its transcript: side by side when the space is wider than it is tall, one above the other otherwise. Choose an overlay when one view sits in front of the other, like controls over text to read: layered when the device is closed or fully open, side by side when it’s partially folded. A layout that already puts two views side by side or one above the other becomes a split arrangement; one that layers them becomes an overlay (Full screen or a list alongside).
- 6
Keep navigation outside arrangement views. An arrangement view lays out two views; it doesn’t navigate. Place navigation containers, like a split view or a tab view, around it, never inside it. And don’t put an arrangement view inside a list or a scroll view, where part of it could become unreachable.
- 7
Not every screen needs a second column. Background elements, like full-bleed artwork, can fill the available space, extending behind toolbars and sidebars, while interactive controls stay within the safe area. In Apple’s newsroom photo, Netflix fills the inner display this way: the image of a show runs under the controls on the side, with no list beside it. A game, too, fills the screen in every pose: Apple prefers changing its aspect ratio over letterboxing.
- 8
Decide on the space your app has, never on the display. Open, your app doesn’t always have the whole inner display: next to another app in Split View, it has half; under a video pinned to the top, less height; and the inner display ignores the orientations your app supports, so your app gets it in landscape and in portrait, where the bars stay horizontal, at the top and bottom. Base your layout on size classes and on the bounds of your scene or view, never on the type of device, the orientation, or the screen.
- 9
Match each screen type to one layout. Our recommendation, by the screen types of Don’t stretch: a list or grid whose items open (articles, messages, products) becomes a split view, the list beside the open item; a block-based home screen, a profile, or a product page stacked in one column rearranges into two columns; a form stays one column, centered at its maximum width; a full-screen view (map, player, web view, camera) stays full screen, and a player with its “up next” list becomes a split arrangement. The sidebar is a choice for the whole app, not for one screen: keep it for apps with many destinations and dense information. Apple shows each layout with one kind of app: Mail, Music, Health.
Demo
Static version, no JavaScript
- 9:419:41
Stretched. The iPhone layout as wide as the screen: the header image takes more than half the height, the rows run across it, and an item would open full screen, without its list. What Apple asks you to avoid (rule 1).
- 9:419:41
Split view. The list beside the open item, its row selected: one more level at once (rule 2). The list keeps its controls above it; the item’s column has the controls on the side.
- 9:419:41
Two columns. The same stacked screen, rearranged: the header image and its text on the left, the rows on the right (rule 3). The same elements, in the same order.
- 9:419:41
Sidebar. The four tabs become a column of destinations, the first selected (rule 4). Beside it, the content keeps its stacked layout. Apple keeps this option for information-dense apps.
FAQ
How should an app use the inner display of iPhone Duo?
To show more, not the same thing bigger. Apple names three layouts: a split view, with the list beside the open item; a layout that rearranges into two columns, like Music; and, for information-dense apps, the tab bar as a sidebar, like Health.
Should my app show a sidebar on iPhone Duo?
Only if it’s information-dense. The sidebar is an option for an app with a tab bar, on the inner display, and Apple notes it isn’t for every app. By default, tabs stay a tab bar on both displays.
What’s the difference between a split view and an arrangement view on iPhone Duo?
A split view navigates: it shows levels of your hierarchy side by side when the device is open and collapses to one column when it closes. An arrangement view only places two views on one screen, split or overlaid; keep navigation outside it.
What screen size should I design for on the inner display of iPhone Duo?
None in particular: Apple asks for no fixed widths and nothing tied to one display. Your app may have the whole inner display, half of it in Split View, or less height under a pinned video. Design for regular width, with size classes.
Should my app look the same on both displays of iPhone Duo?
Same features, same hierarchy, same state; not the same layout. On the inner display, show one more level of hierarchy when it makes sense for your content, like Mail’s list beside the open email.
Sources
- Prepare your app for iPhone Duo, Apple Developer, Tech Talk
- Design for iPhone Duo, Apple Developer, Tech Talk
- Designing for iPhone Duo, Apple Human Interface Guidelines, September 9, 2026
- Strike a pose with adaptive layouts on iPhone Duo, Apple Developer, Tech Talk
- Preparing your app for iPhone Duo, Apple Developer Documentation
- Apple unveils iPhone Duo, Apple Newsroom, September 9, 2026
- Leverage multiple displays and scenes on iPhone Duo, Apple Developer, Tech Talk