Borderless screens, top notches, bottom chins, larger screens, etc. If you have bought a phone in the last 18 months then you must have noticed a trend when comparing models. The pioneers of near borderless smartphones, Samsung, first unveiled what would become the base for curved screens back in 2013.
Once the possibility of curved screens became an option, the race to who could get near borderless smartphones began. It would not be until mid-2017 to around the end of 2018 where we would get our first look at the competitor’s take on borderless smartphones. Apple, with their iPhone X, its predecessor XS Max, and “budget” alternative XR. Xiaomi, with their Mi A1 and Mi A2 line up, Samsung with their Note and Galaxy models and Google with their Pixel 3 stand out among other competitors.
Now with this came various takes on how to manage near borderless smartphones, hiding the fingerprint sensor under the screen, removing front facing cameras and instead hiding them within a mechanism between the phone. However, one trend that you either hate, or really hate, was the infamous “notch”.
This concept quickly got picked up by Apple, Google and Xiaomi, each with their own hideous take on this, creating a “borderless” screen with patches of hardware on the screen. Although some bigger than others, this brought on a new era of bigger screens.
Let’s take a step back and revise what was considered a decent smartphone screen size back in 2012. With the iPhone 5, we had a screen size of 4.0 inches ( 44.1 cm ) which would roughly give us a us a resolution of 640 x 1136 pixels. This was the norm for screen sizes.
Jumping on to the next model inline, the iPhone 6, we get an extra 0.7 inches for a grand total of a whopping 4.7 inches ( 60.9cm), giving us 750 x 1334 pixels to work with.
The higher models gave us 5.5 inches of screen meaning we were working with 1080 x 1920. Now under these measurements these big phones fit in to their own category, a Phablet. The cross of a tablet with phone properties, being able to have “huge” screens with phone capabilities.
There was one final jump to the current state of smartphones, the screen size of a normal Pixel 3 being 5.5 inches, working with a resolution of 1080 x 2160 pixels and the XL version coming in at 6.3 inches working with a resolution of 1440 x 2960 pixels.
So, what does this mean for developers? Well, let’s take an approach on web based developers. The term concept of “mobile-first” brought the idea of developing websites with the intent of users primarily visiting on their smartphones. The challenge that this brought was that you would have to factor in all the different screen sizes ( phone screen resolutions ). So basically, the elements that would be shown on screen would be limited to bare minimum on smaller screens and on bigger screens would show more elements or better ordering at the very least.
The scaling from small smartphones, normal smartphones, phablets, tablets, standard screens and bigger screens would prove to be a lengthy task when developing a websites especially when UI/UX was in play. Over the years the difference of screen sizes between manufactures became less and less until where we currently stand.
Having bigger screens made it more and more accessible for UI/UX designs to include more elements on screen and more legible texts. In short, bigger screens, better content and user experience. Now when designing websites that are “mobile-first” you are no longer obligated to limit content for smaller screens and made it more possible for “normal screens” to present a clear flow of information. This of course applies to mobile app development as well.
This has enabled very creative ways of enhancing user experience, the most notable being static elements on screen that will follow you along while browsing the website. These include Navbars, calls to action, search buttons, contact buttons, etc. This enhances user experience while not obstructing information, all thanks to having bigger screens on our mobile devices.
While the trend of having notches will most likely be temporary, it will be interesting to see how developers will work with that extra real estate with a notch in middle. What is for certain is that they will need to be very creative when it comes to the size of the notches to vary.
While time passes and users become more and more dependable of their smartphones for day to day tasks, work related tasks or simply to procrastinate, having that extra screen space makes the users experience more enjoyable. Being able to visualize more tasks on screen, reading full emails without the necessity to scroll, being able to view more memes on screen, watch your favorite videos in a bigger resolution, etc. Although I personally am not a fan of big screens, as my hands are too small for the XL smartphones, I can be objective of the benefits they provide.
Erik Torres is Fullstack Developer with Mijo! Brands, creative agency specializing in digital marketing with presence in Mexico City, Guadalajara and Puerto Vallarta. Erik is a daytime web developer and nighttime opponent in the Night Summoner’s Crevice. When he’s not out destroying newbs or setting his team members on fire during League of Legends games, you’ll find him making the world a better place one code at a time. He considers the web development as a modern art, where each pixel fulfills its own purpose, and professes a deep love for beautifully designed APIs. For this reason he strives to make back ends as legible and clean as possible from the understanding that the variables and objects are weapons massive construction when in the right hands.