Seguro que el término "píxel" no es nuevo para tí, es la unidad de medida en los productos digitales más popular, hasta que Apple introdujo la pantalla Retina.
La pantalla Retina cambió la forma en que pensamos sobre el tamaño de pantallas o dispositivos, ya que esta tecnología tiene el doble de píxeles por pulgada en la pantalla. Aunque parezcan que tengan el mismo tamaño, si comparamos 2 elementos en una pantalla retina y una no retina, el número total de píxeles que componen ese elemento es muy diferente. Por ejemplo, un botón que mide 48 píxeles de altura en una pantalla normal pasará a medir 96 píxeles de altura en una pantalla Retina, debido a la densidad de píxeles.
Desde entonces, muchas pantallas con alta densidad de píxeles “pantalla retina”, están en prácticamente todos los dispositivos. Afortunadamente, las pantallas retina se definen por el número de píxeles por pulgada cuadrada, que en caso de una pantalla estándar, tiene una densidad de 1 píxel.
El término "píxel" se sigue utilizando para describir el tamaño de una pantalla o dispositivo, aunque para evitar confusiones, muchos diseñadores y desarrolladores prefieren usar el término "punto" o "pt", que describe el tamaño, independientemente de la densidad de píxeles de la pantalla. De esta forma, independientemente de que sea una pantalla retina o una pantalla estándar, la proporción de los elementos en tu diseño, será siempre el mismo.
El sistema de cuadrículas de 8pt
Cuando trabajas con algún software de diseño, como Illustrator, Photoshop, Sketch, XD, Figma, etc., es muy común utilizar las cuadrículas o columnas, es una forma de ayudarte con la alineación y mantener la proporción.
El sistema de cuadrícula de 8pt fue presentado por el UI de Google, Material Design. Este sistema se compone de cuadrados de 8x8pt. De esta forma siempre tendrás como resultado elementos proporcionados divisibles por 8.
Conclusión
Las unidades de medida como los “px” o los “pt”, son clave para tus diseños. Evolucionar hacia el “pt”, puede ser una magnífica forma de hacer más escalables tus diseños, especialmente con el sistema de 8pt, ya que los tamaños de pantalla más comunes son divisibles por 8.
Photo by Nicole Michalou from Pexels
Referencias:
· Principles of Design: Proportion
