Latest news

ShopEddies Magento 2 Progressive Web App (PWA) Go Live!

No comments

We are very excited to announce the launch of our latest Magento 2 PWA development project. Take a look now at https://www.shopeddies.com/. After three months of hard work and dedication, ShopEddies Magento 2 Progressive Web App was released on January 1, 2020.

The PWA of ShopEddies has everything people often expect from a PWA such as lightning speed, clean design, and app-like functions (e.g.: icon on homescreen, fullscreen display, offline mode, push notification…). In addition, it is equipped with some advanced e-commerce features to provide the best shopping experience for the users.

Contents

ShopEddies’s Expectations and Our Challenges

The original website of ShopEddies was developed on Magento 2 platform. It used the default Magento 2 Luma Theme with customization. Therefore, the site looks not really attractive, which also was the first motivation for ShopEddies to convert their site to Magento 2 PWA.

Besides, ShopEddies page speed was not fast and responsive enough to satisfy mobile users – the common limitations of all conventional sites. At the same time, ShopEddies realized the huge potentials of PWA for Magento 2. That’s why they sent us a request for PWA development.

There were several Magento 2 extensions on the site, but when upgrading to Magento 2 PWA, ShopEddies only wanted to maintain Amasty’s Improved Layered Navigation and Amasty’s Product Part Finder. The thing is, any modules that have an impact on Magento frontend cannot work on PWA properly without customization. It’s worth noting that PWA Storefront will absolutely replace the Magento frontend after development.

Furthermore, ShopEddies looked for a fast and convenient checkout page that was missing on their website.

Tigren Did Meet All The Expectations For ShopEddies Magento 2 PWA

We suggested using our ready-made Magento 2 Progressive Web App theme to help ShopEddies achieve their PWA in the shortest time possible. The old website design will be replaced by the powerful and well-designed Tigren PWA Storefront.

In terms of functionality, we needed to take a lot of customization work to make sure that the PWA is compatible with all essential features of required Amasty extensions.

For example, we customized and updated PWA API for the following features:

  • Shop by brand
  • Multiselect options/ multi-filter
  • Filter search box
  • Year-make-model filter
  • Part finders

Regards the checkout, we recommended ShopEddies to convert from Magento default checkout to the modern One-step checkout. As a result, it helped to simplify the checkout process and provide a better customer experience.

Project Highlights

  1. Major Goal: Converting ShopEddies’s current Magento 2 website (based on Magento 2.3.x) to Magento 2 Progressive Web App.
  2. PWA Storefront Development:
    • Applying the default design of Tigren’s Magento 2 PWA theme
    • Changing the logo, favicon, colors, fonts, font sizes, banners of the theme to the match brand identity
  3. PWA API Development:
    • Applying core API supporting almost all of the Magento default features.
    • Developing advanced features (e.g.: Product Part Finder, Improved Layered Navigation, One-step Checkout…).
    • Integrating with PayPal & Braintree payment gateways.
  4. Time of Development: approximately 2 months.
  5. Project Involvement: Project Manager, Project Coordinator, Frontend Developers, Backend Developers, and Testers.
  6. Time of Support: Free 3 months of free support after launching ShopEddies Magento 2 PWA.

Project: “Before and After”

Let’s have a look at ShopEddies’s original website and how it looks and feels after being integrated with Magento 2 Progressive Web App.

It’s worth noting that the most significant changes are added app-like features (fast Ajax loading, add to home screen,…) that can be experienced mostly on mobile devices. In other words, the following pictures cannot tell you everything. You should visit https://www.shopeddies.com/ to discover this interesting PWA.

1. Home page

The new PWA storefront design is simple but elegant. This is enough to make ShopEddies’s products stand out. All banners were re-organized on only one banner slider.

On the website, when the visitors hover on any category on the menu bar, it will not show anything. When they click on it, it will go directly to the selected category page.

Meanwhile, when the users hover on the PWA menu bar, it will show the list of categories and sub-categories for the users to choose from.

2. Category page

Red is the major color that expressing ShopEddies’s brand identity. In the new PWA, it is shown in more positions such as the selected category, add to cart buttons, filter and search buttons.

After integrating with PWA, the category page remains an array of improved layered navigation & product finder features.

3. Product page

There is no big difference between the product details page of the ShopEddies website and PWA. However, when the customers add the item to the cart, there is no slow page reload on the PWA.

4. Shopping Cart page

The cart page on the original website is the same as Magento default, whereas, on the PWA, it well matches the brand style and color throughout the site.

5. Checkout page

As you can see, the 2-step checkout of Magento 2 default was upgraded to the fast and mobile-friendly One-step checkout.

6. New Account Registration page

Like other Magento 2 websites, the users must access the Customer Login/ Create New Customer Account page to log in/ register a new account.

On the contrary, on the PWA it will show the Login & Registration popup so the customers can easily and quickly complete these steps and continue their purchases.

ShopEddies Magento 2 Website:

ShopEddies Magento 2 PWA:

7. My Account page

About ShopEddies

shopeddies magento 2 progressive web app case study

Founded in 2012, ShopEddies is a one-stop e-commerce store for worldwide customers who are looking for reasonable but high-quality parts for their cars, trucks, RVs, power sports. Over 260,000 parts and accessories are being offered in the ShopEddies store.

Want To Build A PWA Like ShopEddies Magento 2 Progressive Web App?

Tigren was in charge of ShopEddies’s Magento 2 PWA Development project from beginning to end. If you want to have a similar powerful PWA, don’t hesitate to contact the Tigren team (info@tigren.com). We will examine your requirements and send you a free quote within 24 hours.

Find more about Tigren’s Magento 2 PWA Integration service here.

For who is new to PWA, don’t miss our free PWA E-book.

1 Star2 Stars3 Stars4 Stars5 Stars (13 votes, average: 5.00 out of 5)
Loading...

Related Posts:

[New Release] The First Comprehensive PWA E-book For Magento Merchants

Magento 2 Progressive Web Apps: Do Advantages Outweigh Disadvantages?

5 Tips For Choosing New Extensions When Migrating To Magento 2

Top 20 Free Web Speed Test Tools For E-commerce Websites In 2020 (Part 1)

20 Ecommerce Trends For 2020 That We’re Excited About

April LeeShopEddies Magento 2 Progressive Web App (PWA) Go Live!

Leave a Reply

Your email address will not be published. Required fields are marked *