Demo flow

You are now ready to see your commerce solution in action. Explore the product catalog by browsing or searching as a guest or logged-in customer. Additionally, you can change the languages and countries you set up, add items to your cart, enter payment details and shipping information, and proceed to check out.

Product discovery
Account management
Checkout
Multilanguage setup

Product discovery

When product discovery is the initial phase of shopping, your customers find and explore products that match their preferences, needs, and interests. It is a critical aspect of the commerce experience because it can significantly impact a customer's likelihood to make a purchase and their overall satisfaction with the store.

Search functionality: a robust search feature allows customers to enter keywords, product names, or specific criteria to find the products they are looking for quickly. Search results should be accurate and relevant.

Filters and sorting: filter and sorting options help customers narrow down their product choices based on attributes like price, size, color, or brand. Navigate to a category listing page and explore the available filters.

Navigation: organizing products into well-defined categories and subcategories makes it easier for customers to browse and discover items related to their interests. The navigation is integrated into the header and contains all the categories coming from Composable Commerce. On top of that, certain categories come with additional promotional content within the flyout, if you choose to leave the default configuration.

Here are some suggested demo flows that work with the default setup and sample data. You may need to adjust those flows to fit your data.

Product discovery via the homepage

On the homepage, scroll down to New Arrivals to view a product listing.

To preview the product, you can use the Quick View functionality.
To view the Product Detail Page that includes Product description and Additional details, go to More details.

You can either add the item to your cart using Add to cart or add it to your wishlist using the heart icon.

Product discovery via categories

You can search for a product using categories from the navigation. Any category will take you to a Category Listing Page that includes filters to narrow down the product list further.

Product discovery via search

You can search for a product using the search box. For example, when you search for "bed", you'll end up on the Search listing page with all products matching the search term.
When you click the search box, you'll also get recommendations even before typing. Alternatively, you can click the recommended product to open a Product Detail Page.

Account management

Account management functionality allows your customers to see and manage their profile, change passwords, or look at their past orders. Either register a new account or use an existing account to discover this part of the storefront.

Checkout

You can initiate the checkout process for any item in your cart, either as a logged-in or anonymous user. To do this, click the bag icon in the top-right and select Go to checkout. In the case of an anonymous user, you will need to fill out the Addresses section as well. Finally, select a shipping method and complete the payment information.

Following a successful payment, you will be redirected to the Thank you page. Then, you can also review the order in the Account section.

Demo flow

Product discovery.css-c0cbbx{display:inline-block;}.css-c0cbbx >:disabled{pointer-events:none;}.css-ik49mw{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}.css-ik49mw *:not([fill='none']){fill:inherit;}.css-ik49mw,.css-ik49mw image{width:24px;height:24px;}

Product discovery via the homepage.css-c0cbbx{display:inline-block;}.css-c0cbbx >:disabled{pointer-events:none;}.css-ik49mw{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}.css-ik49mw *:not([fill='none']){fill:inherit;}.css-ik49mw,.css-ik49mw image{width:24px;height:24px;}

Product discovery via categories.css-c0cbbx{display:inline-block;}.css-c0cbbx >:disabled{pointer-events:none;}.css-ik49mw{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}.css-ik49mw *:not([fill='none']){fill:inherit;}.css-ik49mw,.css-ik49mw image{width:24px;height:24px;}

Product discovery via search.css-c0cbbx{display:inline-block;}.css-c0cbbx >:disabled{pointer-events:none;}.css-ik49mw{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}.css-ik49mw *:not([fill='none']){fill:inherit;}.css-ik49mw,.css-ik49mw image{width:24px;height:24px;}

Account management.css-c0cbbx{display:inline-block;}.css-c0cbbx >:disabled{pointer-events:none;}.css-ik49mw{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}.css-ik49mw *:not([fill='none']){fill:inherit;}.css-ik49mw,.css-ik49mw image{width:24px;height:24px;}