Progressive Web Apps will Dominate the mCommerce Landscape

By: Keshav Pandey, Jun 13th, 2019 # PWA

Blog Banner PWA will Dominate mCommerce Landscape

“How many of you are reading this?”

“I hope I haven’t lost your attention or have I?”

Well, these are the questions which usually keep us at the edge of the seats— something for which we all have been working hard.

While we continue to expect our users to spend endless time on our web-space, they assume us to be faster on all the touchpoints.

And why not?

Humans have shorter attention span than the goldfishes, i.e., merely 8 seconds; and if you own a mobile website, a slow website digresses their attention in less than that timeframe.

Google says that if you can’t gain attention in less than 10 seconds, the bounce rate goes as high as 123%.

Unfortunately, you don’t have supernatural faculties to get out of the screen and offer a drink or play video games to get hold of their attention.

Whatever you have to do, you have to do right with your portal without having to be too alien or too weird a concept for your customers.

And if you have an e-commerce, user-experience becomes a hard mango to reach— and everything settles down to one question— “how to get more users to mobile websites?”

Again, we are focusing on user-reach and conversion through mobile devices because “who cares about shopping on desktop and other non-portable devices?”

80% of the world’s data pack got consumed on cell phones and mobile devices in 2018, and the usage seems to have no limit for the years to come.

The transaction through mobile-commerce denotes men’s potential to conduct worldly-trades at a snap of fingers.

PWA answers to the never-ending thirst— more mobile users

As we look to target more mobile users, we need the likes of PWA (Progressive Web Application) technology to keep our m-commerce spaces more user-friendly and less irritating.

I’d be dishonest if I fit PWA in the category of “technology to look for the future,” or “future of mobile commerce,” because it’s the present and your next door neighbor is already implementing it.

PWA for e-commerce hasn’t surfaced overnight, in fact, it’s been into the discussion for more than three years now, and a lot of e-commerce companies have been already reaping the advantages of the PWA features.

Before you involve yourself in PWA, answer the much-needed question— “when do I need PWA for my mCommerce?”

If the answer(s) is:

  • Your website transits at snail’s pace, i.e., it takes severe dragging for your page to load.
  • Your website loses the m-commerce race with your native app competitor.
  • Your website bounces off the users with ease— courtesy to the blank page which takes forever to load.
  • Your website feels dull, boring, and non-immersive.
  • Your website fails to reach the visitor’s threshold for the day.

Now that you have got the answers, you are good to go with PWA as a dominant force for your e-commerce.

Learning PWA theatrics from the existing implementers

As mentioned, PWA is not the future but the present of the mobile commerce, let’s pick up some of the e-commerce giants by their neck who have implemented it with its taste of success reaching the right sensory-buds in no time.

George.com

The George clothing brand— owned by Walmart had many problems while operating its mCommerce channel.

Challenges

As the user-expectations take huge dive with e-commerce businesses (wanting natural shopping experience), George store needed to get off the old mobile solutions and redecorate it into something which adds to the user-experience without disturbing the current flow.

Sometimes makeover of the website backfires, and no matter how much you invest, things don’t work for you.

Considering the potential threat that users may not give rave reviews to the new George portal, the company adopted a PWA focused-approach to combat this problem.

The PWA-centric approach dealt with refurbishing the storefront ambiance along with enhancing the speed.

The changes in the website

As George Asda sprinkled some of the progressive web app nutrients and components in the website, the mobile site gave “native-apps” like features without the over-investing time and money for the native applications.

So, let’s quickly glance through some of the changes.

  • Bang with the top-left corner: With hamburger menu as a side navigation drawer at the top left corner, the George website allows the users to filter the store by department category. Along with easy filtering procedure, the hamburger menu is a quick navigation tool which radiates a good app-like feel.
  • Attractive physique: The large icon banners, the sliders, filters, and clear result pages structurize the user flow and improves the overall experience.
  • Frictionless payment and checkouts: Payment and checkouts have always been notorious for mobile websites. With resorting to PWA technique using Payment APIs, George ensures hassle-free checkouts in a matter of a few seconds.

The stats to watch out

George Asda settled with PWA approach in early 2018, and it has observed a significant rise in the conversion since then.

It shot up to 1/3rd of the actual value, i.e., as good as 31% more conversion.

The conversion had a lot to do with the page load time and easy navigation.

  • 28% - Longer average time on site for visits from Home screen
  • 20% - More page views per visit
  • 2x - Lower bounce rate
  • 3.8x - Faster average page load time

The bonus of PWA-George over Mobile web-George is that it covers the need of the mobile web reach and application-based engagement at the same time.

Aliexpress.com

Aliexpress— sprouting out of the e-commerce giant Alibaba has been one of the go-to portals for creative and easy on pockets products.

However, with the increasingly global reach, Aliexpress had to face similar mobile commerce problems like any other online sellers.

Challenges

Aliexpress is known for its creative mobile designing, and needless to say, it discovers customers through mobile more than any other medium.

Furthermore, they have been riding on the customer’s mobile experience ever since they launched their website.

As mobile commerce leaps giant steps every day to reach close to e-commerce, Aliexpress looks to engage users through mobile-driven solutions, and it has been an uphill task until now.

Also, it admits to the fact that it takes a shell of entire new management to push customers to download the native apps.

The figure turns ugly with the fact that the number of applications downloaded and installed by any user per month is a big zero.

Moreover, reminding the users to install the applications is a challenging task which also suffocates the bank deposits.

With PWA, they saw the potential of converting non-app users into the app-user (not literally but the feel of the mobile web).

The changes in the website

As Aliexpress adopted the PWA-technique, the changes in the website enhanced the performance by manifold, granted the offline mode usage to the users, and engaged and re-engaged them.

It owes gratitude to PWA for revamping mobile web into app-like brilliance.

Here are three cheers to some of the PWA changes in the website.

  • Popular product category: The product categories in the mobile web is way too appealing as it permits the users to navigate to their favorite product through the animated tray. It’s light to code and swift to load.
  • Cross-browser reach: We know that application takes immense efforts for development and they should be operating system friendly. PWA-based Aliexpress removes the need for the apps on different systems because PWAs are easy to access regardless of the browsers. The very model helps it to reach the web audience by 82% on iOS Safari.
  • Attractive page layout: It displays all the products as smartly as it promotes shop deals through the auto-banners on the dashboard. The call to action through shopping cart menu entices the users to enroll in the website yielding fantastic user-experience like native apps.

The stats to watch out

Aliexpress is one of the early admirers of PWA, and it has produced a strong case-study to mark a point among other mCommerce vendors.

It started its PWA journey in the mid-2016s, and since then it has produced brilliant results to prove PWA as the new apple of the eye trend for the mobile web holders.

  • 104% for new users across all browsers
  • 74% increase in time spent per session across all browsers
  • 2X more pages visited per session per user across all browsers
  • 82% increase in iOS conversion rate

This switch from mobile web to PWA facilitates Aliexpress to enhance their sales by utilizing the new browser features which generate native-app feels across.

Lancome.com

Lancome— home to luxurious cosmetic items has been an old business school which also offers mobile solutions through its interactive e-commerce website.

Since it operates the business both offline and online, it knows the substance and essence of what’s coming their way when it comes to sales.

It could quickly identify its challenges by comparing sales and revenue cycle of online and offline business.

Challenges

Much like the other parts of the world, Lancome knew that mobile reach would supersede desktop reach way before in 2016.

Their mobile website did invite more users, but unfortunately, it couldn’t convert as much a user as a desktop.

They saw that desktop shopping gives a clear insight about the products and larger screen inevitably drives the conversion; however, with mobile devices, they can’t do much when it comes to sizing the webpage.

Another critical case study reflects that they received 38% of the orders from the desktop while mobile incited only 15% of the orders.

Going by the consumer behavior, it was pretty natural that they were expecting an excellent mobile-shopping experience, and with slow and wickedly designed website, Lancome couldn’t reach the mobile targets as they anticipated.

They understood the concept of “users want to read the newspaper without having to look at it,” or “users want to browse through native apps without having to install or open it,” and it is why they dropped the idea of e-commerce and embraced PWA as the perfect one-stop solution to answer the concept.

The changes in the website

With progressive web application, Lancome has progressively observed higher conversion and sales through the mobile route.

Let’s quickly roll our eyes through some of the PWA features which have done wonders for it.

  • Welcome prompt feature: With the help of PWA, Lancome has able to spring an immersive welcome prompt page which proffers discounts.
  • Push notifications to bring out curiosity: It uses service workers for PWA m-commerce which excels in delivering the seamless shopping experience with a strong network, and alarms users with push notifications.
  • Hamburger sliders to sort: Moving ahead of the competitors, Lancome allows the user to enjoy hamburger menu in sorting and filtering, unlike others who stick to the traditional main hamburger menu. The extension is natural to code in PWA and very light in weight.

The stats to watchout

By October 2016, Lancome had reached new heights with its PWA shopping route.

More than 18,000 customers subscribed for the product alert in less than six months of the web-app launch.

Some of the other stats may definitely urge you to have your web-apps in place before you go for e-commerce.

Significant result

  • 17% rise in conversions
  • 15% narrowing of bounce rate
  • 51% surge in mobile sessions
  • 84% decrease in shopping time until the page is highly-interactive

Safari stats

  • 10% reduction in bounce rates on iOS
  • Amplified mobile sessions on iOS by 53%

Push notification

  • 8% of consumers who visit the site through push notification converted
  • The open rate improved by 18%
  • Efficient conversion rates on abandoned carts by almost 12%

The idea to stick with PWA and not native application did work wonders for the Lancome, and they have advanced further with desktop progressive web applications.

Getting started with analyzing your m-commerce

If you have mobile commerce and want to analyze its performance, you may like to have assessing tools like Dareboost or Pingdom in your armor.

However, Google’s Lighthouse assesses and produces exact data for your website and suggests how far your site is from the progressive web app touch, and prolly it’s why it’s the most reputed PWA analysis tool.

For instance, the performance of Lancome in Lighthouse shows that the mobile web app is close to 94%, which means that PWA almost got real as a native app.

So, Lighthouse conveys that your web-app:

  1. Can load in offline mode or sustain flaky network conditions
  2. Page load is relatively fast
  3. It originates from the secure point

The conclusion

PWA is already dominating the mobile landscape because of the two primary reasons

  1. Google has been emphasizing and pushing the need for PWA because it has announced page indexing based on how progressive the web-app looks like. If you are looking forward to indexing your page, go through this comprehensive guide.
  2. Google doesn’t want to lose web-based searches and customers in the hands of native applications. You may consider PWA as a fitting reply to the apps which get run on the famous operating systems like iOS. Google is sticking to page indexing and visibility concerning how progressive the web-app is because it keeps the mobile web owners in the hunt.

Keep a note that not all progressive web applications are fast— a lot of factors affect the agility of the same— pretty much as the mobile webs.

So, if you are looking to re-dress the attire of your website in the thirst of the speed, the mere makeover wouldn’t bring changes in a jiffy; instead, you will need some experts who understand all the factors and pitch precisely the way the mighty search engine wants.