The Good Store by commercetools Frontend

The Good Store by commercetools Frontend: How retailers can fast-track storefronts with a pre-installed template

Saumya Goel
Saumya Goel
Senior Product Manager, commercetools Frontend
Published 23 May 2023
Estimated reading time minutes

With a pre-installed and launch-ready storefront — The Good Store — frontend developers can streamline the development process and quickly launch stores, taking advantage of UX/UI best practices while leveraging all the benefits of commercetools Composable Commerce and Frontend. 

The Good Store by commercetools Frontend

Today’s retailers must create stunning digital storefronts to meet ever-growing customer expectations, but getting a new frontend up and running takes a lot of time and effort. Frontend developers need to implement hundreds of UX/UI (user experience/user interface) best practices to enable frictionless customer experiences while optimizing storefronts for speed and performance. In a nutshell, that’s a tough job to get in a short timeframe.   

This is where the pre-installed storefront solution powered by commercetools Frontend, The Good Store, comes in. As a set of frontend components and integrations, it enables frontend developers in the retail industry to build new storefronts with a fast time-to-market, powered by: 

  • Speed and performance optimization, with a cloud-native infrastructure behind the scenes, Progressive Web Apps (PWA) development and more, delivered by commercetools Frontend. 

  • Integrate best-of-breed solutions via commercetools Frontend’s API Hub, such as Adyen for payments, Algolia for search or Sendgrid for email marketing. 

  • All the bells and whistles of commercetools Composable Commerce, which includes product catalog, inventory and order management capabilities.

Last but certainly not least, frontend developers gain easy access to 100+ UX/UI best practices out-of-the-box to accelerate the development and deployment of new storefronts.   

A shortcut to UX/UI best practices

Frontend developers can leverage over a hundred retail UX/UI best practices with The Good Store by commercetools Frontend. Here’s a sample of five best practices and how The Good Store has implemented them:   

Best practice #1 - Feature a wide range of products on the homepage 

First-time users often rely on the homepage to interpret the site's purpose and offerings. That’s why retailers should feature a wide range of product types on the homepage, representing at least 40% of their available products. 

The Good Store implementation: Retailers can feature their top products by displaying multiple product categories, campaigns and a versatile product slider on the homepage.

Best practice #2 - A prominent guest checkout option 

Don’t force users to sign up for an account to place an order. Instead, offer a guest checkout option. 

The Good Store implementation: Guest checkout is the most prominent option to avoid cart abandonment. 

Best practice #3 - Enclosed checkout design

Avoid distractions during the checkout process, like displaying the main site navigation. 

The Good Store implementation: “Enclosed Checkout” removes non-checkout elements, including the main site navigation, from all steps after the cart until reaching the order confirmation page. 

Best practice #4 - Avoid site-initiated chat options

Site-initiated requests for feedback or live chat dialogs are intrusive to the shopping experience. Provide user-initiated engagement options in strategic areas.  

The Good Store implementation: Static links for chat options in the footer, help sections or header provide engagement options without disrupting the user experience. 

Best practice #5 - Load products per request 

Avoid overwhelming users with a high number of products loading all at once. In addition, loading all products in one request presents challenges in speed and performance.   

The Good Store implementation: A “load more” schema for category-based product lists and search results, combined with “lazy loading” (the practice of delaying load until new information is actually needed), enables retailers to optimize load times, improve performance and avoid overwhelming users.

How to use The Good Store

In simple terms, The Good Store provides everything out-of-the-box to help retailers launch a new frontend quickly, especially for specific cases, like launching pop-up stores or testing new markets. When speed trumps customization needs, The Good Store is a great option. 

However, most retailers prefer creating digital storefronts and building components from scratch using commercetools Frontend to tailor customer experiences. In such cases, The Good Store acts as an accelerator by providing documentation, tutorials and best practices to reduce development efforts. Developers can even copy The Good Store code, which helps to reduce implementation time. For example, the frontend components include schema that shows how a developer can configure components in Frontend Studio to empower content managers and other business users to manage content using this no-code interface. 

Furthermore, developers already using commercetools Frontend can learn how to leverage the new commercetools Frontend SDK in their components and integrations using The Good Store for additional guidance. 

Undoubtedly, retailers’ need for fast storefront implementations is here to stay. That’s why every aspect of commercetools Frontend, including The Good Store, is geared toward helping our customers accelerate implementations with robust tools and workflows that increase productivity and prioritize innovation. 

Are you exploring how to accelerate the implementation of your digital storefronts? To dive deeper into this new feature and commercetools Frontend, contact us for more information

Saumya Goel
Saumya Goel
Senior Product Manager, commercetools Frontend

Saumya is a product professional who enjoys growing revenues with both analytical and creative skills. She has 12+ years of professional experience growing companies in 10+ countries. She is always learning, always exploring and loves to contribute to impactful stories.

Latest Blog Posts