O'Reilly logo

UX Design for Mobile by Pau Giner, Pablo Perea

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Understanding units and pixel densities

Pixels (px) are the smallest physical squares we find on digital screens. These are addressable, and we can define their color in an image or an application. As we now have devices with different concentrations of pixels per inch, if we define our assets with reference to these pixels, the icons or elements we design will be rendered in very different sizes according to the screen where they are displayed. A 24x24 px icon will be the correct size on a mobile with a low-density screen, but will appear very small when displayed on a mobile with a high-resolution screen.

If a file is not created taking into consideration the size at which it will be displayed, or if it is scaled in the rendering process, ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required