How does 18:9 screen format affect the design and creation of mobile applications

Written by

It’s been a little over half a year since the Xiaomi Mi Mix was introduced, a smartphone that was presented as a phone with a few frames and that was released in the 17:9 format. Months later, with complaints about the black stripes that appeared in some applications, the LG G6 was presented in 18:9 format, and later, the Samsung Galaxy S8 with a similar format.

What is the 18:9 screen format?

This format is a new ratio used in some smartphones like the ones previously mentioned. Normally smartphones usually have a ratio of 16:9, but these have lengthened the screen more than normal. When you have a terminal with this size ratio you see a clear lack of frames, and that is why some firms like Samsung talk about “an infinite screen”.

This reduction of frames means that manufacturers add more pixels to the screen, and that is also why signatures have to change the screen. We give you an example, when you see a movie on your computer, you see some black stripes up and down, and that is because the movies are recorded in 1:1 or 4:3 format.

It’s the same, for example, on YouTube, videos are usually recorded in 16:9, and that’s why on your smartphone the videos are seen in full screen without any black stripe, apart from the black strip that is between the screen and the body of the device, of course.

Not everything is wonderful with this new format, since like any new innovation, at the beginning it has some disadvantages. This new ratio was not going to be less, and has two main problems. We will begin by talking about perhaps the most known one.

How does this new screen format affects creation of mobile applications and content?

As mentioned before, YouTube videos are usually recorded in 16:9 format and not in 18:9, which would cause a lack of pixels on both sides of the screen. As you have been able to deduce, these pixels do not fill magically. What will happen is that you will have to see at all times some small black stripes on both sides of the screen.

There is also another problem, and is that it is likely to see something less information than in other screens somewhat smaller, such as if we compare a Galaxy S8 with a Galaxy S7, where you can see a small loss of information.

Indeed, there are some contents adapted for this new proportion. To give an example, there are some series like “Narcos” or “House Of Cards” that are adapted and you can watch the show taking advantage of the maximum size of the screen. Yes, on Netflix.

We must also warn that this is not typical, since most Netflix content is still not adapted. This is because increasing the size to this format would cause some quality to be lost, so a large outlay in audiovisual material is needed to achieve this adaptation.

In terms of applications, the same thing does not happen, since, for example, in the case of LG, it has an application scaling system so that we can use the applications without having to support stripes at all times. This causes a minimal loss of information.

How to adapt the design of mobile application and games?

Unfortunately, in games there is this escalation, although it causes to lose some more information at the sides. While in Real Racing 3 style games or similar to penalties is not noticeable, in Clash Royale it can affect something else. That’s why it is better to show the black stripes for games, since it can become more comfortable.

The way to adapt it is simple, when you open a game and deploy the notification bar or remove the touch buttons, you will see an icon on the top right, if you click on it, a window with different options will appear. If you select the full screen, the game will be displayed completely. On the other hand, if you select compatibility, small strips will appear.

In the case of the applications themselves it is also simple, you just have to go to the settings, screen, scaling of applications and select what screen format you want, just as it happens with games. We must indicate that this only happens in LG, since the rest of manufacturers have other systems of re-escalation.

For the image to occupy the entire surface of the screen in applications that allow the full screen, it is necessary to activate the 18:9 mode. What this function does is to enlarge the image, but this can cause us to lose information on the sides depending on what applications.

Having the option of scaling is appreciated when it comes to enjoying games in full screen, but it is not a very intuitive solution since we have to configure it application by application, and not all of it has the expected effect. In this sense, the scaling in the LG G6 is more a temporary patch until there is more content adapted to this format.

The applications of the system maintain a very Material Design line but have their own design. We see it in native tools such as the phone app, clock, notes, voice recorder and many others. Very few of these applications have full screen mode, so the bottom navigation bar is visible, although according to the app, your background may be transparent.

This is a situation that recalls the arrival of the first 4K televisions: the advantages of the new resolution standard were clear, the problem is that there was not enough content to take advantage of it. However, this should be a temporary situation. We recently learned that more than 100 adapted applications will arrive and the trend of the market towards mobile phones without frames will make the most elongated screens proliferate.

No Comments Yet.

Leave Your Comment