Sakara.

Sakara came to Rotate° to source a partner to support achieving their strategic objectives, including improving conversion rate and customer lifetime value. Partnering with Sakara’s Product and Tech teams, we embarked on a full eCommerce project that encompassed both the customer experience and back-end technologies and platforms.

The 6-month project was formed of three phases:

• Discovery — Collaborative and comprehensive phase to immerse in the business and provide a detailed project plan

• Design Vision — Exploration and concepting of the visual language and bringing the brand into the digital realm, to provide design alignment

• Production — A series of agile sprints from a dedicated cross-functional team to bring the store to life

This is how we did it…

In body and spirit; creating real-life Discoveries in NYC.

We kicked-off the project with a Discovery and in true Sakara form, we needed to be with them in both body & spirit to fully understand the requirements and unearth the solutions. 4x tickets to the Big Apple 🍏 and 8x workshops enabled us to do just that.

During Discovery we tackled the following:

• Understanding what Sakara (and their customers) want in terms of an experience

• Key project goals and measures of success

• Align on expectations and delivery mechanisms

• Decipher the unknowns

• Mitigating any risks

Ultimately to create a comprehensive plan of action to deliver the project, that everyone is onboard with.

A strategic vision to stand-behind. Not bamboozle.

Through our user-testing process during Discovery we uncovered that users were feeling a little overwhelmed with the Sakara offering. At times they felt unsure about which product was right for them and needed guidance. In tandem, we knew we could lean on the juxtaposition of the brand – The Science &. Spirit – to compliment (not distract) the customer journey.

Our strategy was clear: Simplify & Clarify. And bring harmony to presenting both the clinical health messages brought to life through storytelling and customer endorsement.

Behind-the-scenes, the Sakara digital team wanted to be empowered by the technology to Create, Collaborate & Test. It was imperative that the technical architecture allowed for a highly flexible experience, with frictionless testing and long-term engineering independence.

A Design System to empower an editorial experience

A comprehensive design system was crafted to facilitate an editorial experiences with limitless configuration. This initiative is part of a broader brand refresh spearheaded by Lotta Nieminen , aimed at revitalising Sakara's image and resonating more deeply with its target demographic. Central to this was the fusion of aesthetics – blending elements from the worlds of fashion and wellness – to create an immersive and captivating digital environment.

The design system emphasises the importance of balance, striving to capture the distinctive spirit of Sakara while ensuring accessibility for all users. By embracing modularity, the design system enables content creators to flexibly adapt layouts and components, ensuring consistency across a range of page templates and use cases, whilst accommodating evolving editorial needs.

Remove the guesswork with split testing

One of the key tenets for the project was the relentless pursuit of testing. Transitioning to Sanity CMS provided a global omni-channel platform, offering the versatility needed to conduct granular tests at the level of individual content records. However, since Sanity lacked native support for split testing, we developed a tailored solution aligning with their preferred editorial workflow. This solution allowed for the creation of multiple revisions of the same content record, enabling editors to initiate split tests as needed. A solution tailored to their editorial team.

Sanity's support for GROQ (Graph-Relational Object Queries) within their webhook functionality proved instrumental. By leveraging this feature, we could detect changes made by editors to activate or deactivate split tests, triggering the necessary workflows seamlessly. The potency of Sanity's query language facilitated the retrieval of various versions of content records, streamlining the testing process.

A subscription-first business, with customer-first needs (and complexities).

Sakara's custom subscription solution demanded fine-tuned account management capabilities, prompting the development of a tailored solution within Sanity due to limitations in their existing Shopify setup. This bespoke food program builder not only offered scalability but also adaptability, ensuring Sakara could effortlessly adjust to evolving menu offerings and customer preferences. This afforded the ability to craft highly personalised programs, allowing the business to swiftly respond to market demands and consumer trends.

By integrating selling plans directly within Shopify, this streamlined inventory management by simplifying the handling of multiple SKUs. This enhanced efficiency for both Sakara and their customers, facilitating a smoother purchasing process. By combining custom solutions and native Shopify features, we improved and created efficiencies within their operational eCommerce stack, to support future growth of subscription customers.

Island Architecture

Performance was a key requirement for the migration. Whilst Sakara wanted a best in class content storefront, they needed the flexibility to create buying experiences such as tailored food programmes. Utilising island architecture means the team has a solution which provides controlled dynamic interactivity. As the site was heavily static with sprinkles of interactivity for the majority of the experience, relying on a solution such as Next.js or Nuxt.js would result in unnecessary data transfer to customers and potentially slower experiences and more bugs.

The store was content-rich, therefore by loading only the necessary components for each page we reduced unnecessary data transfer and rendering overhead, leading to faster loading times and a better UX. We utilised Astro and Alpine.js which gave the project a lightweight solution and provided the necessary flexibility to create interactive modular experiences that scale. Migrating from Vue.js, Alpine.js follows a similar declarative syntax making it intuitive and easy to onboard. This facilitated the rapid development and iteration of components that paired perfectly with Sakara’s experimentation requirements.

The Stack

Commerce platform: Shopify Plus
CMS: Sanity
Subscription: Custom app
CRM: Klaviyo
Front-end: Astro / Alpine JS
Hosting: Netlify

Project recognition

Awwwards
CSSDA
Orpetron Awards