A Comprehensive Guide to Different Types of Mobile Applications

In today’s fast-changing business environment, having an online presence is a must. Any startup that aims to succeed knows this mantra. The initial natural reaction is often to start with a website. It is a known route. You probably feel more comfortable browsing the web on your laptop while shopping. But, the booming and flourishing mobile app development trend just can’t be ignored. It is an age of mobile devices now.

What is the reason for this shift? One simple answer is customers’ attention has moved to mobile devices. So, the companies follow. However, there is more to it. Developing a web app versus a mobile app has technological and performance considerations as well.

So why exactly should you want to develop a mobile app over a web app? And once you decide to do so, you are faced with different kinds of mobile apps. With a desktop web app, everything is relatively simple technology-wise. You develop a website, and a user can access it however they want: from a Windows, MacOS, or phone. However, this is not the case for native mobile apps. An app designed for iOS wouldn’t work on Android devices, and vice versa.

The types of mobile apps include a native app, a hybrid app, or a mobile-first web app. And some of them include subcategories. The differences are rooted in the technology used for development, updates, and distribution. So what exactly stands behind these options? Read on for this and more!

Why choose a mobile app over a web app?

Why choose a mobile app over a web app?

Having a mobile app for your startup can provide an edge over your competitors. Statista informs that 53% of Internet traffic belongs to mobile devices. Moreover, 90% of that is dedicated solely to using mobile apps. Mobile devices have become indispensable in people’s lives. Here is a list of reasons why you should consider developing a mobile app over a web app.

Better UI/UX

If your business idea is about a highly interactive product that is going to provide an immersive user experience, you should consider developing a mobile app first. First of all, immersion often means a need for a complex functionality that requires access to high processing power. And, user behavior suggests that it is more convenient to immerse oneself while being on a mobile app. It is due to the ability to design UX with such gestures as ‘swipe’, ‘tap’, ‘drag’, ‘pin’, and more. A web app is dependent on browser features such as a ‘back button,’ ‘refresh button,’ and ‘address bar’. A mobile app doesn’t have restrictions like that. It makes a mobile app UX smoother and more enjoyable.

Access to Native Features

Mobile apps have access to native device features. They are a camera, GPS, push notifications, contact list, accelerometer, microphone, etc. Simply access to a camera is already invaluable. In any messenger app, access to a phone camera is located near the line for entering your message. It allows sharing photos easily and swiftly. Even a banking app can benefit immensely from this feature. Consider a form where a user needs to upload a photo of identification documents or else. With a web app, you often have to take pictures using your phone and upload them on a cloud drive or something. It requires extra steps. Another win for a mobile app. And from a commercial standpoint, push notifications are very well tolerated on mobile devices while on a web app, they are considered an intrusive and bad practice. This means that if you develop an e-commerce mobile app, it is much easier to target your promotions and deliver them to the user. Users experience positive emotions from getting messages and notifications on mobile devices; not so much on a laptop.

Offline Functionality

Mobile apps can offer offline functionality. Interestingly, more than half of mobile users find this a key point in making a decision to use an app. This functionality is important for areas where internet connection is absent, weak, or unstable. For example, while commuting on a subway, traveling, or being in remote areas. Sometimes, even being far from a router or having thick walls in the apartment can hinder the quality of the Internet connection.

Ever-present Icon

Mobile apps have better chances of sticking around than returning to a website. Mobile apps have a shortcut on the screen which makes it easy to remember to use it and access it. With a web app, the user always has to remember to navigate to your web app via the address bar. For a mobile app, the user just needs to tap the icon that is always there. Plus, if the user hasn’t been using it for a while, most phones will bring it to the user’s attention. More so, having a branded icon on the user’s phone creates an opportunity for a regular brand encounter and serves the purpose of mini-advertisement for the brand. It puts promoting your brand with a mobile app to a subconscious level.

Targeted VS Generalized Nature

Business-wise, mobile apps are much more focused by being designed with a particular audience in mind. In contrast, a web page is often designed to reach a wider audience. Thus, a web app will always have a more generalized nature. Mobile apps’ narrow focus allows for better personalization as well as targeted marketing efforts. It aids in better user journey design, guiding the user to complete a specific series of steps and achieve the target action. This means using resources more efficiently.

So, now let’s take a closer look at what types of mobile apps are out there.

Types of Mobile Apps: Native Apps

There are two major mobile operating systems — Android and iOS. Native apps are developed specifically for each of those. For Android, the most common technology stack is Java and Kotlin. For iOS, it is often Swift and Objective-C. Other languages like C/C++, Python, and R programming language can be utilized for both platforms to perform particular tasks on the backend. They can be related to data manipulation, visualization, or statistical analysis. Then, there is also a Windows phone, and C# and .NET are used to program mobile apps for it. Similarly, a native app for Windows phones won’t work on Android or iOS platforms.

Native apps utilize specific programming languages that enable access to device-specific features. This leads to mobile apps being feature-rich, performant, and optimized. Those programming languages can manipulate with device’s UI, and access its various hardware and software. It includes Bluetooth, a phone book, a payment unit, GPS, camera, sensors, etc. It inevitably reflects on user experience, speed, and reliability.

In terms of distribution, these apps are downloaded through specific app stores. iOS has its own app store while Android has its own. An app developed for iOS cannot be downloaded to the Google Play app store, and vice versa.

Use Cases

One obvious choice for native mobile app development is mobile games such as Pokemon Go. It has a mobile app for Android, iOS, and BlueStacks. The latter enables playing a mobile Android game on a PC. Pokemon GO is a game that heavily utilizes native GPS features and Augment Reality (AR). The user has an avatar on the map that is based on real-world surroundings. It moves only when the user moves physically which is detected by the phone.

However, a whole range of apps can benefit from being developed natively. One such example is Calm app for meditation and relaxation. Calm app utilizes native-to-device sensors as well as push notifications and background mode. In terms of sensors, the app uses accelerometer, gyroscope, barometer, proximity sensor, and ambient light sensor. In addition, a touch screen is essential for controlling the pacing of breathing exercises and animation. The same functionalities and UX simply couldn’t have been achieved had it been developed as a web app. And anything similar developed on a web app would lack in hitting the performance numbers.

One more example of a native app is IKEA Place. It is available only on iPhones. It utilizes AR, computer vision, 3D modeling and rendering, machine learning, and object recognition. It heavily utilizes the device’s camera, gyroscope, accelerometer, and iOS’s ARKit. And in general, the app greatly benefits from the device’s display, graphics capabilities, and processing power.

Native App Pros, Cons, and Considerations

ProsCons– highest performance; — responsiveness; — best user experience; — full access to the device’s hardware; — can work offline; — following platform-specific guidelines often ensures more intuitive user experience;Requires a separate codebase for each platform; Development and maintenance are more expensive compared to other kinds of mobile apps; Calls for proficient developers in platform-specific languages;ConsiderationsGames, complex ‘heavy’ applications (like Pokemon Go); Applications that heavily utilize more than one or two device’s hardware (like IKEA Place); The key selling point of your app is its user experience (like Calm);

Subcategory: Cross-platform apps

Despite all the beauty and power of native apps, the obvious drawback is that the code created for one platform cannot be reused for the others. It means a new development cycle for every platform. It, in turn, means double-triple the costs. Since the IT industry is solution-oriented, the technology was created to go around it. Such technologies as React Native, Xamarin, Flutter, and Ionic can all be used to create a mobile app once and then reuse code for other platforms. The code created once for an iOS can be then reused on Android devices, Windows phones, tablets, and even smartwatches or smart TVs. They are not exactly platform-independent technologies. Using one of these technologies allows the reuse of 90% of the code base. But, it still offers great savings both in time and money.

Use Case

For example, Shopify, an e-commerce giant, rewrote its Shopify Mobile app as a cross-platform React Native (RN) app. This move resulted in 95% codebase reuse. Interestingly, this new app impressed with even more reliable performance on iOS devices than the earlier app. It was a long and challenging process as Shopify was a big app already at that time. The size of the app was about 300 screens per platform. It means 300 unique user interfaces were developed for Android and iOS each. The change of technology was an iterative ported process. It means that old features were still using old technologies. New features were developed using React Native and gradually the process of replacing old features continued. It was worth all the effort.

Here you can see Shopify’s dashboard that tracked the entire process.

Note: RN — React Native

The main reason for this migration was developer productivity. It includes creating new features, debugging, maintaining, and improving performance. The benefits from taking a cross-platform approach included the following:

• For example, when developers created a feature for one platform, the release had to be dragged out until the developers made sure this feature was ready for the other platform.
• When there are a lot of screens (unique UI interfaces), a lot of testing must be conducted to make sure a new feature doesn’t break any of the existing ones. So, 90% of the shared codebase saved 90% of the testing effort.
• Moreover, the cross-platform app allows for more direct access to native features. Removing a middle-man always results in faster performance.

Cross-Platform App Pros, Cons, and Considerations

ProsConsCode reuse — a single codebase will work for Android and iOS with some customization; Highly performant (close to native apps); Can access all device’s native features (though sometimes through an intermediary framework) A large community of developers, support, and an ecosystem of plugins and tools that is constantly growingoften 90–95% of the codebase is shared but 5–10% will require platform-specific custom code; A learning curve due to the appearance of new frameworks, libraries, and tools;ConsiderationsModerately complex apps in terms of user interfaces and functionality (like Shopify); Apps that target both iOS and Android audiences (like WhatsApp);

Types of Mobile Apps: Web Apps

Web apps are essentially websites that are accessed via the browser. The majority of web app development follows a mobile-first methodology. It means that the website is first made for a small mobile screen, and then adapts to bigger screen sizes. The technology stack includes HTML, CSS, and JavaScript. On top of it, other technologies like Ruby, React, Vue, Angular, etc. are used. They are needed to achieve more functional and performant UIs as well as reuse code to improve developers’ productivity. And that’s the part that faces the user — the client side. There is also the backend (server side). It can be developed using a variety of programming languages including JavaScript or PHP, .NET, and whatnot.

However, it is often possible to develop complex capabilities for desktop browsers that will not necessarily be functioning as expected on mobile devices. And, since a web app needs to be accessed via a browser, it means it always requires an Internet connection. On the positive side, it doesn’t require downloading, storage space on the phone, or constant updating.

Use Cases

Amazon runs its services as a web app using HTML, CSS, and JavaScript for the client side at its core. As for its server side, it traditionally prefers Java with Python for working the data. On top of that, Amazon implements a variety of advanced technologies such as computer vision, deep learning, and sensor fusion. Therefore, web apps certainly have access to advanced technologies to ensure their supreme functionality.

Yet, it should be mentioned that Amazon has a set of more targeted native mobile apps available to download through app stores.

The primary use case for a web app is the consideration of desktop users. Gmail reported revenue for Q2 of 2021/2022 is $256.74 billion, Microsoft Office 365’s is $22.1 billion, and Facebook’s is $117 billion. It is a huge and successful market. Web app’s accessibility regardless of the platform is a huge selling point.

Web App Pros, Cons, and Considerations

ProsConsPlatform-independent; Flexible and scalable; No need for installation and storage space on a device; Easier to develop; The most affordable development optionIs available only if there’s an Internet connection; Cannot fully access the device’s native features; Cannot fully employ native capabilities; Accessed via mobile may not perform all desktop features (complex ones)ConsiderationsE-commerce, e-learning, and informational apps (like Amazon or Medium); Apps that need to be used on a laptop/desktop (like Gmail, Microsoft Office 365, or Facebook, etc.)

Subcategory: Progressive Web Apps (PWAs)

Progressive web apps (PWAs) are the extension of web apps that you can download to your device whether it is a laptop, a mobile device, or a tablet. As for the technology stack, it uses WebAssembly, Service Workers, and more on top of the traditional client-side trio: HTML, CSS, and JavaScript. WebAssembly allows more computational power for features like gaming, simulations, video processing, etc. Service Workers enable offline access and faster loading times.

As for the server side, it is the same as for a web app. Any backend languages can be used like Java, NodeJS, Python, Ruby, etc. They are also aided by technologies like ExpressJS, Flask, data management languages, caching and CDN services, etc.

Use Cases

Microsoft Teams is one of the examples of PWAs. It is accessed as a website, but then it offers to download it on your device. Once downloaded, it offers a similar experience to a native mobile app. PWA doesn’t depend on a particular platform or device. Microsoft Teams can be installed even on Linux now.

On the screenshot below you can see an option to get a mobile app or a desktop app. Often you need to log in, and then you will see a pop-up offering to install it. If you don’t do it right away, the icon for download will just stay up there on the right of the address line, so you can do it at a convenient time for you.

For Forbes, the decision to launch its web app as a PWA was driven mainly by faster loading times. When Forbes was only a web app, the loading time on a mobile device was 6.5 seconds. It was back in 2016, but even by the standards of that time, it was a really long loading time. A user doesn’t have anywhere near that much patience these days. After PWA was launched, loading times for desktops got down to a mere 0.8 seconds, and for mobile — 2.5 seconds. This was in 2017. It was a brilliant move that got a lot of media attention.

Now, Forbes has changed its development approach again, to native apps. However, for an informational application even with all of its images and other media content, it is not really a necessity. That is probably why this transition from PWA to native apps by Forbes didn’t grab any attention. That is compared to the times when they released a PWA. Or switching to native apps might have been a move to safeguard against future leaps in technological progress.

Types of Mobile Apps: Hybrid Apps

Hybrid apps use web technologies just like a web app or PWA. They are standard web technologies like HTML, CSS, and JavaScript. Then, they are wrapped in a native container. Technologies used for this are Cordova, Ionic, or PhoneGap.

Technically, the core built using web technologies is launched via mobile WebView Object. It is like an invisible browser to the user, inside a mobile phone. It allows a hybrid web app to be distributed via app stores and to have functionality similar to a native app. But it still sort of operates through an internal browser thing. These wrapper technologies include plug-ins that make both the mobile UI elements and native hardware accessible to a hybrid app.

Knowing that this is a web app at its core, you probably wonder about offline functionality. And, yes, it is currently an industry-posed problem to be able to build offline-first hybrid applications. Since hybrid apps have access to native infrastructure, they can offer offline functionality to some extent. They are able to load and access previously loaded data. There won’t be any updates on the fly.

Use cases

In terms of examples, Gmail, Instagram, and Twitter are by far the most famous hybrid apps. (However, Instagram and Twitter switched to a native app development scenario.) You often can load Gmail on your phone without an internet connection. You can also open some emails without an Internet connection. But you won’t be able to send or receive new emails.

Evernote is also another example of a hybrid app. However, Evernote doesn’t use any of the mentioned wrappers such as Cordova or Ionic. Evernote built its own wrapper called Conduit. Initially, Evernote ran 5 separate codebases, a web app, an app for MacBooks, a mobile app for iOS, for Android, and for Microsoft. For them, it made sense to even develop their own wrapper framework rather than maintain 5 separate codebases. What’s more, they didn’t migrate any of its code — they developed the new hybrid app from scratch.

Which one to choose?

It is clearly possible to achieve success with any of the types of mobile apps. Each category has its prominent players. You also have noticed that even if the company started out with one approach, as time changed so did the approach. Facebook, for example, started out as a hybrid app. Then Mark Zuckerberg announced that it was a huge mistake and went the native route. The key to its decision was the performance. Evernote as you’ve seen went the other way around. They opted for a new strategy due to development inefficiencies and resulting inconsistencies. At one time, their 5 different apps looked different. It was like 5 different companies developing their app.

So it seems that even tech giants have shifted their strategies and changed their approaches. Overall, it seems as if the industry’s major players change their development approach every 4–5 years. In light of this, the logical conclusion is that the best strategy is to make the best choice for the time being and be open to change down the road.

Consult to Develop Custom MVP app to make sure you are making the best choice

Conclusion

The variety of options for development is truly plentiful these days. You can always opt for an option that fits your project’s needs. In addition, once the project matures, it can be beneficial to change the development approach. PWAs and cross-platform apps seem to be the most dynamically developing technologies for the time being. Both of those approaches allow distribute your app across multiple platforms. Yet, cross-platforms allow better access to native features, yet they use relatively newer technologies. It means less support for features and some features surely will be experimental. In contrast, PWAs use technologies older technologies that translate into the widest support. Yet, they also implement new and experimental features. Native apps are the best choice for games or complex apps. Hybrid apps are currently losing ground against cross-platform apps. But, they are still worth considering.