Progressive Web Apps: The easy way to create mobile documentation apps

Mobile documentation is on the wish list of many technical editors – if it weren’t for app programming. Anyone who has ever launched an app knows how much effort can be involved in making an app available via various stores and operating systems. If only there were an easier way! The good news: there is! Progressive Web Apps offer the advantages of a mobile documentation app without the disadvantages of developing a complete app. In addition, they are easy to create from SCHEMA ST4. Reason enough to take a closer look at this technology.

Progressive Web Apps: What are they?

Progressive Web Apps are a standardized way to locally install HTML content as an app. They

• work on different platforms (iOS, Android, Chrome, Edge, etc.),
• rely consistently on web technologies (HTML 5, CSS, Javascript, HTTPS, standard browser)
• and function according to the principle of Progressive Enhancement, i.e. additional functions are added to the basic functions if, for example, there is an online connection, a larger display is available, a camera is available, etc.

In practice, you go to a website on your smartphone, for example. In contrast to a normal website, however, you are offered to download the content and install it locally as an app (button marked in orange in the illustration). This works in the same way in the browser on your PC or laptop. You can define individually which content should be downloaded – more on this later.

Then, you can start the app as usual via an app icon. It can also be used offline.

This is the end result, so to speak, but how do we get there? Let’s first have a look at the possibilities of making mobile content available to your target group.

Mobile documentation from SCHEMA ST4

The PDF format is the most common way to make information from the editing system SCHEMA ST4 available for mobile use. It is easy to generate this format with ST4 and the Page Layout Designer (PLD). However, this format is only conditionally suitable for mobile use because users are often busy scrolling, pinching and zooming.

Alternatively, content can be output as responsive HTML5. This is also easy to do with ST4 and the Online Media Designer (OMD). The difficulty lies in making the files available to the users. Per ZIP archive, some functions are limited; via web server, an internet connection is required.

These problems can be avoided using a native or hybrid app, but there are other difficulties lurking: account management for the various stores involves a great deal of effort.

The ideal solution is to use a Content Delivery Server, but this involves a considerable investment.

Progressive Web Apps combine the advantages and at the same time avoid the disadvantages of the solutions mentioned so far:

• They can be created directly from ST4.
• Apps can be made available via a web server.
• The content is accessible even without an internet connection.
• Usability is much better compared to other solutions.
• Since Progressive Web Apps behave like normal apps, no prior knowledge or training is required for installation and use.
• Access to device interfaces is possible.
• Push messages can be sent.
• You save time, money and spare your nerves by not having to distribute the app via app stores.

Compared to the advantages, the list of disadvantages is very short:

• They do not work in every browser. You have to do without Internet Explorer, but we already know that from other topics.
• A native app offers higher performance, but this aspect is not significant for pure documentation apps.

Generating Progressive Web Apps from SCHEMA ST4

As mentioned, a Progressive Web App is based on a conventional OMD production. But there are further additions and adaptations:

• Manifest: This file collects project parameters such as the app title, the icon or the base URL. The information is collected in the project properties (the blue book in ST4) and generated in the OMD.
• App icons in different resolutions, which are stored as project-specific production resources in ST4.
• In the Javascript file “Service-Worker” it is defined how to react to certain events. For example, depending on the online status, updates can be suggested.
• A call for the installation of the “Service-Worker” must be built into the existing Javascript file js.

With these additions, you can define individually how app updates should run or which content should be downloaded during installation. You can download the complete content or only parts and then reload additions later via defined events.

Further optimization such as an improved search can be implemented as well.

Are Progressive Web Apps worthwhile for your company?

If you look at the most important facts again, the answer to the question can really only be “yes”:

• Progressive Web Apps are a solution that is easily implemented. All you need is your content in an editing system like SCHEMA ST4, a few adjustments there and space on a web server.
• The exclusive use of web standards eliminates licensing costs.
• You can start with a simple basic version and gradually expand functions and distribution channels. Later conversion to a native app is also possible at any time.

Progressive Web Apps offer an inexpensive and quick way to get started with mobile documentation. For your company, this can be an introduction into content delivery and alternative forms of documentation such as video or augmented reality. You can start small and finish big.

From the user’s point of view, Progressive Web Apps offer an attractive, interactive product that adapts seamlessly to the user’s habits. Whether mobile or on the computer, online or offline. This is how you can increase the customer loyalty to your company.