fbpx

Over the last decade, smartphones have morphed from simple gadgets for making calls and texting to powerful mobility computing artefacts. For instance, some modern smartphones like the Samsung Galaxy Note20, comes with 8GB of RAM and has more computing power than the average personal computer.

Galaxy Note20 has more RAM and power than most PCs. Image Credit: gsmarena.com

So, as mobile phones continually get more powerful, we shall expect the gap between conventional PCs and smartphones to shrink even more. This also means that we shall probably see more high-powered smartphones with more RAM, larger phone resolutions, and better connectivity capabilities.

The History of Phone Resolution

IBM released the first ‘smartphone’ or personal digital assistant (PDA) in 1992, dubbed the Simon Personal Communicator. This groundbreaking device, launched 15 years before the iPhone, featured a black-and-white 160 x 293 LCD touchscreen that was 4.5 inches by 1.4 inches. In 2001, Nokia launched the first smartphone to constitute a monochromatic display.

The first smartphone by IBM. Image Credit: verdict.co.uk

Subsequently, in 2007, the iPhone became the most cutting-edge smartphone with a dedicated operating system, responsive touchscreen, and a state-of-the-art touch interface, replacing the traditional QWERTY keyboard. 

The evolution of the iPhone. Image Credit: 9to5mac.com

With the pace set by Apple, the smartphone market has evolved with six main display types utilized in mobile devices now:

In essence, phone resolution and screen types have also dramatically advanced over the years. But before we get ahead of ourselves, let’s delve further into phone resolution with regards to mobile devices.

What Is a Phone Resolution?

Generally, phone resolution is the number of pixels across a mobile device screen multiplied by the number of pixels. Phone resolution principally depends on two significant factors, the screen size, and pixel count.

In practice, this means that a smartphone with a higher resolution contains more pixels, and more pixels deliver the ability to display more visual information with greater clarity and detail.

Image Credit: statcounter.com

This means that if an individual wants a smartphone with higher levels of pixel detail, they’ll need a phone screen resolution of at least 1920 x 1080. However, if picture quality is not a big deal, they can always choose lower screen resolution devices.

Image Credit: sebastien-gabriel.com/

Why Does Screen Size and Screen (Phone) Resolution Matter?

Screen size and screen resolution are two significant components that affect an app’s format and user experience. In practice, there are vital considerations every app designer must pay attention to in order to achieve a user-friendly interface. For example, App designers must design with portrait and landscape orientations in mind for a consistent experience.

Essentially, screen size focuses on the physical measurement of the screen in inches, while screen resolution is the number of pixels on a screen. For example, a smartphone with a 5-inch screen size can constitute a resolution of 320 X 480 points. It’s important to note that screens of the same sizes can have different resolutions.

The first iPhone had a resolution of 320 × 480 with 163 PPI. Image Credit: computerworld.com

Pixel count also matters because smaller pixels tend to have lower efficiency. After all, the transistors that drive each pixel, grab a more significant proportion of the area of each pixel. Ideally, a higher-resolution screen with the same size will probably require a more powerful backlight (LCD) or more power to the pixels (OLED) to maintain the same brightness.

Unfortunately, app developers cannot individually design for every single device. Rather, mobile app designers choose to group styling into typical sizes for tablets and smartphones while programmatically considering particular screen sizes and pixel density. In practice, designers simply try to control the visual language to suit different dynamic devices. This means being intentional and clear about the dimensions.

Which Elements Make Up Phone Resolution?

When compared to PCs, smartphones maintain smaller screens with unique display densities and aspect ratios. Since we have now established that phone resolutions principally revolved around screen size and pixels, it’s only prudent to break what those factors entail.

Pixels

A pixel is a picture element that constitutes a single group of colored dots on a mobile phone, typically red, green, and blue. In practice, by manipulating them at different intensities, disparate colors and brightness variations can be generated.

Generally, the color black is created when all the dots are off, while the color white is generated when red, green, and blue dots are all on at the same time. In summary, pixels generate the light on a mobile that allows a user to see what’s being displayed on the screen.

Pixels per Inch (PPI)

Pixels per inch is the unit of measurement utilized to quantify the number of pixels displayed on the surface of a square inch. In practice, on a phone screen, a square inch is separated and arranged in a series of cells to achieve a better picture of what it entails. Essentially, each cell inside the grid maintains a pixel within it. So, PPI is measured by the number of cells within the grid (pixels). PPI can be accurately calculated online with an online PPI calculator.

Dots Per Inch (DPI)

Dots per inch is the measurement of the number of dots that can be input into a line over an inch/2.54 centimeters. DPI is typically represented by a written paper or a digital scan size. In practice, the larger the number of the lines, the better the print or scan quality. DPI can also be calculated with an online DPI calculator.

The Difference Between PPI and DPI

While PPI and DPI are sometimes interchangeably utilized to measure the number of pixels on a screen or might seem the same, they actually differ. The similarities stem from the fact that pixels can easily be equated with dots, probably since they are incredibly tiny. In practice, 1dp is roughly equal to 1px. However, PPI typically applies to displays and visual components, while DPI is more used in relation to items like written material.

For instance, for a character or illustration, the clarity and accuracy of the printed document is accurately determined by the amount of ink dots. In this same vein, similar objects can be calculated by both DPI and PPI. However, pixels are not dots, and dots are not pixels. So, in that regard, DPI is not the same as PPI.

How are Pixels Calculated?

Screen size is typically represented in inches as the real size of a phone’s screen is measured diagonally. On the other hand, phone resolution is calculated by the number of pixels displayed in each dimension.

For instance, the first iPhone was 3.5 Inches in size and maintained 320 pixels across and 480 pixels down, scientifically written as 320×480. However, more modern 5-inch smartphones maintain a resolution comparable with that of a high definition (HD) TV, 1920×1080. It seems we have really come from far, right? That being said, to calculate the pixels per inch (PPI), you need to know the screen size as well as the resolution.

Image Credit: sebastien-gabriel.com

Furthermore, when calculating the number of pixels per single inch of a screen, it is essential to remember that a higher DPI means that each pixel’s size should be small. This is so that the screen is well adjusted in that particular space.

To calculate PPI, you need to take both the dimensions in screen resolution. Subsequently, square both those dimensions and take the square-root of the result, then divide the final result by the size of the screen. 

For instance, if the screen size is 5.8 inches and the phone resolution is 1138 X 680, then PPI will be calculated as –1138X 1138 + 680 X 680 = 1757444. The square root of 1757444 is calculated as 1325.69, then divided by the screen size (5.8 inches), 1325.69/5.8 = 228.5 PPI (pixels per inch).

Density Independent Pixels

This is a measurement unit more popular in Android devices. A density-independent pixel is essentially a virtual pixel unit utilized while planning a user interface (UI) layout to define the dimensions or position, irrespective of the pixel density.

Android Screen Densities. Image Credit: medium.com/@sashaserg

Points

On the other hand, points are the resolution-independent equivalent measurement on iPhones. A point can constitute multiple pixels, depending on the pixel density of a phone screen. When designing for different types of devices, mobile app designers practically consider points, but design in pixels.

Image Credit: gregoryschmidt.ca

Why Designing for PCs Is Different from Designing for Mobile Devices

Since phone resolutions differ from personal computer resolutions, multiple factors come into play when designing applications for both verticals. For example, different user behaviour, touch screen considerations, device limitations, and disparate mobile browser configurations and operating systems make mobile, and computer designs differ substantially.

However, multiple tools now exist to bridge the gap and create responsive designs for both desktop and mobile that consider both PC and phone resolution and sizes.

User Interface Design and Phone Resolution

All things considered, phone resolution matters during user interface design. The end goal of both elements is to allow the user to reach their goal with the minimum amount of resistance, hustle, or frustration.

To achieve this, there are 10 heuristics (recommendations) typically considered for great user interface design. When carefully considering phone resolution and pixels, the heuristics summarised below can be utilized to great effect.

Image Credit: uxdesign.cc

How Does Phone Resolution Affect Mobile Video Game Play?

PPI and DPI impact mobile gaming, especially regarding the smoothness and flow of the video game.

In practice, a higher pixel density (PPI), means that you’ll have even more clarity about something that’s viewed on your smartphone. This translates into better clearer lines, gaming, sensitivity, better fonts, higher efficiency, and images. The same principles apply to DPI. DPI influences the crispness and clarity of an image as the more pixels in an inch, the smaller the pixels are. This means that images will seem less pixelated the closer you are to the screen.  Additionally, a higher DPI means that the sensitivity of touch on your mobile’s screen will be better.

However, it’s worth noting that excessive DPI can cause problems while playing games. As such, it’s important to find the right balance of PPI and DPI using a PPI and DPI calculator when designing games.

How Does Phone Resolution Affect Phone Battery Life?

For modern smartphones, the screen is typically the largest consumer of battery power. However, irrespective of the resolution of the content “behind” the screen, rendering more pixels on a phone increases required processing power, which, in turn, decreases battery life.  On the other hand, lowering the phone resolution saves battery power by reducing the required processing power.

In essence, different smartphones like Samsung allow different screen resolution settings, two of which can allow you to save battery life. However, changing DPI doesn’t individually affect battery life, and you can’t change the PPI of a device since it’s hardware-based.

Concluding Remarks

Ultimately, we have carefully dissected the elements that constitute phone resolution. For instance, we have seen that a higher resolution means more detail, and a higher DPI means higher resolution. Notwithstanding, the challenge will always be how to cope with the differences in different screen sizes in relation to phone resolution without sacrificing the user experience.

Leave a Reply

Close Menu