Examples of PWA implementations

28.01.2020 Angelika Siczek
illustration of people sitting next to a large smartphone

The mobile era has begun and smartphone users dictate the conditions. In this reality, high quality UX (User Experience) is no longer a nod to the customer or a feature worth having. E-commerce companies are happy to adapt any technologies that will help them reach their mobile clients, and there is no better solution than Progressive Web Apps. The brave ones who implemented the PWA in the early stages of development are celebrating enormous progress today.

 

Examples of PWA implementations

 

PWA adapters

Among the pioneering companies that have implemented PWA, there are many large brands that are achieving significant success today. These include Lancôme and Housing.com.

 

Lancôme

Lancôme was among the first to use this new technology. The decision was made by the Marketing Department, which was aware of the growing need to develop a mobile channel. The motivation for them was when mobile devices overtook desktop computers in network traffic. The first step they took was a native application, but Malik Abu-Ghazaleh, general director of the digital department, was skeptical. He saw that despite the great advantages that applications give, they also have serious disadvantages. They were too expensive and customers had to be really loyal to download and use them.

 

Progressive Web Apps seemed to be a good solution because it combined the pros of the application without its many disadvantages. However, it was such a fresh solution that it raised doubts. In mid-2016, they took a chance and quickly noticed that the decision was good. Their site has become more effective and cheaper to maintain than the application. It works by half faster than the previous one, because the loading time from 9 seconds dropped to 3.5, and their sales in the mobile channel increased by 16%.

 

Housing.com

Housing.com is an Indian start-up coordinating rental properties. Fast site operation is important to them, but above all on mobile devices. In India, residents have more access to a mobile phone than to a land line. For Housing.com, having a native application was not ideal. Because of the high cost of data transfer, Hindus don’t like to download applications on the phone, but rather prefer to use browsers. Still, they require fast and engaging UX. According to data found by Housing, even a second taken out of the page loading time can affect the conversion rate. Thanks to PWA, their average time spent on the site increased by 10% in all browsers. Housing has also become available to users with weaker devices. Progressive Web Apps technology was beneficial to them.

 

Social media and their PWA implementations

Social media relies heavily on user involvement. Their specificity results in fast loading of functions, but with less data. PWA is the ideal candidate for the first choice of technology for social media. Twitter, Pinterest and Instagram are just a few examples of giants who have trusted PWA.

 

Twitter

In 2017, Twitter globally launched its website in Progressive Web Apps technology. Thanks to this, with reduced data consumption, it created a faster and better UX. After asking users to install the Twitter Lite icon on the home screen, they recorded 250,000 unique page views per day.

 

Nicolas Gallagher, Twitter’s main engineer Lite, said that it is the fastest and most reliable alternative of the site. Thanks to PWA, the amount of data transferred is reduced due to cache content and optimized images. This means 70% less data consumed by users when scrolling through tables. In addition to this, Twitter at PWA weighs 600KB compared to 23.5MB native application.

 

Pinterest

The reason for Pinterest’s decision to move to PWA was similar to the reason for Twitter. They had low user involvement, and a problem with the speed of the page, so people with a weak connection were not willing to stay longer and set up an account, and even less to download applications.

  

Initially, the PWA adaptation was supposed to turn them back significantly, but it was also a great opportunity to improve the entire site. The implementation lasted 3 months, but technologically the situation has definitely improved. The time spent on the site increased by 40% compared to the previous page, and the profit generated by user traffic increased by 44%.

 

Zack Argyle, Engineer Manager, says that the weekly number of active users increased by 103% globally, by 156% in Brazil and by as much as 312% in India. User involvement has also improved significantly. The length of sessions on the site increased by 296%, and the number of “pins” made by users is higher by 401%. However, the number of logins increased the most – 370% and new users – 843%. 800,000 users have an icon on the desktop of their mobile device.

 

Tinder

Pogressive Web Apps was also a success for Tinder. This is a dating application that is based on viewing profiles based on location. The concept is based on mobile users, so a good mobile site is the most important thing in the business model. The principle of operation is simple. The application displays the profiles of people in the area. The user’s task is to drag the profile to the right or left to accept or reject the presented person.

 

Tinder online, i.e. the version of the website in PWA technology, was opened in 2017 and has been used in new markets. Already in early tests, the results showed good swipes, a large amount of message exchange and the length of the session compared to the native application. Thanks to PWA, users are more likely to perform stalling (acceptance or rejection of the profile of the person presented) than in native applications, exchange more messages and more often edit their profile. Tinder in this version is available for both desktop and mobile devices. It uses JavaScript to optimize performance and push notifications to increase commitment to communication between users.

 

E-commerce reduces the mobile gap with PWA

Increasing page performance and its UX is very important, but this is not the highest goal for the e-commerce market. For sales, profit is the most important thing, and there is no profit without User Experience. Due to poorly designed pages and overloaded browser screens, users of mobile devices do not want to finalize transactions on phones and tablets. A website designed for a computer will not display properly on the smartphone screen, and this will cause frustration to the customer. In the best scenario, it shifts to a different sales channel, but in most cases it does not return to the store page.

 

DW Shop

DW Shop is a brand owned by DW Creative Group. It belongs to the Polish hair stylist Dariusz Wójcik. Most of his clients came from Instagram, which is the best channel for promoting health and beauty products. Mobile devices are responsible for 80% of network traffic on social media. For DW Shop, 90% of traffic comes from a mobile channel.

 

The goal of Dariusz Wójcik was therefore to convert users browsing Instagram’s account to potential buyers. This is where PWA helped him. The store gained 75% of traffic from Instagram using Magento 2. To further enrich UX, Vue Storefront was used. It is a framework that works with every e-commerce backend engine on the market.

  

Staples

Staples is the largest e-commerce store in the world, right after Amazon. They grow not only by internal development, but also by buying out other, smaller e-commerce businesses through which they continue to service. After all, they had to combine all channels and all touchpoints to unify the brand’s image and compactness.

 

It was not easy because their services were scattered in different systems written in different programming languages, including .NET and Java. Modifying each one separately would be expensive and time consuming, hence the decision to switch to a unified User Interface available on both backends. The company initially considered the implementation of a native application, a new frontend and several headless systems. In the end, however, it was decided on Progressive Web Apps.

 

A new PWA frontend was implemented and integrated via API with Genesis and Netshope backends. In the current system, you can scan barcodes and order products offline. Staples has managed to provide a more consistent UX and consistent image communication, not forgetting the high performance of the site and the integration of all its channels.

 

Alibaba

Building a better UX was the Alibaba group’s highest priority. This Chinese e-commerce website is the world’s largest B2B sales platform. In turn, their AliExpress.com offers products to individual customers around the world. After switching to PWA, these companies have seen a huge increase in user engagement across all browsers. At the same time, the costs of launching and running a website have decreased significantly compared to the native application.

 

  

All examples illustrate a different approach to the same problem. Each company has its own business model conditioned by the market segment to which they belong, the type of clients and the planned development path. PWA in each of these cases stands up to the challenge thanks to its flexibility and pioneering approach to User Experience. Combining the features of a native application and a classic website are advantages that even the best application or responsive website solution will not offer. PWA has available ready implementations in Magento and Magento 2, and the number of companies specializing in such integrations is constantly growing.

News Digitized / Stay Informed

Since the beginning of 2022, we are part of Unity Group. Now, by signing up for our newsletter, you will be kept up to date with information from our entire organization.

    By submitting the form you agree to receiving a newsletter that is sent by Unity S.A. based in Wrocław. You can withdraw your consent at any time. Additional information about the processing of available details provided in the privacy policy.

    *Required

    Andrzej-kurs-programowania

    Andrzej Szylar

    Chief Executive Officer

    E-mail:

    andrzej.szylar@unitygroup.com
    Magda2

    Magdalena Paczyńska-Kamienik

    HR Manager

    E-mail:

    magdalena.paczynska@unitygroup.com
    Aleksandra

    Aleksandra Bielawska-Clegg

    HR Business Partner

    E-mail:

    Michal

    Michał Duława

    New Business Developer

    E-mail:

    Katarzyna

    Katarzyna Zajchowska

    Marketing Partner

    E-mail: