iPhone Duo y Flutter: qué significa el primer iPhone plegable para tus apps

Hoy Apple ha presentado el iPhone Duo, su primer iPhone plegable. Después de siete años viendo cómo Samsung, Huawei, Honor u Oppo iteraban sobre el formato, Apple entra en la categoría con un dispositivo tipo libro que se cierra al tamaño de un pasaporte y se abre en la pantalla más grande que ha llevado nunca un iPhone.

Más allá del titular (y del precio: 2.000 dólares de partida), lo relevante para cualquiera que tenga una app en producción es otra cosa: a partir de octubre, tu app va a ejecutarse en un dispositivo que cambia de forma mientras el usuario la usa. Eso no es un iPhone más grande. Es un cambio de reglas.

En este post repasamos qué ha anunciado Apple, qué implica para el diseño de producto, por qué Flutter llega a este momento con los deberes hechos y qué deberías revisar en tu app en las próximas semanas.

Qué es el iPhone Duo (lo confirmado hoy)

Lo que Apple ha oficializado en la keynote:

  • Dos pantallas. Una exterior Super Retina XDR de 5,4" y una interior de 7,6" que, desplegada, se acerca a un iPad mini con una proporción casi cuadrada. Se acabaron los rumores de dimensiones: estas son las cifras de la ficha oficial.
  • iOS 27 adaptado al formato. Los controles esenciales se desplazan a un lateral para liberar espacio y la interfaz anima el contenido de una pantalla a otra al abrir y cerrar.
  • Multitarea tipo iPad en un iPhone. Apps lado a lado y multitarea al estilo iPad por primera vez en un iPhone: dos apps a la vez en la pantalla interior.
  • Posturas. El Duo se puede usar medio abierto o apoyado en una mesa; iOS detecta el ángulo de la bisagra (foldState, angleDegrees) y aparta el contenido de la zona de pliegue.
  • Hardware. Chasis de titanio grado 5, chip A20 Pro, 12 GB de RAM, Touch ID integrado en el botón lateral (con varias huellas) y soporte para Apple Pencil, que llegará más adelante este año. Colores Star White y Night Sky. Almacenamiento hasta 2 TB (~3.000 $). Disponibilidad a partir de octubre.

Apple ha optimizado todas sus apps propias para el Duo. Y ese es el mensaje implícito a los desarrolladores: este es el estándar.

Por qué es distinto a "otro tamaño de pantalla más"

Llevamos una década diseñando para una pantalla rectangular que, como mucho, rota. Un plegable rompe cuatro supuestos a la vez:

  1. El tamaño cambia en caliente. El usuario abre el dispositivo con tu app en primer plano y, de golpe, tiene casi el doble de superficie. No hay relanzamiento, no hay pantalla de carga. Tu app tiene que reflowear su estado en el sitio.
  2. La proporción cambia. Pasas de un móvil alto y estrecho (≈19,5:9) a algo casi cuadrado. Un layout que "escala" simplemente estirará todo y quedará ridículo. Hace falta un layout distinto, no el mismo más grande.
  3. Hay una zona física a evitar: el pliegue. Un botón, un diálogo o un texto que caiga justo encima es una mala experiencia. iOS ya aparta su propia UI; la tuya tiene que hacerlo también.
  4. Tu app compartirá pantalla. Con la multitarea lado a lado, tu app puede ocupar media pantalla interior —un ancho parecido al de la exterior, pero con otra altura. Vuelves a estar en "móvil", pero en otro contexto.

Además, Apple lleva desde la WWDC de junio empujando en esta dirección: iOS 27 introdujo apps redimensionables, herramientas en Xcode para previsualizar distintos tamaños, y el mensaje explícito de diseñar para "un rango dinámico de tamaños y proporciones". Las apps compiladas con el SDK actual entran automáticamente en el modo redimensionable. Es decir, no es opcional: si recompilas, tu app ya es redimensionable, quieras o no. La pregunta es si se ve bien.

Flutter y los plegables: esto no es nuevo

Aquí está la buena noticia para los que desarrollamos con Flutter. El soporte para dispositivos plegables y de doble pantalla lleva estable en el framework desde Flutter 3 (2022), fruto de la colaboración entre Google y Microsoft para el Surface Duo. Lo que nació para un nicho de Android hoy resulta ser exactamente lo que necesita el iPhone Duo.

Lo que Flutter ya te da de serie:

  • MediaQuery.displayFeatures. Una lista de características físicas de la pantalla (recortes, pliegues, bisagras) con sus bounds, tipo y estado (plano, medio abierto...). Cuando el dispositivo se pliega o despliega, el MediaQuery cambia y tus widgets se reconstruyen automáticamente. No hay que suscribirse a nada.
  • Diálogos y menús conscientes del pliegue. showDialog, showMenu y PopupMenuButton ya evitan solaparse con un display feature. Si usas rutas popup propias, basta con envolverlas en DisplayFeatureSubScreen.
  • TwoPane (paquete dual_screen). Un layout de dos paneles que se colocan lado a lado, arriba y abajo o priorizando uno, y cuya división se ajusta al pliegue. Es el patrón lista–detalle de toda la vida, pero que sabe dónde está la bisagra.
  • Layouts canónicos y clases de tamaño. La guía de diseño adaptativo de Flutter y Material 3 definen breakpoints (compacto, medio, expandido) y patrones probados: navigation rail en lugar de bottom bar, panel lateral de detalle, grid en lugar de lista. Todo esto ya lo aplicamos cuando una app tiene que vivir también en iPad o en web.
  • Un solo código para iOS, Android y web. Los plegables Android llevan años en el mercado. Un equipo que ya hizo su app foldable-friendly para un Galaxy Z Fold tiene el 90% del trabajo hecho para el iPhone Duo: el mismo MediaQuery, la misma lógica de layout, el mismo test.

Si quieres el detalle de patrones de diseño adaptativo para foldables, lo desarrollamos a fondo en Flutter para el iPhone plegable: diseño adaptativo para foldables y pantallas grandes.

En Dribba llevamos trabajando con Flutter desde 2017 y somos el único consultor partner oficial de Flutter en España. Hemos visto pasar varios "nuevos formatos" (el notch, la Dynamic Island, los iPad con Stage Manager, los plegables Android). El patrón se repite: los equipos que diseñan por restricciones (ancho disponible, features de pantalla) en lugar de por dispositivo, no sufren. Los que hardcodean, sí.

Qué deberías revisar en tu app antes de octubre

Un checklist práctico, sea tu app Flutter, nativa o híbrida:

  1. Quita cualquier lógica del tipo "si es iPhone, haz X". Sustitúyela por decisiones basadas en el ancho disponible (LayoutBuilder, MediaQuery.sizeOf) y en los breakpoints de tu sistema de diseño.
  2. Diseña el estado "expandido". ¿Qué hace tu app con el doble de ancho? Lista–detalle, dos columnas, panel lateral. Si la respuesta es "lo mismo, más grande", tienes trabajo.
  3. Comprueba el reflow en caliente. Abre y cierra el dispositivo con la app en cualquier pantalla: formularios a medio rellenar, scroll a mitad de una lista, un modal abierto. Nada debe perderse ni saltar.
  4. Respeta el pliegue. Ningún CTA, ningún campo de texto, ningún diálogo centrado que quede partido. Usa displayFeatures y los widgets que ya lo tienen en cuenta.
  5. Prueba en modo lado a lado. Tu app puede ocupar media pantalla interior. Vuelve al layout compacto con gracia.
  6. Piensa en las posturas. Si tu app es de vídeo, lectura, juego o videollamada, el modo "medio abierto sobre la mesa" es una oportunidad real de producto: contenido arriba, controles abajo.
  7. Revisa el Info.plist. Si tu app declara UIRequiresFullScreen o bloquea orientaciones, hoy te está protegiendo del caos; mañana te está dejando fuera de la experiencia que Apple va a poner en el escaparate.
  8. Actualiza los tests. Golden tests y tests de widget con varios tamaños y proporciones, incluida una casi cuadrada y una con un DisplayFeature simulado en el centro. Es barato y te ahorra muchas sorpresas.

Y el futuro de las pantallas

El iPhone Duo no es el final del camino, sino una señal de hacia dónde va todo. En los últimos años hemos visto pantallas que rotan, que se pliegan en libro, que se pliegan en concha, pantallas enrollables en prototipo, relojes, coches, gafas y televisores que ejecutan apps. Los plegables siguen siendo un porcentaje pequeño del mercado de smartphones, pero Apple tiene un historial de convertir nichos en categorías y, sobre todo, de forzar a todo el ecosistema de apps a ponerse al día en un solo ciclo de iOS.

La conclusión de producto es sencilla: la "pantalla" ha dejado de ser una constante y ha pasado a ser una variable. Las apps que sobrevivan bien a esta década serán las que traten el tamaño, la proporción y la forma física como inputs, no como supuestos. Flutter, con su modelo de composición de widgets y su MediaQuery reactivo, es de las mejores herramientas que existen para diseñar así.

¿Tu app está preparada?

Si tienes una app en el App Store y no sabes cómo se va a comportar en el iPhone Duo, en Dribba podemos hacer una auditoría de adaptabilidad: revisamos layouts, estado, tests y configuración, y te entregamos un plan concreto de cambios priorizados antes de que el dispositivo llegue a las manos de tus usuarios en octubre.

Hablemos →

Dribba es una agencia de producto digital con sede en Barcelona y Andorra, especializada en Flutter, backends en Go y automatización con IA. Somos el único consultor partner oficial de Flutter en España y damos clase de desarrollo móvil en La Salle-URL (Universitat Ramon Llull) y la UPC.