--- title: "iPhone Duo: waar de balken van je GoodBarber-app heen gaan" description: "Op iPhone Duo verhuizen de balken van je GoodBarber-app naar een rail langs de camera, in jouw kleuren: een nieuwe build is genoeg." canonical_url: "https://nl.goodbarber.com/blog/iphone-duo-waar-de-balken-van-je-app-heen-gaan-a1499/" lang: nl date: 2026-11-12 last_updated: 2026-11-12 --- # iPhone Duo: waar de balken van je app heen gaan Op iPhone Duo zet Apple de bediening in een kolom langs de camera. Die rail stelt het systeem alleen samen voor zijn eigen balken: voor de balken van een GoodBarber-app moest hij ontworpen worden. Eén breedte, alleen iconen, capsules in de kleuren van je app: je gebruikers houden hun houvast, en jij hoeft alleen een nieuwe build te starten. ![](https://blog.goodbarber.com/_public/profile/e1/e1822db470e60d090affd0956d743cb0e7cdf113-default.jpg) [Lesia PIETRI](https://nl.goodbarber.com/blog/author/lesia-pietri/)Head of Product Design [Kies **GoodBarber** als jeFavoriete nieuwsbronKies **GoodBarber** als je](https://www.google.com/preferences/source?q=nl.goodbarber.com) 12 nov 2026 · 5 min leestijd ![](https://cmsphoto.ww-cdn.com/superstatic/2962774/art/grande/98656947-68861198.jpg?v=1794301585.7134845) Het buitenscherm van iPhone Duo is breder en minder hoog dan dat van een iPhone. Apple heeft daar een eenvoudige regel uit gehaald: de navigatiebalk, de TabBar en de knoppen verlaten de boven- en onderkant van het scherm en vormen een kolom aan de zijkant, samen met de statusbalk en de camera. De hoogte gaat terug naar de inhoud, en de bediening blijft binnen handbereik. Apple noemt die kolom „vertical controls”. Toch verplaatst het systeem alleen zijn eigen balken. Die van een GoodBarber-app komen uit het design system van de app, en het systeem laat ze staan waar de app ze heeft neergezet. De vraag was dus eerst een ontwerpvraag: wat wordt er van een TabBar als hij van een rij een kolom wordt, en hoe blijft een app herkenbaar in zo'n smalle strook? De rail moest de app blijven, geen balk van Apple worden. ## iPhone Duo dicht: een rail langs de camera ![](https://cmsphoto.ww-cdn.com/superstatic/2962774/art/grande/98656947-68861199.jpg?v=1794302175.0290928) De eerste ontwerpkeuze voor GoodBarber-apps: één breedte voor alles wat in de rail van iPhone Duo komt, die van een snelkoppeling, met het icoon in het midden. Terug, zoeken, favorieten en elk tabblad van de TabBar passen in hetzelfde vak, en de kolom leest in één keer. De rail draagt alleen iconen; hun namen verdwijnen daardoor niet, VoiceOver leest ze voor. In Eastside, de demo-app van een muziekschool, blijft de kolom rustig en laat hij de kleuren van de mededelingen voorgaan. De tweede keuze is die van Apple: wat boven stond, blijft boven, wat onder stond, blijft onder. Terug en de snelkoppelingen openen de kolom, de TabBar sluit hem af. Wie de app op zijn telefoon kent, hoeft niets opnieuw te leren: de kaart van de app is dezelfde, alleen gedraaid. ## Draai de telefoon, en de rail wisselt van kant [Een dichtgeklapte iPhone Duo draait naar de ene en dan naar de andere kant: de rail volgt de camera, de iconen blijven rechtop.](https://player.vimeo.com/video/1245376868?badge=0&autopause=0&player_id=0&app_id=58479&autoplay=1&muted=1&loop=1&title=0&byline=0&portrait=0&dnt=1) In liggende stand neemt een dichtgeklapte iPhone Duo zijn rail mee met de camera: rechts in de ene richting, links in de andere. De iconen blijven rechtop, en de inhoud schikt zich eromheen. Die kant hoort bij het toestel: een app in het Arabisch of Hebreeuws houdt zijn rail tegen de camera. Van dichtbij is het een detail; in het gebruik maakt het het gebaar natuurlijk. In een interface valt op wat zich tegen het gebaar verzet. Een rail die het toestel volgt, vergeet je, en dat is precies wat we ervan vragen. ## iPhone Duo open: de rail liggend, de balken staand [Een opengeklapte iPhone Duo gaat van liggend naar staand: de balken verlaten de rail en keren terug naar boven en onder.](https://player.vimeo.com/video/1245376869?badge=0&autopause=0&player_id=0&app_id=58479&autoplay=1&muted=1&loop=1&title=0&byline=0&portrait=0&dnt=1) Open en liggend houdt het binnenscherm van iPhone Duo de rail; staand gedraaid is het de enige stand waarin de balken terugkeren naar boven en onder. In Tweed & Cheviot, de demo-app van een natuurhistorisch genootschap, gaan zoeken en favorieten terug naar de navigatiebalk, en keert de TabBar terug naar onderen. De overgang zou je kunnen desoriënteren, en de volgorde voorkomt dat: wat de rail opende, opent de balk, en de tabbladen houden hun volgorde. Je vindt een knop terug aan zijn plek tussen de andere, veel meer dan aan de rand waaraan hij hangt. Staand blijft ook de navigatiebalk op zijn plek als je scrolt. Als hij zich zou verbergen, schoof de tekst onder de klok, die in de hoek van het scherm zit. Zolang het houvast blijft, mag het scherm van vorm veranderen zoveel het wil. ## In een artikel houdt de rail alleen het gereedschap voor de tekst ![](https://cmsphoto.ww-cdn.com/superstatic/2962774/art/grande/98656947-68861202.jpg?v=1794301974.8078978) In een artikel houdt een GoodBarber-app op iPhone Duo alleen wat de tekst dient. De TabBar verdwijnt, zoals op de telefoon zodra een scherm een terugknop heeft; die knop schuift alleen naar de top van de rail, en een capsule onderaan verzamelt het gereedschap van de lezer: reageren, delen, de letters vergroten, bewaren voor later. Acties die bij elkaar horen, delen een capsule. Bij het openen van het artikel wisselen de capsules van de rail met een overvloeier, in het ritme van de pagina die binnenkomt: de rail volgt de navigatie in één beweging. De kopfoto loopt door tot boven aan het scherm en schuift onder de rail door. De iconen van een transparante balk zijn vaak licht, gemaakt om op een beeld te staan; zonder achtergrond zouden ze wit op een witte pagina eindigen. Daarom houdt elke capsule een achtergrond, geen puur wit en geen puur zwart, maar een gedempte tint, gekleurd met de kleur van zijn iconen, met het contrast dat toegankelijkheid vraagt. Het juiste contrast in plaats van het sterkste: een genuanceerde achtergrond is verzorgder. ## De balken van je app, in jouw kleuren ![](https://cmsphoto.ww-cdn.com/superstatic/2962774/art/grande/98656947-68861203.jpg?v=1794301590.8415174) In een GoodBarber-app tekent de app elke balk zelf: die draagt zijn eigen kleuren en zijn eigen vorm, en de rail houdt ze vast. Elke capsule neemt de achtergrond over van de balk waar hij vandaan komt. Zijn vorm volgt die van je [TabBar](https://nl.goodbarber.com/blog/tabbar-de-nieuwe-generatie-is-er-a1344/), van rechte hoeken tot de pil, op alle schermen van de app, ook die waar de TabBar niet verschijnt. Naast elkaar spreken de rails van Eastside, Tweed & Cheviot en The Current niet dezelfde beeldtaal, en dat is de bedoeling. De engine van GoodBarber doet de rest. Die vraagt het systeem om de ruimte voor een balk aan die kant, die de camera al ontwijkt, en zet de capsules daar neer in de volgorde van het scherm. De rail volgt het ontwerp dat je al hebt, zonder extra instelling. ## Wat je nog moet doen: een nieuwe build van je iOS-app ![](https://cmsphoto.ww-cdn.com/superstatic/2962774/art/grande/98656947-68861204.jpg?v=1794301592.2575264) Start in de back office een nieuwe build van je iOS-app, zodat die de rail krijgt; de update bereikt je gebruikers zodra hij gepubliceerd is, na de beoordeling door de App Store. Niets opnieuw te ontwerpen, niets in te stellen. Je Android-app, je PWA en je iPad-app blijven zoals ze zijn. Wil je de rail in beweging zien, klap iPhone Duo dan open en dicht op [onze iPhone Duo-pagina](https://nl.goodbarber.com/iphone-duo/?utm_campaign=iphone-duo). Wat er voor je app verandert, van het ene scherm naar het andere, staat in [ons lanceringsartikel](https://nl.goodbarber.com/blog/iphone-duo-de-vouwbare-iphone-wat-er-verandert-voor-je-app/). De regels van Apple en hun bronnen staan, in het Engels, op de DuoApps-pagina's [Where the bars go](https://duoapps.com/patterns/where-the-bars-go/) en [Custom bars](https://duoapps.com/patterns/custom-bars/). En heb je nog geen app, [maak er dan zelf een](https://nl.goodbarber.com/create/?utm_campaign=iphone-duo). Volg GoodBarber op Google [![Add as a preferred source on Google](https://portal.ww-cdn.com/portal_static/images/preferred-source/badge-en.172e670ec003.png)](https://www.google.com/preferences/source?q=nl.goodbarber.com) ![](https://blog.goodbarber.com/_public/profile/e1/e1822db470e60d090affd0956d743cb0e7cdf113-default.jpg) Over de auteur Lesia PIETRI Head of Product Design Ik ben Head of Product Design bij GoodBarber. Ik geef leiding aan het design van het product: het design system waarop elke app is gebouwd, de layouts waarmee je begint en het traject van idee tot gepubliceerde app. Mijn werk is dat iemand die nog nooit een designtool heeft geopend toch een app publiceert die er doordacht uitziet, scherm na scherm. Als designer in hart en nieren besteed ik mijn dagen aan de details die niemand benoemt: witruimte, contrast, het gewicht van een titel. Hier schrijf ik over het design van GoodBarber en over wat er nieuw is in het product: de features, de layouts en de thema's. [Meer van Lesia](https://nl.goodbarber.com/blog/author/lesia-pietri/)[LinkedIn](https://www.linkedin.com/in/lesia-pietri-150824116/)