Hybrid Mobile Apps: How to Build?

Liudmyla Dereshivska
Marketing manager

January 17, 2018

build body measurement app

This time we decided to dive into the topic of app creation. To be more specific, about body measurement applications built on hybrid technologies.

We chose this topic to share the experience we had during the creation of the body tracker called eSense. It is a mobile application that measures body temperature and galvanic skin response. Data for the measurements are collected by means of external devices.

The body measurement application or so-called “tracker” is an app that collects and processes data about body conditions. It can be temperature, steps, heart rate, level of blood sugar, etc. People use this information to track their health condition or improve indicators. Hybrid application in its turn implies that the app will be used for both Android and IOS platforms.

5 Steps to Develop a Hybrid Tracker

The process of app creating starts with any other process – an idea. Then you have to adapt it to the customer’s needs and only after pure magic starts – the process of development. We are not going to speak about all of the processes preceding development. Today we would like to describe more practical things and move straight to the core.

In case you decide to go whether with a web or an app development, take into consideration that in 2017, nearly 53% of internet traffic came from mobile devices and this number is going to rise. So, a mobile version of your product is only a matter of time.

If you are a founder that wants to develop an app, but the technical side is not your strong point, the best solution for you is to find a reliable development team and fully trust them. However, note that frequently, developers tend to work with technologies they are comfortable with sacrificing business needs. To eliminate such situation we will walk you through the main steps in app development:

Step #1. Choose the tech stack 

The approach for the technology selection for an app depends on resources and the money сustomer is ready to devote. It can be either native or cross-platform technology stack. In the case of eSense customer tasked us with creating an app that will work on both IOS and Android platforms, therefore we started with cross-platform development.  We used Ionic2, Angular2, Cordova for creating this particular app. But you can also use other tools such as Reach Native, for example. Building an application using hybrid technologies is cheaper and more flexible but has a number of disadvantages, like lower performance over native apps or limited functionality. 

Step #2. Develop an App architecture 

After dealing with a small but real and growing project, we “learned in our own skin” how important for the program not only work well but also to be well organized. Do not believe that only large projects require robust architecture. The proper architecture will save you a lot of effort, time and money. And often it generally determines whether your project will survive or not.

Mobile app architecture is perceived as a process of developing an app with a durable structure followed by a certain set of patterns and techniques. Generally speaking, there is no generally accepted term “software architecture”. However, for most developers, it’s clear what code is good, and which is bad when it comes for practice. Good architecture is, above all, a profitable architecture that makes the process of developing and maintaining the program simpler and more efficient. A program with good architecture is easier to expand and modify, as well as test, debug and understand.

An app architecture depends on your project specification. No matter what application you are going to develop: hybrid or native, it has to be suitable to obtain the client’s requirements and the industry standards.

Step #3. Creating the App

At this stage the process of development takes place. Previous phases served as preparation for the main development. The process is based on the specification of the application. But remember that every application can be built differently, regardless of the architecture and requirements. Therefore, it can be difficult to describe such a process without resorting to a particular application. Fortunately, we have an application to describe. Our process eSense development can be divided into 9 main stages: 

  1. creation of an app template
  2. creation of the skeleton for the modules
  3. setting up client routing
  4. connecting and writing database logic
  5. adding plugins
  6. connecting and configuring required third-party libraries
  7. creating a visual part of each page
  8. building functional logic for each page
  9. writing principles of plugin’s work

Yet, we would like to emphasize that this example of the development of a hybrid application is not a perfect model. The process of development may vary with regard to the specifics of the design, requirements and principles of each developer’s work.

build body measurement app

Step #4. Implement the Tracker Functionality 

The speciality of a development hybrid app is that the app will not have a back end, the whole development will be only on the front-end side. After we start with implementing tracker functionality, a speciality of the process will change, because we have to deal with external devices and their API’s. This is not just about tracker applications, but all apps that interact with external devices. In the majority, trackers should work with certain external devices or services in order to deliver the complete result. The application eSense uses a sensor as the external device. It collects measurements of the human body, like temperature and skin response. We used plugins for sensors, which collected data and sent it to the app.

In the next version of an app, we are planning to work with Bluetooth devices, but the problem is that we don’t own an API’s of these devices.  So, that means our team will have to study these devices at lower levels to understand how they communicate with the phone in order to be able to implement them in eSense. Hence, the specifics of developing an application tracker is the process the studying and implementing external devices and services designed for tracker functionality.

Step #5. Testing 

The final part of our development is devoted to verification of all process and general testing the whole system. Also, it is a good idea to retest previously cleared features in every version of the app, just to be sure that it will work during the release candidate testing process.

Frequently, development ends with a launch of the ready product, but that is not always the case. As an app gets in the hands of users, feedback will pour in and you will need to incorporate that feedback into future versions of the app.

Rate this post

Leave a Reply

Your email address will not be published. Required fields are marked *