Ontwikkelen voor de iPhone Duo: wat ik leerde bij het aanpassen van mijn app

TL;DR: De iPhone Duo is de meest asymmetrische iPhone die Apple ooit heeft gemaakt. Het systeem reserveert de rechterkant (ongeveer 84pt) voor de tabbalk en systeembediening, en verplaatst die alleen naar onderen als je het binnenscherm staand houdt, zodat het scharnier ze nooit splitst. Het scharniergebied houd je beter vrij van interactieve elementen, en door de vele oriëntaties is een flexibele lay-out geen keuze meer. Ondersteunt je app al iPad of liggende weergave, dan ben je al een heel eind.

Op 12 september kondigde Apple twee iPhones aan: de iPhone 18 Pro en de iPhone Duo. De gewone Pro kreeg eigenlijk een beetje de behandeling van de standaard-iPhone. Hij werd als eerste aangekondigd in plaats van als laatste, en bij daglicht, terwijl de Pro's in Apple-keynotes meestal in donkere scènes worden gepresenteerd. En Apple deed het: we kregen een "one more thing". Zo'n aankondiging is meestal voorbehouden aan een apparaat dat nieuw, spannend en fris is. Recent gebeurde dat nog bij de Apple Watch en de Vision Pro, twee compleet nieuwe platforms.

Deze "one more thing"-apparaten zijn meestal niet meteen verkrijgbaar, zodat developers tijd hebben om er apps voor te maken of aan te passen. Vandaag vertel ik wat ik heb geleerd van het ontwikkelen van mijn app voor de iPhone Duo. En ja, ik kwam veel verrassingen tegen. Sommige vond ik geweldig, over andere twijfel ik nog flink. Laten we erin duiken.

Perfect asymmetrisch

Eerst kort over de app die ik voor de iPhone Duo heb geoptimaliseerd. Hij heet Luci, een moodtracker en dagboek. Gebruikers leggen hun stemming vast met een schuifregelaar, tikken op items om aan te geven waarom ze zich zo voelen, en houden een dagboek bij met afbeeldingen, audio-opnames en markdowntekst. De app bevat ook veel grafieken en inzichten, en gebruikers kunnen de kaarten op zowel het beginscherm als het statistiekenscherm herschikken. Nu de context duidelijk is: tijd om de simulator te openen.

Het eerste wat me opviel, is hoe asymmetrisch de iPhone Duo van voren is. De linkerkant is door het scharnier recht afgesneden, terwijl de rechterkant afgerond is. Ik ben eigenlijk blij dat ze de linkerkant niet ook hebben afgerond, puur voor de symmetrie.

In de app gebruiken we de safe area: een set marges die aangeeft hoeveel ruimte we aan elke kant van het scherm vrij moeten laten voor systeembediening.

Inhoud die links en rechts in de header staat, wordt automatisch naar rechts geschoven.

Standaard zit de safe area op het buitenscherm aan de rechterkant, waar de nieuwe tabbalk en de gecombineerde systeembediening verschijnen. Volgens mij is dit Apple-design op z'n best. We zijn zo gewend aan symmetrische bediening onderaan (en bovenaan, voor het Dynamic Island) dat dit even wennen is. Maar hoe meer tijd ik in de iOS-simulator doorbracht, hoe meer ik eraan gewend raakte, en ik zag hoe de linkerkant zo vrijkomt voor meer van mijn content.

Let wel: dit apparaat is kort (!). Je ziet in één oogopslag maar weinig regels van mijn app, dus dat beetje extra ruimte aan de linkerkant is een geschenk uit de hemel. Eigen bedieningselementen worden niet automatisch verplaatst, al is daar wel een API voor.

Klap je het apparaat open, dan word je begroet door perfecte symmetrie. Alle hoeken zijn nu afgerond, en je hebt in feite een iPad mini in handen, al is hij net iets kleiner. Tot mijn verrassing reserveert het apparaat ook hier de rechterkant voor de tabbediening. Eerlijk gezegd doet dat flink afbreuk aan de symmetrie, want aan de rechterkant is nu ongeveer 84 punten gereserveerd voor bediening. Dan rijst de vraag: wat doen we met de linkerkant? Gebruiken we het volledige scherm, dan schuift de content zichtbaar naar links.

Optimaliseren we voor elk punt van het scherm, of kiezen we voor symmetrie op het binnenscherm?

Ik ben benieuwd wat andere developers hiermee gaan doen. Apple raadt zelf aan de rechterkant alleen te gebruiken voor niet-interactieve content, en dat is logisch. Beeld onder de bedieningszone laten doorlopen kan de symmetrie herstellen, maar dat past niet bij elke app.

Opvallend genoeg verschuift de bediening weer naar onderen als je de opengeklapte iPhone Duo staand draait. Op het binnenscherm zet Apple de bediening dus rechts in liggende stand, maar onderaan in staande stand. Dat lijkt eerst inconsequent, maar het scharnier verklaart het. Liggend loopt het scharnier verticaal door het midden van het scherm, dus een gecentreerde navigatie onderaan zou er in tweeën omheen moeten worden gesplitst. Staand loopt het scharnier horizontaal, en is de onderrand weer vrij.

Ik vind dit heel slim design van Apple. Een groep bij elkaar horende bedieningselementen rond het scharnier opsplitsen is een polariserende keuze. Je ziet op de Duo al hoe dat eruitziet: het toetsenbord splitst zich in tweeën om het scharnier te ontwijken. Apple omzeilt dat probleem voor de navigatie volledig en kiest voor de optie die gewoon ergonomisch is: in beide standen blijft de bediening dicht bij je duim.

Staand op het binnenscherm is ook waarschijnlijk het symmetrischst dat de Duo ooit wordt, en ik denk dat deze weergave geweldig wordt om te lezen.

Door de vele oriëntaties van de Duo krijgt een app eindeloos veel schermsituaties, waardoor een flexibel app-ontwerp een must is.

Bouw je voor het web, dan is dit dezelfde les die responsive design ons jaren geleden leerde: gebruikers verwachten dat apps zich aanpassen aan hen en hun apparaten. Over één kant daarvan schreef ik in thema's met CSS-variabelen.

Over het scharnier

Het scharniergebied wordt interessant. In de simulator kun je de Duo half openklappen, waardoor je ongeveer ziet waar het gebogen scharniergebied komt. Ik heb gehoord dat dit gebied in de halfopen stand lastig aan te raken is, dus het advies is om interactieve content weg te houden van het midden van het scherm. Content waar je niet mee interacteert, zoals afbeeldingen en grafieken, mag prima deels in het scharniergebied vallen.

Er is een API waarmee developers kunnen nagaan of content in het scharniergebied valt. Maar doordat de tabbalk rechts zit, schuift de content ook 84pt op, waardoor gecentreerde content technisch gezien niet in het midden staat. Ik vraag me af of het scharniergebied ook ongeveer 84 punten is. Hmm.

Als developers kunnen we ook de stand van het scharnier opvragen en op basis van de hoek rekenen. Netflix doet dat om een reflectie van de film te projecteren wanneer die op maar de helft van het scherm speelt. Heel slim!

Hoe groot is dat scherm?

Ik heb de iPhone Duo naast de iPhone Pro Max gezet op 1:1-schaal. Opengeklapt is de iPhone Duo ongeveer net zo breed als de iPhone Pro Max hoog is. Maar door de extra hoogte (ongeveer de helft van een iPhone Pro Max) laat de iPhone Duo verticaal een flink stuk meer content zien. Heb je een iPhone Pro Max van 6,9 inch, houd hem dan liggend vast om een idee te krijgen van de breedte van de Duo.

Apps die op je gewone iPhone naar liggende weergave draaien, zien er op de Duo waarschijnlijk direct prima uit.

De extra hoogte is meer dan welkom. Ik kijk vooral uit naar side-by-side multitasking op de Duo. Helaas kon ik dat in de bèta van de simulator niet uitproberen, maar ik denk dat elke helft ongeveer zo breed wordt als het buitenscherm. Ik heb dus een idee van hoe het eruitziet en werkt.

Om een gevoel te krijgen bij de breedte en hoogte, vouwde ik een stuk papier op de breedte van mijn iPhone Pro Max en 1,5 keer de hoogte. Dichtgeklapt is dit apparaat KLEIN! Opengeklapt is het waarschijnlijk nog steeds kleiner dan het marketingmateriaal doet vermoeden, maar een heel fijn formaat. Ik zie Apple in de toekomst prima grotere modellen uitbrengen.

Omdat Luci vanaf het begin de iPad ondersteunt, was het relatief eenvoudig om de app geschikt te maken voor de Duo. De lay-out was al responsive: op een breder scherm splitst de app zich in twee kolommen, en dankzij die twee kolommen valt de ruimte ertussen precies op het scharnier. Het grootste deel van de Duo-ondersteuning kregen we cadeau, dankzij het zware werk dat we hebben verzet om de app vanaf dag één geschikt te maken voor de iPad.

Niet alles kwam vanzelf, trouwens. De app hield geen rekening met de linker- en rechter-safe area, en niet alle bedieningselementen waren 100% native, waardoor ze niet automatisch plaatsmaakten voor de systeembediening. Die twee onderdelen, de bediening en de horizontale safe areas, kostten het meeste werk. Ik heb wat ideeën om de ervaring op de Duo meeslepender te maken, maar koos voor de eerste versie voor veilig in plaats van avontuurlijk. Zo hebben gebruikers direct een goede ervaring, en kan er grondiger getest worden zodra de hardware uit is.

Let op: deze screenshot komt van een vroege poging om Luci te optimaliseren voor de Duo en is niet representatief voor het eindresultaat.

Revolutionair apparaat of gewoon een nieuwe smaak?

De laatste grote verandering van de iPhone was waarschijnlijk de iPhone X in 2017. Ik was er destijds diep van onder de indruk: Face ID, een ontwerp dat volledig uit scherm bestond en een apparaat dat voelde als een generatiesprong. Mijn vraag is: is de iPhone Duo Apple's iPhone X-moment? Is dit apparaat de toekomst van de iPhone, vandaag gepresenteerd als een (voor de meeste mensen eerlijk gezegd erg dure) voorproef?

Ik weet het niet zeker. Het antwoord hangt af van de vormfactor. De iPhone X had destijds geen enkel compromis. Het was niet moeilijk te zien dat zijn vormfactor op elk vlak beter was dan die van de iPhone 8 die ernaast werd gelanceerd. Bij de Duo komt de vraag neer op een telefoon in paspoortformaat versus een klassieke slab. Is de nieuwe vormfactor beter dan de oude? Mijn antwoord is ja, maar alleen voor sommige mensen.

Dit is volgens mij de beste vormfactor per toepassing:

• Met één hand gebruiken: slab
• Multimedia: opvouwbaar
• Multitasken: opvouwbaar
• Camera: slab
• Lezen: opvouwbaar
• Bellen: slab. Een gemengd verhaal, maar het lagere gewicht en de betere Face ID-camera geven de doorslag.
• Gamen: twijfel. Het grotere scherm is top, maar de accessoiremarkt moet nog bijbenen en thermische throttling is nog niet getest.

Eerlijk gezegd vind ik de compromissen die de Duo van gebruikers vraagt groter. De Duo heeft geen Face ID en geen telelens, een (waarschijnlijk) iets slechtere batterijduur, en het scherm gebruikt nanotextuurglas. Dat laatste is persoonlijke voorkeur, maar ik ben zelf meer van glanzend.

Voor wie is de iPhone Duo?

Ik vind dat de Duo een eigen categorie apparaat verdient. Ik zie hem op een gegeven moment gewone telefoons vervangen, waardoor de oude vormfactor de "vreemde eend" wordt, voor camerafanaten en misschien voor mensen die veel buiten zijn. Maar ik denk niet dat het een directe, revolutionaire overgang wordt zoals bij de iPhone X bijna tien jaar geleden. Deze overgang gaat waarschijnlijk geleidelijk.

Ik heb de telefoon alleen virtueel uitgeprobeerd, maar mijn inschatting is dat de Duo vandaag waarschijnlijk de beste iPhone is voor een specifieke groep mensen: mensen die in vergaderzalen aan het multitasken zijn, die elke dag met de bus of trein reizen, die hun digitale ecosysteem willen terugbrengen tot één apparaat, en mensen die de jaarlijkse verbeteringen in computationele fotografie zat zijn. Herken je jezelf in een van deze groepen, dan zou de Duo zomaar de telefoon voor jou kunnen zijn.

Ik denk ook dat de Duo de perfecte vervanger is voor gebruikers van een verouderde iPhone mini. Het buitenscherm is compact.

Ga ik er een kopen?

Ik heb Luci aangepast om vanaf dag één de beste moodtracker op de iPhone Duo te zijn. Er zijn eerlijk gezegd zoveel interessante aspecten aan dit apparaat om te ontdekken. Maar voor sommige daarvan moet ik het apparaat echt in handen hebben om te weten of mijn aannames kloppen, zoals het scharnier of hoe stabiel het apparaat is in zijn vele standen. Eén ding weet ik zeker: ik wil er absoluut een.

Tegelijk weet ik dat ik misschien niet de doelgroep ben. Ik heb een iPad Pro, waarmee ik de honderden iconen voor de app heb getekend. Ik heb een MacBook Pro om Xcode-projecten te compileren. En ik heb de iPhone Pro Max omdat ik graag momenten vastleg met fotografie. Ik vind het lastig om een paar van de beste apparaten in hun categorie op te geven voor een apparaat dat onderweg compromissen moet sluiten.

Maar een andere kant van mij denkt: misschien kan dit mijn iPad vervangen. Het vooruitzicht om mijn Apple Pencil en iPhone Duo altijd bij me te hebben, als persoonlijk notitieapparaat en kleine computer om vectortekeningen te maken, vind ik echt spannend. Wie weet? Misschien voelen de compromissen over een of twee generaties minder storend, en heeft de Pencil-ervaring zich dan bewezen als volwaardig notitieapparaat.

Op basis van mijn ervaring als developer met de iPhone Duo denk ik dat veel mensen er echt dol op gaan zijn wanneer hij op 23 oktober uitkomt. Ik kan niet wachten om hem zelf uit te proberen. Tot die tijd kun je Luci downloaden en ben je vanaf dag één klaar.

Bouw je een app en wil je die ook klaar hebben voor de iPhone Duo? Bekijk mijn projecten of huur mij in als developer.