Acabo de tomar un proyecto sobre el diseño de aplicaciones para Android. Estoy empezando a aprender sobre el diseño de aplicaciones y esto de los dpi realmente me está tirando por la borda. Mis principales preocupaciones son:
1) ¿Qué es Dpi (no soy programador, por lo que no tengo conocimiento en esta área)
Cómo cambia el Dpi de un dispositivo a otro. Por favor explique con ejemplos. Empecé a diseñar para un tamaño de pantalla de Nexus 5 (1020x1920), que también es una plantilla de diseño de aplicación predeterminada en PS.
a) La cuestión es que Google declaró que nexus5 es xxhdpi, así que usé íconos de 48 dp de sus recursos de íconos, que son enormes.
b) Cómo se escalan los íconos de dpi, etc. y cuál debería ser el tamaño correcto para nexus5
c) Normalmente diseño sitios web, así que estoy atascado con píxeles. Entonces, explique los píxeles wrt (o de qué manera esa es la mejor práctica para el diseño de aplicaciones)
2) Tamaños de pantalla y mejores prácticas
Después de investigar un poco, me di cuenta de que el diseño debería adaptarse a diferentes tamaños de pantalla. Entonces, ¿por dónde empiezo y cuál es la mejor práctica? Hasta ahora me di cuenta de que las pantallas de 5 pulgadas están a la cabeza, seguidas de las SG Notes de 5,5 pulgadas, etc. En mi país, la pantalla de 5 pulgadas se usa como máximo. Por favor recomiende.
3) Tipografía Este es un gran problema. Qué tamaño de fuente es el más adecuado para (1020x1920) y (720x1280) o el tamaño que usted diga.
a) ¿Cuál es el tamaño estándar para el encabezado/barra de acción? El encabezado de la tarjeta principal y el texto normal en las tarjetas. b) ¿Cómo cambia sp de un dispositivo a otro (ppp, etc.). Y cómo calcular estas cosas en píxeles.
Sé que estas son muchas preguntas, pero estoy realmente atascado. Si logro este proyecto... Cambiaría drásticamente mi carrera de diseño.
Por favor ayuda
Gracias en adv.
Usted hace bastantes preguntas a la vez aquí, demasiadas para que todas puedan responderse en una sola respuesta. Me limitaré aquí a explicar lo que creo que es la fuente básica de su confusión: las diferentes unidades de medida.
DPI son puntos por pulgada (esto se puede buscar fácilmente, incluso está en la mayoría de los diccionarios), que es una medida utilizada para definir la densidad de los escáneres, impresoras y otras cosas del "mundo real". Para las pantallas, la unidad tradicional es PPI, píxeles por pulgada (aunque algunos, como la página de documentación de Android vinculada a continuación, también usan engañosamente DPI para pantallas).
DP son píxeles independientes de la densidad , una unidad creada para tener en cuenta la densidad variable (en PPI) de diferentes tipos de pantallas.
'Densidad', como sugieren los nombres DPI y PPI, se refiere a cuántos píxeles contiene un determinado tipo de pantalla en el espacio físico de una pulgada, es decir, el tamaño físico de cada píxel individual.
Si tiene una pantalla que tiene un tamaño físico de 5" x 5" (supongamos que es rectangular para facilitar el cálculo) y una densidad de 96ppi (lo suficientemente común en las pantallas móviles más antiguas), la pantalla completa consta de (5 x 96 ) x (5 x 96) px = 480 x 480 px = 230 400 píxeles. Si haces un cuadro de 480 píxeles de ancho y 120 píxeles de alto, ocupará todo el ancho de la pantalla y una cuarta parte de su altura.
Si tiene una pantalla más nueva del mismo tamaño físico, pero con píxeles más pequeños a 326 ppp, ese número cambia drásticamente: (5 x 326) x (5 x 326) px = 1980 x 1980 px = 7,762,392,000 píxeles. Eso es aproximadamente 33,690 veces más píxeles en el mismo espacio físico. Obviamente, si ve el mismo cuadro de 480 x 120 px que antes en esta pantalla, ocupará menos de un cuarto del ancho de la pantalla, y solo alrededor de un dieciseisavo de la altura: será diminuto .
Los píxeles independientes de la densidad son una forma de evitar esto, al menos en parte. Se basan en una densidad específica de 160 ppi, ignorando cuál es la densidad real de la pantalla. Usemos el mismo cuadro en las mismas dos pantallas nuevamente, pero esta vez defínalo en dp en lugar de px. Para calcular qué tan grande aparecerá realmente la caja en las pantallas, ahora necesitamos encontrar la relación entre la pantalla base imaginaria (160 ppp) y la pantalla física: la pequeña de 96 ppp tiene una relación de 160/96 ≈ 1,67 ( 1 ²⁄₃), mientras que el grande de 326 ppp tiene una relación de 160/326 ≈ 0,5. El tamaño que aparecerá la caja en las pantallas es su tamaño en dp dividido por esta relación:
Si tomamos estos tamaños como relativos al tamaño de toda la pantalla, podemos ver como ahora están mucho más cerca uno del otro:
Entonces, donde definir el tamaño del cuadro en px absolutos lo hizo 100% x 25% en una pantalla y 25% x 6% en la otra pantalla (una gran diferencia), definirlo en dp hace que parezcan bastante cerca de ser el mismo tamaño en ambas pantallas.
Casi lo mismo podría lograrse definiéndolo en porcentaje, pero como probablemente ya sepa del diseño web 'normal', los porcentajes tienen sus propios problemas y advertencias; los píxeles independientes de la densidad son una forma de obtener una apariencia más uniforme a partir de una unidad de medida absoluta.
Cuando se trata de tipografía, debe usar la unidad SP ( píxeles independientes de la escala ) en lugar de DP. SP funciona de la misma manera que DP, pero también tiene en cuenta las preferencias de tamaño de texto del usuario. Entonces, si un usuario ha configurado las preferencias básicas en su teléfono para usar siempre texto más grande (digamos, 120 % del tamaño normal), el texto configurado en 12 sp será 12 dp x 120 % = 14,4 dp; es decir:
A los efectos de entender lo que son, PPI y DPI son exactamente lo mismo, puntos o píxeles por pulgada. PPI es la versión digital de DPI.
Lo que debe comprender es que un punto o un píxel no tiene tamaño físico. Puede ser 0,0000001 mm 2 o 1 m 2 . Cuando te acercas demasiado a un gran tablero de publicidad digital al aire libre, puedes ver los píxeles y son bastante grandes.
Si un archivo tiene 72 DPI/PPI, eso significa que hay 72 puntos o píxeles comprimidos en cada pulgada. Cuantos más puntos/píxeles por pulgada, mayor será la calidad de la imagen.
Ahora, si no recuerdo mal, mi Nexus 5 tiene una pantalla de 442 PPI. Eso significa que han colocado 442 píxeles en cada pulgada. Cuando observa una imagen de 442 PPI en una pantalla de computadora portátil estándar de 72-96 PPI con un zoom del 100%, será casi 5 veces más grande que una imagen de resolución estándar de 96 PPI porque tiene casi 5 veces más píxeles.
Entonces, la conclusión es que, para pantallas de mayor calidad, necesita gráficos de mayor calidad (más grandes).
Si alguien más está atascado donde estoy... Encontré una solución. Esto es lo que hice para evitar el cálculo de píxeles.
1) Cree un nuevo archivo en Photoshop con las dimensiones de su dispositivo. para el mío es 1080x1920 para nexus5.
3) Visite este enlace: https://www.youtube.com/watch?v=8f3h7id7EN0
asegúrese de desmarcar volver a muestrear si está usando Photoshop cc. o cambiará las dimensiones de su documento.
4) Ahora todo se puede medir en dp.
Todavía estoy completando el diseño. Te informaré si funciona de verdad. Hasta ahora, la barra de acción, la barra de estado y la barra de navegación coinciden en términos de medición.
Todos los que respondieron... Gracias por la paciencia y la orientación. Gracias a todos.
Yorik
paulina
paulina
tushar bosé