How OutSystems has leveraged its low-code platform with PWAs during this outbreak

How many times during this quarantine have you wished you had an application to solve all of your day-to-day problems? But consider the development effort and time needed to create an application and you realize that it would probably be ready when this outbreak comes to an end if it wasn’t already developed by someone else. At that point, your application is no longer needed.

The strategy in this temporary and atypical time is to rapidly create quality applications to help people in critical situations.

Here is where OutSystems can fulfill your needs as a rapid application delivery platform, allowing you to easily create web and mobile applications. It simplifies every stage of the app development process from design and development through deployment and long-term maintenance.

OutSystems recently launched a community program where people can share ideas focused on helping to solve a specific problem. To fight against the coronavirus, the top 20 submissions will be turned into digital systems using the OutSystems platform. I will focus on a particular project called Todos Por Um. Built with the support of Lusíadas Saúde, this application has the ultimate goal of helping sort who should and who shouldn’t go to the hospital, therefore reducing anxiety among the population and minimizing the amount of unnecessary pressure put on the healthcare system.

Soon after the pandemic began, many mobile applications related to COVID-19 were quickly implemented and submitted to the main stores (Google Store and Apple Store). After some analysis, those platforms detected that many of the apps were fake, causing them to begin only accepting applications developed by governmental certified entities. You can learn more in Ensuring the Credibility of Health & Safety Information and on CNBC. This was one of the main reasons to distribute the application as a Progressive Web App (PWA) by using the early access features available in the OutSystems platform. That way the user can have a seamless experience as if they are using a native application. They also don’t need to wait for the stores’ approval, which makes for a faster time to market.

The term PWA was coined in 2015 by a British designer Frances Berriman and by the Google Chrome engineer Alex Russel to describe apps that take advantage of new features supported by modern browsers. In a nutshell, PWAs simulate the behavior of a native application by interacting with Bluetooth, camera, microphone, and other hardware sensors. They’re also always updated and users can access all capabilities without installing them. Compared with a responsive web app, PWAs are dynamic and can be customized according to a user’s needs. PWAs could be considered responsive web apps with more functionalities, such as access location or push notifications. You can learn more here and here, as well as how to distribute a PWA in OutSystems in Progressive Web Apps at the Speed of Low-Code. Also, you can check the documentation on how to customize an app by changing the Manifest file.

The monitoring of potentially infected individuals is crucial to avoid overloading hospitals. People rely on the healthcare system, which nowadays is overloaded with calls, causing the response wait time to increase. Todos Por Um makes people’s lives easier by connecting them with health professionals through a direct communication channel. First, the application asks for the subject’s symptoms, then assesses the results with an algorithm provided by the Lusíadas and redirects the subject to a specific outcome, including an online chat with nurses or doctors. Additionally, there is an AI chatbot that gives directions and shares general information about the COVID-19.

In eight days, the first version of the application was ready for everyone to use. This new digital system was developed by only one technical lead and two developers.

There is a list of modern APIs that interact with the native capabilities to enrich the user experience. Even though Service Workers have been available in Safari iOS since last year, many Web APIs are still not supported on iOS. One of the biggest challenges on this project was having all of the functionalities working 100% on both systems (Android and iOS).

The application notifies the patient when their doctor is available to chat and also notifies the doctor when there is a patient waiting. In iOS, it only notifies with a sound because Vibration API is not supported and, even using HTML5, audio is limited because audio streams cannot be loaded unless triggered by a user touch event.

To create a PWA in OutSystems, it’s necessary to create a mobile project and mobile projects usually use what are known as the Cordova plugins. However, since this application is not native, it can not use these plugins. For example, it’s not possible to use the action on the Common Plugin application provided by the forge to find the operating system that the device is running on. Instead, creating a new one without using Cordova is required.

Another big challenge was the implementation of the chat. The In-App Chat Mobile application provided by forge was the basis to create a reliable and secure chat. With the power of Firebase as the backend service, it was not necessary to manage servers and/or write APIs to get the system to work, and since the application is connecting through WebSockets instead of HTTP, the real-time conversation is incredibly fast.

All the dependencies related to native plugins were cleaned from this project. Also, the offline actions and components were removed because the offline mechanism was not required here. Since it was not possible to test all kinds of devices, issues accessing the local storage in some browsers were found. Amazon Device Farm provides this solution, but it is expensive and it was out of the scope of the project. OutSystems uses IndexedDB API to access the local data in the device and not all of them support this functionality.

Many companies that launched PWAs witnessed impressive results, including AliExpress. Some industry experts say that they will be the future of mobile phone use since they have the richness of the web apps and capabilities of the native apps. As Alex Russel said, they are “Websites that took all the right vitamins.”

When a mobile project is created in OutSystems, it’s really important to isolate all the Web APIs in the case of PWAs and/or Cordova plugins in the case of native applications because, in the end, it’s possible to choose the type of application to distribute. If both native and PWA are required, then you need to maintain both the Cordova plugins and the Web API codebases.

If the target of the application is a PWA, meaning that all the communication with the native capabilities is through Web APIs, it’s not possible to simply distribute it as a native application. The same happens the other way around; if the target is a native application, Cordova plugins will be used, which means that it will not work in the PWA. The development is always oriented based on the type of distributed application.

PWAs are conditioned to the Web APIs supported by mobile browsers. Here is where iOS is a step back from Chrome, which causes some functionalities to not work 100% on iOS devices.

– – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – –