Con el anuncio del nuevo iPhone X que añade otra relación de aspecto a la plantilla del iPhone, me encontré con que no entendía del todo parte del vocabulario de diseño que se estaba utilizando. Como he hecho con muchos temas que tenía problemas para envolver mi mente, como el cumplimiento de la ADA y la criptografía, escribí sobre ello. Si te has encontrado con dificultades para comprender algunos conceptos básicos de diseño, estas explicaciones de vocabulario de diseño común te ayudarán.
Tamaños de pantalla, resoluciones, píxeles y relaciones de aspecto para iPhones
Tamaño de pantalla
Las dimensiones físicas de una pantalla. De forma similar a como se miden los televisores y los monitores, es la longitud, en pulgadas, de la pantalla desde una esquina hasta la esquina diagonal.
Píxeles
Las pantallas muestran imágenes a través de píxeles. Un píxel es un punto que puede ser manipulado. Son como bloques de construcción; se necesitan muchos para construir una imagen. Si coloreas los cuadrados de un trozo de papel cuadriculado para crear una imagen, cada uno de esos cuadrados sería como un píxel. Los píxeles no siempre tienen el mismo tamaño de un dispositivo a otro.
Digamos que tienes un dibujo en una hoja de papel normal que quieres duplicar en una pared. Imagina que añades una cuadrícula superpuesta de 10 casillas por 10 casillas, creando una cuadrícula de 10×10 en el nuevo espacio y luego transfiriendo la imagen, casilla por casilla a la pared. Tendría el mismo número de píxeles y la misma imagen, sólo que los píxeles son de mayor tamaño.
Resolución
Es el número de píxeles que se muestran en la pantalla. A menudo se formatea como ancho x alto o píxeles por pulgada. Como los píxeles no son siempre del mismo tamaño, es posible tener dos dispositivos con el mismo tamaño de pantalla y diferentes resoluciones. Cuanto mayor sea la resolución, mayor será la calidad de la imagen y más detalles se incluirán en ella.
Relación de aspecto
¿Qué proporción tiene la anchura y la altura de la pantalla? La relación de aspecto mide la anchura respecto a la altura y luego la reduce, como si fuera una fracción. Una pantalla de 4 x 8 o de 20 x 40 tendrían ambas resoluciones de 1:2. Esto es importante porque una imagen de 2:3 no encaja perfectamente en una pantalla de 1:2. Los bordes se extenderían más allá de lo que es visible en la pantalla, tendrían secciones de la pantalla que no están cubiertas por la imagen, o una imagen estirada.
¿Te ha ayudado esto a entender un poco más el diseño? Tienes otros conceptos en los que te atascas? Háznoslo saber.
