Skip to content
7 min read

Magento PWA Studio

This post discusseses PWA Studio from Magento. Magento PWA Studio is a collection of tools that lets developers build complex Progressive Web Applications on top of Magento 2 stores. Using PWA Studio, SEO359 (in cooperation with an external developer) built cloth-face-masks.com, a live PWA site in Holland.

Progressive web app (PWA)

Progressive web app (PWA) technology helps online B2B and B2C merchants deliver an eCommerce experience that meets today's digital, mobile-first consumers' expectations. PWAs give a browser-based, app-like shopping experience proven to streamline mobile performance, attract more shoppers, and open revenue streams.

At SEO359, we think a PWA is an excellent solution for new Chinese companies going global. This post describes how we launched a PWA for a Dutch face mask designer, www.cloth-face-masks.com.

Mobile's current drawbacks

The majority of today's mobile commerce experiences are based on a responsive web design or a native app. Both technologies were developed in response to the impracticality of replicating desktop browser environments on a mobile device. However, neither of them truly meets the needs of many of today's mobile-savvy consumers.

Native apps are applications built for use on a smartphone. The app is installed on a user's mobile device through an application store, such as Apple's App Store or Androids App Store. However, research shows that 50 percent of smartphone users prefer a mobile site because they don't want to download an app.

Responsive web design is based on a one-size-fits-all grid system. RWD scales a browser's content and associated elements to fit within the user's screen. By resizing site components in relation to one another, it delivers smoother, contextual browsing. Attempting to replicate your desktop browser experience on mobile is out of touch with mCommerce users who have differing expectations, interactions, and intents. RWD downloads the same code to display a site on mobile as it would on a desktop system, increasing load times. Multiple studies have shown that mobile sites with longer load times have higher bounce rates, negatively affecting conversions.

Progressive Web Apps improve the mobile experience

Consumers are ready for a next-generation answer to the mobile engagement question. The answer is Progressive Web Apps (PWA), a browser-based application software constructed and delivered via the web using an app-like interface. Bridging the gap between mobile apps and mobile sites, PWAs provide faster performance, reliable connectivity, and fluid site navigation. These and other benefits are proven to invigorate user engagement, drive conversions, boost average order value, and accelerate revenue growth.

Magento PWA Studio

At SEO359, we use PWA Studio to build high-performance PWAs on top of Magento Commerce or Magento Community. Magento delivers a fully decoupled front-end in PWA Studio supported by an expansive back-end technology suite. The result is an integrated eCommerce solution.

The Magento PWA Studio is a developer-centric platform helping an agency like SEO359 to help our clients deliver next-generation mobile experiences to their users. Key features of the Magento PWA Studio are:

  • Tools to personalize and localize content
  • The ability to build and manage all channels and experiences via one code base, one deployment, and one app
  • Modularized component architecture and extensibility framework to grow opportunities for extension resellers
  • Purpose-built developer tools for fast prototyping, helpful debugging, rich feedback, and increased productivity
  • The Venia reference storefront, which accelerates time to market with pre-built UI and style components from the home page to checkout

A live site with PWA Studio and Magento 2

Transforming mobile shopping with PWA Studio.

CFM is a project from a Dutch artist to sell luxury face masks. This item is typically searched for and purchased from a mobile device. With the help of SEO359, CFM saw an opportunity to transform its mobile commerce experience and take the lead in their niche market by embracing PWA technology with Magento Commerce 2. And so the future-proof the look and feel of their digital commerce environment began.

The results

Using PWA Studio, the CFM PWA provides the visitors an app-like shopping environment, with a great ease of use. Examples are features like horizontal scrolling and streamlined navigation. These eliminate the need for the standard 'back' button, which defines most browser experiences. CFM also enhanced the checkout journey partly by a smooth integration with Mollie's local payment solution to enable a real omnichannel experience.

Conclusion

PWAs are a big push forward in the ongoing evolution of mCommerce. Combining PWA Studio and Magento, one can create a website that blurs the lines between native apps and mobile sites. SEO359 has a first live project, CFM, which has this app-like shopping directly in the browser. When looking at CFM's PWA that offers power, speed, and flexibility, it's difficult to imagine a digital commerce experience that cannot be improved upon using PWA technology—including yours.