Apps Built With Ionic

Intro

What are the key factors for choosing a solution to create a mobile app? Budget is one of the first drivers to mention. However, such notions as multi-platform functionality, development capabilities and other factors facilitating the building of product are also relevant. In the present publication, examples of Ionic apps will be introduced. However, prior to taking on reviewing software products, let’s deal with the very tool for making mobile apps.

Is It Hybrid or Cross-Platform?

In order to find out a category to which the apps built with Ionic belong, we should learn the difference between two approaches aimed at multi-platform functionality. The first one bears the title of cross-platform (CP). As you understand, one product can work on versatile operating platforms. Such approach is very popular since it eliminates the necessity to create a separate version for each OS. The approach can be described in other words like an adaptation of a website for mobile device parameters. It means that the functionality of the final app is limited. The user interface of CP apps is usually based on an intermediate language like JavaScript that is not native to the underlying operating system.

Getting ahead of answering the set question, an Ionic application is not cross-platform in the full sense of the term. The term hybrid means the incorporation of certain features of different solutions. In terms of mobile app creation, it combines peculiarities of the previously mentioned approach and the native one. If you cover a CP product with a native app skin, you will get a hybrid outcome. As a result, it is possible to use one version on versatile OS without strict limitation of functions.

Ionic for Building Hybrid Products

Do you know oats in CSS, JS or HTML? This background is essential since most of the successful apps built with Ionic are based on HTML5 and other front-end technologies. Other tools that may useful for working with the framework include AngularJS, Cordova or PhoneGap as a native wrapper, and CSS/Sass.

Like any tool for producing mobile applications, the said solution has its strengths and weaknesses. Naturally, the most attractive feature of the hybrid approach is the code reusability. Thus, Ionic apps examples include the support of several platforms including both giants of mobile OS plus UWP and even BlackBerry 10. Other practical advantages of the framework comprise a fast creation and testing cycle; lack of necessity to load a heavy emulator; ability to use TypeScript; an easy transition from Angular 2; and access to the native functionality of the device.

At the same time, some peculiarities may spoil the effect of producing the Ionic application. These include a need of using a number of callbacks to the native code resulting in possible performance deterioration; an unchanged look of the user interface for all devices; and complications coming from making interactive transitions and creating highly developed graphics.

To understand the practical experience of engaging Ionic for building apps, we have to look under the hood and perhaps make some comparison with its competitors. However, the goal of the present publication is not to admonish to or dissuade from opting for this software development kit but unveil its final outputs namely famous apps built with Ionic.

Fruits of Utilizing Ionic for App Building

Can you guess the number of apps built with Ionic available for today? This figure exceeds 4 million and keeps growing. So, let’s meet some of them and begin with the most famous ones.

MarketWatch

This superpowered solution is one of the most successful apps built with Ionic. MarketWatch tracks the pulse of markets for engaged investors with more than 16 million visitors per month. Over 300,000 active mobile users rely on this solution for timely financial news. Delivery of financial alerts at speed is important for users making investment decisions, and a consistent user experience across mobile platforms is critical for user satisfaction and the brand.

The MarketWatch team wanted to extend service to both iOS and Android platforms. Working in native environments for four different devices (including phones and tablets) was not an option. The team wanted to lean on their extensive web technology experience and not “reinvent the wheel” for multiple platforms. After evaluating a solution from Xamarin, the team chose the open-source Ionic SDK.

They reuse much of the design HTML and CSS for the responsive website. In fact, they found it easy to move back and forth. After introducing a new quote page within the app, they revamped the quote page on the site along the same lines. With Ionic, they found 95% of the style code can be shared between the iOS and Android apps. Extended functionality was added via native plugins, including Omniture, Facebook, Twitter, and Urban Airship. Other plugins accelerate their app deployment and make for a consistent, cross-platform user experience.

Pacifica

This app for stress, anxiety, and worry is built around quick, iterative activities that individuals can perform privately in order to cope, understand, and better control their emotions. Pacifica is based on the well-known technique of Cognitive Behavioral Therapy (CBT), in which therapists and their clients discuss emotions and tools with which to manage and overcome challenging feelings of stress, anxiety, and depression.

The tool guides users through relaxation, thinking, wellness, and behavioral exercises, based on the tools of CBT. Users can open the app and practice these techniques anytime, anywhere, as often as they like. Similar to other famous apps built with Ionic, this product is also available in the Google and Apple app stores.

Sworkit

Another sample of successful apps built with Ionic is a fitness app offering bodyweight workouts that can be done anywhere. The app aims at users at all levels of fitness experience. They choose a strength building, cardio, stretching, or yoga workout and enter the amount of time they have available to work out. Sworkit provides interval timing and sequencing, along with rewarding users and tracking their progress.

The team used Ionic’s side menus, navigation, list views, list reorder, list option buttons, popups, action sheet, slide box, form inputs, gesture, loading, platform, and grids. The total redesign and refactoring of the app were completed in just ten weeks.

The total download rate from App Store plus Google Play has exceeded 25 million times.

The next examples of Ionic apps are not as prominent or top-rated. Nevertheless, they enjoy popularity by target audience and in certain locations.

McDonald’s Türkiye

An app version of the internationally acclaimed brand for Turkey.

Ne Kadar? – Motosiklet

This is another app for the Turkish market. The product is aimed at people searching for a motorcycle to purchase in Turkey.

eSeries (eProject, eWork, eTime, and eExpense)

We decided to unify these four ionic apps examples since they are different eggs of one hen. eProject is an app to manage projects and timesheet. eWork is the solution to manage activities of employees working out of office including workers engaged in construction, logistics, healthcare and other areas. eExpense is designed for those who deal with versatile reports and receipts of personnel expense. eTime is the tool to monitor presence, absences and clocking, request holidays and time off of personnel.

Cryptochange