Tengo que diseñar una aplicación iOS en iPhone 5S, 6 y 6 Plus en Adobe Illustrator. ¿Alguien puede ayudarme con los siempre confusos PPI y las pantallas retina/retina HD y las dimensiones de estos?
Por ejemplo, primero diseño para el iPhone 5S, que es una pantalla retina con una resolución de 1136x640 píxeles. Yo uso 72 ppp en Illustrator. Ahora, dado que es una pantalla retina, estas dimensiones de píxeles lo hacen @2x, ¿verdad?
Como ahora es Illustrator, puedo exportar directamente mi mesa de trabajo a otras resoluciones de píxeles/PPI para hacer el mismo diseño que creé para 5S para 6 y 6 Plus. Pero, agregar 36 PPI a 72 PPI, lo que lo convierte en 108 PPI, en realidad no me da las dimensiones del iPhone 6 Plus.
Estoy completamente confundido en esto.
Alguien me puede ayudar con todo esto teniendo en cuenta lo siguiente por favor:
Tengo que diseñar para iPhone 5S, 6 y 6 Plus con Adobe Illustrator . Luego tengo que dar los activos en @2x y @3x a los desarrolladores.
Además, una cosa más, por favor. Los activos de retina deben ser exactamente el doble de grandes que las imágenes que no son de retina y Retina HD tres veces más grandes. Pero, ¿qué pasa con los activos de retina con diferentes dimensiones de píxeles? Por ejemplo, el iPhone 5S es retina y el iPhone 6 también. Pero tienen diferentes dimensiones, entonces, ¿qué se hará con los activos en este caso?
Cree su aplicación según la dimensión 5S. Esta multa es necesaria para el desarrollador como se muestra a continuación. La pantalla Retina para iPhone 4S, 5, 5S y 6 usa @2x y solo para 6plus ofrece un valor de @3x.
Para obtener más referencias sobre el tamaño de los activos y las pautas, consulte el siguiente enlace. http://iosdesign.ivomynttinen.com/
Diseñe en puntos, luego escale.
Un punto que alguna vez fue un solo píxel en dispositivos sin retina. En el mundo de los dispositivos retina @2x, un punto ahora tiene 2x2 píxeles (4 píxeles forman un solo punto), y en el mundo de los dispositivos retina @3x (6 Plus), un punto ahora tiene 3x3 píxeles (9 píxeles forman un punto único). El iPhone 6 Plus también reduce la escala automáticamente (de 1242x2208 a 1080x1920), pero debes olvidarte de ese hecho cuando diseñes. La reducción de muestreo está fuera de su control. Significa que la GUI no es perfecta en píxeles, pero el PPI en 6 Plus es tan alto que aún se ve más nítido.
Los tamaños de puntos, para cada dispositivo en el que debe diseñar, son:
Para 4S: 320x480
Para 5/5S: 320x568
Para 6: 375x667
Para 6 Más: 414x736
En Illustrator, haga sus diseños en puntos (yo hago estos tamaños en píxeles), luego, después del diseño inicial, amplíelos.
Para iPhone 5/5S, escale en un 200%, esto le dará su diseño @2x.
Para iPhone 6, también escale en un 200%, esto le dará su diseño @2x.
Para iPhone 6 Plus, escale en un 300%, esto le dará su diseño @3x.
Después de la escala, puede ajustar su arte de píxeles, si desea aprovechar los píxeles individuales en un dispositivo @2x o @3x, por ejemplo.
Aquí también hay un excelente artículo que lo ayudará a visualizar esta información: http://www.paintcodeapp.com/news/iphone-6-screens-demystified
¡Espero que esto ayude!
Juan B
KMSTR
DA01