Skip to main content

Salesforce B2C Commerce Cloud Implementation for Beauty Goods Company

Implementing an eCommerce website from scratch starting from the idea and UX design and finishing with accessibility (ADA)

Published by jetbi
05 July 2023
Salesforce

Project description

The customer is a major skincare and face care brand that needs to allow the buyer to comfortably choose and buy the right product online. To accomplish this, we will develop a user-friendly website, based on Salesforce Commerce Cloud (SFRA).

 

Challenge

Implementing an eCommerce website from scratch starting from the idea and UX design and finishing with accessibility (ADA), the solution had to be fully compliant with SFRA. Multiple UX components of the solution for over 10 forms were architected to be reusable and thus customizable. Additionally, full responsiveness of the design and using the same components for different screen resolutions was a requirement. Pagination had to work properly for every resolution showing the optimal number of records on each screen size

 

Project scope

  • Requirements review and technical solution design.
  • Add custom templates for the product details page (PDP) following the UX design (Figma-based), and also add a personalized recommendation section with the product, based on the customer demography and the product selected.
  • 5 eCommerce websites for different brands on one core eCommerce instance.
  • The "Contact Us'' section includes 12 variations of the forms. These forms will provide customers with the ability to describe questions or problems they may have. The data collected by the forms were sent to a third-party service using AJAX on the client side. On the server side, a dedicated controller was created to handle the data submission process.
  • Customer profile page. This page was technically designed with several templates such as Order history, Client profile information, as well as variations for a registered client and a guest. Additionally, templates for tracking order status and product location during delivery were implemented.
  • Search results page. This task included separate templates for both the results block and search results page, ensuring they will be optimized for various devices such as mobile and desktop. The templates will be adapted to display the appropriate number of matches found and will accommodate different brands. Also, the admin ability to configure the search results to be displayed either as a modal popup or as a right sidebar, depending on the site.
  • Create the configuration for Content Assets and Content Slots, Content assets configuration for both static content like advertising banners and images, as well as specific categories of individual banners and recommended products. This configuration will enable easy management and customization of content throughout the website, allowing for seamless integration of various types of content assets in different slots.

 

Result 

The result of this project is a modern, scalable, and customizable web-store solution for 5 brands managed centrally through one eCommerce core system. Conventional user experience, fully responsive and accessible across mobile, desktop, and tablet devices. It adheres to the accessibility requirements and provides a user-friendly admin panel (Business Manager in Salesforce Commerce Cloud) for efficient management of products, orders, and email communication. The store also features a user-friendly interactive form “Contact Us” to address customer inquiries effectively. Additionally, a highly flexible product filtering system is implemented, enabling customers to quickly find the desired products based on their specific preferences.

Start your project now
Expertise
JET BI TEAM
  • 1 Certified Frontend/Salesforce Commerce Cloud Developer
  • 1 Certified QA Engineer
  • 1 UX designer
TECHNOLOGIES
  • Salesforce
  • APEX
  • Git
PROJECT TIMELINE
  • 10 months
Question to the expert
image

We have available resources to start working on your project within 5 business days

1 UX Designer

image

1 Admin

image

2 QA engineers

image

1 Consultant

image

Steps following request submission

schema

icon

After receiving your request, we analyze it and we offer free online meeting slots (via email) so that we can discuss your needs in as much detail as possible

icon

We begin gathering all necessary requirements to create comprehensive estimates, including timelines, resource allocations, risk assessments, and underlying assumptions.

icon

Once all preparations are in place, we will initiate the project and move forward with the planned tasks