Diseño para dispositivos móviles y la densidad de pantalla

Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedIn

Una de las cosas que más nos está trayendo de cabeza a los desarrolladores web, es la optimización de nuestros diseños para los distintos dispositivos móviles. Muchos piensan que esto, es una cuestión de tamaño, pero no es así. La gran diferencia que tiene un dispositivo con respecto a otro es la resolución de su pantalla.

La resolución de la pantalla es la clave para poder lograr unos acabados de calidad debido a la denominada densidad de la pantalla, presente en un espectro cada vez más amplio de dispositivos móviles. Esto es lo que a día de hoy nos está dando más trabajo a los desarrolladores para tener aplicaciones que se adapten de la mejor manera posible a la densidad de pantalla de los distintos dispositivos móviles.

 

 ¿Qué es la densidad de pantalla?

La densidad de la pantalla, se mide de forma distinta según el sistema operativo. Como siempre, esto nos trae dolores de cabeza. Por un lado iOS, mide la densidad en ppp (píxeles por pulgada) y Android por su parte lo hace por DPI (puntos por pulgada). Cuantos más píxeles o puntos caben en una pantalla, mayor será la densidad de la misma y su resolución.

Cada vez que las distintas empresas, sacan un nuevo modelo de dispositivo móvil, la calidad de las pantallas aumenta. Un claro ejemplo es el primer iPad, que tenía una pantalla denominada no retina. Ahora unos años después, la pantalla de los actuales iPad tiene una densidad de pantalla mucho mayor. Por su lado Android, empezaron igualmente con pantallas de baja densidad LPDI, y a día de hoy cuenta con unas pantallas XHDPI, de muy alta calidad.

Y entonces… ¿cómo pasamos de una densidad a otra?

A día de hoy, disponemos de una infinidad de dispositivos móviles, cada uno adopta el sistema operativo que cree pertinente. A pesar de todo, iOs y Android son los principales sistemas operativos instalados en los dispositivos móviles. Aunque se que hay muchas más plataformas que también tienen un interesante parque móvil, lo más seguro que es tengáis que desarrollar para alguna de las dos plataformas mayoritarias.

Una de las tareas más complejas, es saber como nuestro diseño de interfaz de usuario se verá afectado en las distintas densidades. Además otras de las cosas que nos tienen que preocupar es como se escala nuestro diseño. Por eso, os voy a dejar varias herramientas que os van a ayudar a la hora de saber exactamente que medidas deben tener vuestros diseños, para que no os llevéis ninguna sorpresa.

1. El conversor de densidad de pantalla de teehan+lax density

 

2. El conversor de densidad de pantalla de para Android

 

3. Aquí os dejo una aplicación de Android para calcular la densidad de pantalla

 

4. Aquí os dejo una aplicación de iPhone para calcular la densidad de pantalla

 

Espero que os sirva de utilidad, y que os resulte más sencillo diseñar vuestras aplicaciones para dispositivos móviles.

Presidente de ADWE (Asociación Desarrolladores Web de España) - Socio/Fundador Dinamiclab, empresa desarrollo web - IT Brain en DinamicBrain.

Comentarios arrow Un Comentario
  1. El «gran problema» de todo esto no está en la densidad de píxeles de cada dispositivo, si no, en como detectar la densidad del dispositivo de forma automática al visitar una web para que esta adapte sus contenidos sin intervención del usuario.

Escribe un comentario

Tu e-mail no será publicado. Los campos marcados con un asterisco son obligatorios.