Bringing Composability to your Salesforce Frontend
A pragmatic approach for improving customer experience with Salesforce Commerce Cloud.
The frontend experience of an e-commerce platform can make or break a brand's success. Yet many established brands, particularly those using traditional e-commerce front-end experiences, like Site Genesis or SFRA (Salesforce Reference Architecture) for Salesforce Commerce Cloud, can leave a lot to be desired from the perspective of a modern consumer. This disconnect between consumer expectations and the existing frontend experience of many brands presents a significant challenge for e-commerce managers and business leaders.
The Modernization Challenge
There are many reasons for businesses to bring composable solutions into their e-commerce architecture. With roughly 65% of customers expecting companies to adapt to their changing needs and preferences, the ability to deliver highly personalized and differentiated experiences across touchpoints that composable commerce enables is a crucial one.
Equally important is site speed. The highest e-commerce conversion rates occur on pages with load times between 1-2 seconds. Each additional second of load time can result in a 4.42% drop in conversion rates, emphasizing the importance of performance optimization in composable commerce. Composable commerce solutions can improve website performance with up to 40% faster page load through advanced technologies, such as server-side rendering and intelligent caching.
Despite widespread recognition of the benefits offered by modern headless frontend experiences, many brands hesitate to make the leap. The reasons are multifaceted:
- Perceived complexity: The prospect of overhauling an entire frontend experience can seem daunting.
- Resource constraints: Both financial and human capital required for a major update can be substantial.
- Misconception of "big bang" replatforming: Many believe that modernization requires a complete, all-at-once overhaul.
- Resistance to change: Stakeholders may be wary of disrupting a functional, if suboptimal, experience.
These perceived barriers often lead to inaction, causing brands to fall behind in delivering optimal customer experiences. However, there's a more pragmatic approach that can bridge the gap between legacy systems and modern frontends: incremental adoption.
The Power of Incremental Adoption
Incremental adoption offers a middle ground between maintaining the status quo and a complete platform overhaul. This approach involves breaking down the modernization process into manageable steps, allowing brands to:
- Demonstrate value at each stage, building momentum for further improvements
- Adapt and learn throughout the process
- Spread costs over time
- Mitigate risks associated with large-scale changes.
By adopting this strategy, brands can begin reaping the benefits of modern frontends without the perceived risks of a full replatforming effort.
Companies like Salesforce provide solutions that enable a hybrid approach to composable, allowing you to build some pages using a traditional storefront and some pages in a composable way. This approach is flexible, modular, and does not require the entire experience to be driven by APIs before it can go live. Companies can dip their toes into composable by starting with specific aspects of the experience, such as product display pages or category pages, while transitioning other pages, like cart and checkout, later.
This gradual approach can ensure uptime and business continuity while exploring and expanding into composability. Some corporations are choosing to use the hybrid approach to test composability in international markets or pop-up experiences where composability makes sense.
Practical Steps for Brands Using Salesforce Commerce Cloud
Modernizing your Salesforce Commerce Cloud frontend can seem daunting, but a structured, incremental approach can make the process manageable and effective. Before you take the first step to a composable future, however, you need to think critically about what your goals and objectives are, and how you’re going to leverage composability to achieve them.
There is no value in making a change for the sake of theoretical improvements and if you fail to think through why you’re making a move to composable, you will struggle to find success with it even if it is the right move for your business.
That means you need to build your composable strategy against business goals, keeping the key questions — why are we doing this and what are we trying to do? — at the forefront as you do. Is the goal to increase conversions, improve speed, create a unique experience, or accelerate innovation by decreasing developer ramp? By tying your strategy to KPIs like reduced TCO and improved GMV, you’ll create the conditions where making a move to composable not only makes sense in theory, it makes a real difference for the growth and continued success of your organization.
With the goals firmly in mind, here are some practical steps to guide your journey to composability:
Step 1 - Assess Current Limitations
Start by identifying pain points in your existing frontend that impact customer experience, conversion rates, or operational efficiency. Use diagnostic tools like Noibu to pinpoint and quantify the business impact specific areas that need improvement, such as slow page load times, high bounce rates, or poor mobile performance.
Step 2 - Prioritize High-Impact Areas
Focus on changes that will deliver the most significant improvements with the least disruption. Key areas typically include inspirational content, search functionality, merchandising, promotions, and the checkout process. By addressing these high-impact areas first, you can achieve quick wins that build momentum for further enhancements.
Step 3 - Plan a Phased Approach
Develop a roadmap for incremental improvements, starting with low-hanging fruit and progressing to more complex updates. This might involve making enhancements to the existing Site Genesis or SFRA frontend, such as integrating a modular search and product discovery platform, before moving towards a fully headless frontend or composable commerce approach. This phased approach allows for gradual transformation while maintaining operational stability.
Step 4 - Build Cross-functional Teams
Involve stakeholders from marketing, IT, and operations to ensure a holistic approach to modernization. Modernizing the frontend experience and introducing specialized tools can enhance collaboration across the organization, but it requires effective change management to ensure alignment and efficiency. Cross-functional teams can help bridge gaps and foster a shared vision for the transformation.
Step 5 - Implement and Iterate
Begin with small, measurable changes and use data-driven insights to guide further improvements. Start with pilot projects that can demonstrate the benefits of modernization, such as headless product listing and product detail pages or an improved checkout process. Use the insights gained from these projects to refine your approach and plan subsequent phases, ensuring continuous improvement and adaptation.
By following these practical steps, brands using Salesforce Commerce Cloud can navigate the complexities of frontend modernization and unlock the benefits of a modern, engaging e-commerce experience.
Overcoming Objections
As you embark on this journey, you may encounter resistance. Here are some strategies to address common concerns:
- Start Small: Demonstrate success with a limited-scope project to build confidence.
- Emphasize ROI: Use data from each phase to illustrate the financial benefits of modernization.
- Highlight Competitive Advantage: Show how improved customer experiences can differentiate your brand in the market.
- Leverage External Expertise: Partner with experienced vendors or consultants to supplement internal resources and knowledge.
The Path Forward
Modernizing your e-commerce frontend doesn't have to be an all-or-nothing proposition. By embracing an incremental approach, brands can navigate the complexities of digital transformation while delivering tangible benefits at each step of the journey.
As you consider your own path to a modern frontend experience, remember that the goal is not just technological advancement, but also improved customer satisfaction, increased conversions, and ultimately, business growth. With a pragmatic, step-by-step approach, even brands who have been using Site Genesis or SFRA for many years can successfully modernize their frontend experiences and stay competitive in the ever-evolving world of e-commerce.
To stay up to date on the evolution of commerce at Salesforce, listen to the Salesforce Commerce Cloud Innovations podcast.
Natalija "Nat" Pavic
Product Marketing Leader, Salesforce
Natalija "Nat" Pavic is a Product Marketing Leader at Salesforce responsible for Alliances Strategy. She has been in the industry for over 17 years having held a variety of positions in product, sales, solutions, strategy, and marketing. She is also the founder and host of the Salesforce Commerce Cloud Innovations Podcast which can be found on every major podcast outlet. Nat holds a patent for generative promotions at Salesforce and is passionate about innovation in eCommerce.
Everett Zufelt
VP, Strategic Partnerships & Emerging Technology, Orium
As VP Strategic Partnerships & Emerging Technology at Orium, Everett leverages his extensive technical background and over a decade of experience in headless and composable commerce to lead the development of Orium’s offerings. He guides the go-to-market strategy and supports his teams in crafting solutions that enhance the digital capabilities and operational efficiency of scaling commerce brands.