DEV Community

Marta Ruiz
Marta Ruiz

Posted on

Probar diseños para un plegable de dos pantallas sin tener el teléfono

El iPhone Duo salió el 23 de octubre y en Estados Unidos un pedido nuevo seguía marcando entrega a finales de enero. Si haces interfaces, eso significa semanas, o meses, preparando pantallas para un aparato que no tienes en la mano. Estas son las notas de cómo lo estoy haciendo.

1. Partir de las medidas publicadas

Apple publica una pantalla interior de 7,6 pulgadas y una exterior de 5,4. No inventes resoluciones en CSS a partir de rumores: diseña con contenedores flexibles y comprueba los cortes con datos oficiales cuando los tengas.

2. Cuidado con Safari en la pantalla exterior

Según un artículo de WebKit del 23 de octubre, Safari 27.1 en la pantalla exterior limita la página a la zona junto a los controles laterales y rellena la franja restante con el color de fondo de la página. Consecuencia práctica: define bien background-color en html y body, porque esa franja se verá.

3. Previsualizar la forma en el navegador

Para ver cómo queda una foto o un vídeo plegado, en horizontal o en modo sobremesa, uso un simulador 3D en el navegador. Permite ajustar el pliegue, añadir tus imágenes y exportar una pequeña película. Hay además un visor de código abierto con licencia MIT que se puede leer y modificar.

Ojo con sus límites: es una simulación. No ejecuta iOS ni instala apps del App Store, así que el rendimiento, el agarre y el comportamiento de apps reales hay que probarlos en un dispositivo físico o en el simulador de Xcode.

Si quieres probarlo, este es el simulador 3D y demo interactiva del iPhone Duo, parte de una guía independiente que no está afiliada a Apple.

Resumen

  • Medidas oficiales, no rumores.
  • Color de fondo definido para la franja de Safari en la pantalla exterior.
  • Simulación para composición; dispositivo real para rendimiento. Este artículo no está afiliado a Apple y no usa imágenes de Apple.

Top comments (0)