Mejores prácticas de tamaño de imagen para aplicaciones móviles

Question

Estoy creando una aplicación móvil que se dirigirá a teléfonos iPhone/iPad y Android. La aplicación implicará que los usuarios tomen fotografías y carguen en mi servidor y luego los usuarios podrán ver esas fotos en sus dispositivos móviles (aunque no necesariamente sus propias fotos para que un usuario de Android pueda mirar una foto tomada con un iPhone)

¿Qué tamaños debo guardar las fotos para poder cubrir la mayoría de los casos de uso? Los iPads tienen 1.333 W/H, la mayoría de los teléfonos móviles tienen 1.5 o 1.333 W/H con algunos raros 1.666 W/H. Específicamente:

iPad: 1024x768, iPad3: 2048x1536, iPhone y algunos otros teléfonos: 960x640, 480x320, 800x480.

Para poder mantenerlo manejable, necesito decidir algunos tamaños de imagen y guardar las fotos en esos tamaños. Realmente no estoy buscando ayuda en el aspecto técnico. Puedo hacer escalas de imagen en el lado del servidor, etc. Estoy buscando recomendaciones/mejores prácticas/lecciones aprendidas sobre el tamaño de las imágenes antes de ir demasiado lejos en su construcción.

• ¿En qué tamaños debo guardar las fotografías para cubrir la mayoría de los casos de uso?
• ¿Recomienda cualquier escalado del lado del cliente antes de cargarlo en el servidor para ahorrar en el tiempo de transferencia (por ejemplo, reducir la escala de fotos de 2048x1536 iPad) o debería siempre transferir originales?
• ¿Cómo debo manejar tamaños de imagen incompatibles (mostrando una imagen tomada con un iPad en un dispositivo Android, por ejemplo)? ¿Debo precortar esas imágenes en mi servidor antes de enviarlas al cliente o debería dejar que el teléfono del cliente maneje el cambio de tamaño de la imagen?
• También está el problema de la IU. Habrá otras cosas en la página que no sean la foto, tal vez un botón o dos para la navegación. ¿Debo elegir algo más pequeño que el tamaño de pantalla completa manteniendo la misma relación de aspecto al guardar imágenes?

Sé que algunas de estas preguntas no tienen una respuesta y las respuestas son relativas, pero quería obtener algunas opiniones. Gracias.

Answer 1

que no tienen una respuesta completa para usted, pero tengo algunas ideas ...

1) me gustaría sugerir la reducción de los tamaños de las imágenes antes de subir. Si estuviera usando su aplicación y tuviera que subir una foto de 4 megas, cada vez que quisiera usar su aplicación probablemente pasaría. Y a medida que avanzamos, estamos alcanzando una tecnología mucho mejor en términos de teléfonos con cámara; Nokia lanzó una cámara de 41 megapíxeles, que supongo que creará imágenes bastante grandes. Los usuarios que tienen que descargar una imagen de 4-6 MB tampoco son una gran idea. Solo algunos pensamientos desde el punto de vista de un usuario.

2) No cortaría las imágenes. No necesariamente sabes qué partes de la imagen no son importantes, entonces, ¿cómo sabrías dónde cortarla? Deje que el teléfono ajuste el tamaño de las imágenes en consecuencia y confíe en la capacidad de acercar imágenes para ver las cosas en un tamaño mayor.

3) Podría tratar de hacer una interfaz de usuario que oculte los botones. Si tiene algo realmente simple (como avanzar o retroceder), puede confiar en los controles de gestos (deslizar) para moverse por su aplicación. Puede implementar cajones deslizantes y menús que ocupan espacio temporalmente, cuando están en uso, pero le devuelven el espacio cuando desea mirar el contenido principal (imágenes, en su caso). Normalmente he descubierto que ocultar botones no funciona bien y parece que las personas quieren/buscan botones que les permitan navegar, pero la galería de Android funciona bien solo con menú + deslizamiento, así que quién sabe realmente.

Answer 2

Para Android, creo que el mejor lugar para que usted comience estaría aquí, tiene una gran cantidad de información, incluyendo los tamaños de pantalla estándar y cómo mostrar imágenes mientras se les mantiene en la mejor calidad posible.

http://developer.android.com/guide/practices/screens_support.html

También me sugieren hacer tanto como sea posible la manipulación de imágenes en su servidor. Las imágenes son un dolor para trabajar con Android debido a las limitaciones de memoria y la fragmentación. Dos móviles pueden guardar fotografías hechas de la misma manera con diferentes orientaciones, y no hay forma sencilla de manejar las rotaciones, aunque se puede hacer (por suerte, todavía tengo que encontrar un teléfono que registra incorrectamente los datos Exif, pero no me se sorprenderá si existieran ...). Cuanto más se confía en el teléfono para hacer, más posibilidades tienes de error debido a los fabricantes poner envolturas alrededor y otras personalizaciones de la forma en que maneja los medios de comunicación.

En cuanto a cómo mostrar, idealmente si su back-end ya está haciendo un montón de tamaños diferentes, puede incluir su densidad de pantalla cuando solicita las imágenes y envía el mejor tamaño según la guía de desarrollo. Si desea mantener las diferencias al mínimo, por lo menos med de apoyo o de alta densidad para móviles, y de alta densidad extra para tabletas.

Sólo mis dos centavos, estoy seguro de que tendrá una gran cantidad de opiniones. Buena suerte.