The aim of the project was to create a functional, feature-rich product that would demonstrate the capabilities of a progressive web app (PWA). It was meant to serve as an example of what can be achieved with a PWA mobile app. Additionally, we planned to use it as a “playground” where developers can experiment, validate their hypotheses, and test out ideas for new features.
Even though it was an internal project, we decided to run it like any other project – with clearly defined requirements and a proper product roadmap, working in sprints, and following the principles of Scrum. The team involved in the project consisted of a Product Owner, a Product Owner Proxy, a Scrum Master, a designer, front-end developers, and a QA engineer.
In its assumptions, the app was supposed to serve as a demonstration tool. Its main purpose was to showcase various features that are possible to implement in a progressive web app. That’s why we wanted it to address the concerns of product owners who are choosing between a PWA and a native mobile app and demonstrate the possibilities and limitations of progressive web applications. Eventually, it also turned out to be a useful platform for exploring the PWA’s capabilities.
The R&D phase was a time for exploring and experimenting with different ideas and approaches to solve different problems related to PWA.
To serve its purpose, the app needed to be user-friendly and eye-catchy and look exactly like a native app.
From geolocation, through a QR scanner and video calls module, to augmented reality – every feature needed to be fully functional.
As one of the common concerns related to PWA is that it can’t be put in the popular app markets, we decided to… put the app in the App Store and the Play Store.
It is quite a common challenge to determine if a progressive web application (PWA) is the right solution for a particular set of requirements. Even though there are plenty of articles about this topic available on numerous blogs, they often present inconsistent, contradictory information, making it difficult for product owners to make an informed decision.
One of the challenges of building a mobile app is choosing the right product tech stack. With many options available, it can be difficult to make an informed decision that aligns with one’s business objectives and enables to implement all the features included in the product roadmap. The wrong choice can result in months of works and reworks and delay the launch of the product launch.
It is a good practice to start building a digital product by running user interviews. This project was no different. We already had a lot of insights gathered by our business development team and common client concerns listed. What we needed to do was to turn them into a product backlog.
For the 1st product release, we created 9 feature demos: Geolocation, Scheduler, Theme, Video Chat, Map, Video Upload, Photo upload, QR Scanner, and Device orientation, as well as About and Install tabs, which explained the technicalities of PWA technology. Later on, we also added an Augmented Reality (AR) feature.
At this stage of the project, there were still many unknowns. And, remember, the app was meant to serve as an example showing the capabilities of PWA in mobile app development. That’s why before jumping into the development, we needed to conduct research on the following topics:
Our designers worked on the mockups and wireframes. It was important to give the app a look & feel of a native app regardless of how a user interacts with it, whether it’s on a desktop or a mobile device. Additionally, the app needed to be scalable – its layout should be able to fit additional features and multiple language versions. Last but not least, we wanted this app to be compatible with Web Content Accessibility Guidelines (WCAG) 2.0, level AA, meaning that it should be usable and understandable for the majority of people with or without disabilities. Following the principles and guidelines, we made sure that:
After conducting the research, we decided to use Capacitor as a native runtime. Capacitor is an open-source environment that lets you run web apps natively on iOS, Android, and as progressive web apps with a single codebase. As it is based on plugins, it allows developers to connect the app with native APIs of different devices in a fast and easy way.
The app is available in the most popular app stores, both on Android and on iOS. It can also be accessed in a web browser. Users can easily compare how the app looks and how the desired features work on different platforms.
Whenever there is a need to build a proof of concept (PoC) and check if it is possible to include a certain feature in a progressive web application, we have an environment set up. Adding a new feature is easy and takes significantly less time than building it from scratch.
Our team has managed to create a functional, feature-rich product that demonstrates the capabilities of a progressive web app (PWA) and serves as a great example of what can be achieved with a PWA. From the users’ perspective, it feels just like a native mobile app, yet – it’s cheaper and faster to develop.
Top Artificial Intelligence Companies 2023Top AI Companies 2023Top Web Developers 2023Top Web Developers 2023