Mobile UI Design: Basic Types of Screens

Muskan Soni
4 min readDec 16, 2020

Since 2.71 billion people worldwide use smartphones and mobile apps for making their lives easier, it is important that out of the ~6,140 that are released every day, your app stands out. How? Well, the first impression is the last impression. And what could be the first thing that a person would see in your app? That’s right, the interface! So, it is important to have a pleasing mobile user interface (UI) to ensure that your user sticks by and enjoys browsing the app.

Splash Screen

When a user open an app, splash screen is the first thing that appears. The goal behind this screen is to maximize the impact with minimum elements. A simple screen might consist of a logo, slogan of the product, and a CTA. To keep things simple — a designer should keep the animation duration between 4–8 seconds. Anything more than that will annoy the user and they will stop using your app. A word of advice is to use display loading progress so that it develops some excitement among the users.

Home and menu screens

Home screen is an essential part of any application. In the context of mobile apps, it’s the main screen from which users interact with most options of the application. Home screens are designed depending on the type of product and its purpose still there are some key elements common for different kinds. First of all, the main screen usually includes the search field or button so that users could easily search for the content they need. Also, since the home screen is a start point for the user journey, it often contains navigation elements providing access to the various content sections.

Onboarding screen

The onboarding screens are a collection of screens with a purpose to demonstrate a mobile app’s main features and benefits and lead users through its interface. Like with splash screens, some designers question the necessity of the onboarding, though, in reality, it might prove tricky for new users to straightaway correctly guess how to find their way through a new app, particularly if the interface is unfamiliar to them.

Catalog Screen

For an eCommerce app, you would need a catalog screen to display all the products in one place. The better the visual presentation, the more are the chances of the user buying the product. A designer’s job is to form the catalog that will attract a user’s attention and encourage them to shop for a product. You can offer the user to scroll through the list, just like several other eCommerce websites and apps display it. The amount of merchandise/products in one row can be decided according to the breadth of the screen.

Log-in & Profile Screen

Creating personal accounts or profiles to sign into an app has become a standard norm these days. While this is a good way to ensure that your user gets a personalized experience, a lousy login screen could lead to people uninstalling your app. Designers must be able to understand how things work on login and profile screens. The key is to keep the login screen clear, uncluttered, and as minimalistic as it can be, to offer easy access to users. The amount of information has to be limited; otherwise, the profile screen may look too complicated.

Feed Screen

The ‘feed screen’ is a constantly updating list of news that is followed by users. Users usually scan through the list quickly, preferring to open only those links which they want to read.

As a result, mobile UI design is paramount. The overloading of visual details is a big no. A great tip would be to partially show the next piece of news.

Conversational Screen

That’s one of the most trendy types of screens at the moment. Emerging technologies like artificial intelligence and machine learning have made voice-controlled designs a thing. People seem to enjoy them as they use their mobile devices on the go, and sometimes they’re unable to use their hands to complete a task on them.

Chatbots are also very helpful when it comes to customer support. They provide instant answers to common questions, which is pretty convenient as well. That makes conversational screens intuitive, and soon they’re expected to appear in every mobile app.

--

--