Michela Frecchiami

In e-commerce, a smooth and intuitive shopping experience can make all the difference—helping customers find what they need faster, increasing the chances they'll complete a purchase, and increasing their basket size.

While Shopify offers several features to enhance product presentation and purchasing flows, many merchants struggle with how to effectively display related products—such as variations, complementary items, and customizable sets—while keeping the their online store’s shopping experience intuitive.

In this article, we're going to showcase three different ways to present related products in a Shopify store and give you a clear framework for understanding what tool to use depending on your specific scenario.

Let's take a look!

## LAKE's Product Presentation Challenge: A Case Study

While working with premium sleepwear brand LAKE, we encountered multiple product presentation challenges that illustrated the importance of selecting the right tool for the job. LAKE's diverse product catalog—featuring style variations, complementary products, and customizable bundles—called for a deep understanding of product relationships before implementing technical solutions.

By analyzing how LAKE's products related to one another and how customers interacted with them, we were able to present an approach that addressed their specific business objectives. Specifically, LAKE wanted to explore different business scenarios:

* Enhance the product browsing experience by showing style variations (like sleeve length) on product pages.
* Implement more effective product recommendations using straightforward solutions.
* Create a customizable experience for bundled items that were being treated as single products.

After a thorough analysis of their customer journey, we discovered that no single Shopify app would address all these needs. Instead, we explored a hybrid approach based on the different types of product relationships.

## Three Solutions for Product Cross-Selling

Based on LAKE's needs and the different types of product relationships, we proposed three distinct solutions for cross-selling:

### 1. Combined Listings for Style Variations

For closely related style variations (like the same pajama top in short-sleeve and long-sleeve versions), we recommended Shopify Combined Listings. This feature (available exclusively on Shopify Plus and enterprise-level plans) allows merchants to display multiple related products as variants within a single listing while keeping them as separate products in the backend.

This means each product can have its own:

* Product title, product description, and metadata
* Unique image gallery
* Independent product URL for better SEO

Why it works for style variations:

* Customers can easily toggle between short-sleeve and long-sleeve options without leaving the page
* The variations are genuinely different versions of the same core product (same fabric, design, and general style)
* It provides a seamless browsing experience while keeping separate product URLs for better SEO and inventory management

<figure>
	<img src="https://cdn.sanity.io/images/kqgmf0g2/production/0e7ef79ee680f895fdcfa1e7762645e7c17c4ed7-1600x1052.jpg?fit=clip">
  <figcaption>A prototype for LAKE, showcasing a men's pajama set with two style variations.</figcaption>
</figure>

Another use case is using Combined Listings to display separates (i.e. top, bottom) that are often bought together.

<figure>
	<img src="https://cdn.sanity.io/images/kqgmf0g2/production/13771e641a9ab5940cc706364b59b131a59c4491-1600x1052.jpg?fit=clip">
  <figcaption>An example of how separates can be shown usinf Combined Listing.</figcaption>
</figure>


### 2. Quick Add to Cart for Complementary Products

One of the options LAKE asked us to explore was a flexible way to display matching products on the product page. For example, a women's pajama set and its matching version for children are perfect for a "mommy and me" moment. While these items are designed to complement each other, they are separate products targeting different users, not variations of the same item.

In this case, a Quick Add to Cart functionality works best:

* A women's pajama set and a child's pajama set are separate products rather than variations of the same core item, unlike short-sleeve and long-sleeve versions of a t-shirt
* A Quick Add button allows customers to add the matching children's set to their cart instantly, making it easier to purchase both and increasing the overall AOV
* Each pajama set retains its own product description, sizing chart, and imagery, ensuring clear product details and avoiding confusion

<figure>
	<img src="https://cdn.sanity.io/images/kqgmf0g2/production/ba256f0f864d3111809f4a6648b5e700e867cee6-1600x1052.jpg?fit=clip">
  <figcaption>Another prototype for LAKE, to explore the Quick Add to Cart solution.</figcaption>
</figure>

### 3. Bundling Apps for Customizable Sets

When customers need to personalize their purchases beyond what Combined Listings can offer, bundling apps from the Shopify App Store provide the necessary flexibility while still creating a cohesive shopping experience. These specialized apps excel in scenarios where:

* Customers need to select products in different sizes for related items (like tops and bottoms)
* Merchants want to offer mix-and-match sets with special bundle pricing as an upsell
* There's a need to maintain accurate inventory tracking for each item

For example, HoneyLove sells women's underwear, providing a sophisticated shopping experience that allows customers to select different sizes for tops and bottoms without navigating between product pages, streamlining the path to checkout.

<figure>
	<img src="https://cdn.sanity.io/images/kqgmf0g2/production/c31fe6803eda7868b77853a1f1dd8d8a0f523ea2-3200x2104.jpg?fit=clip">
  <figcaption>Honeylove showcases an activewear bundle with coordinated separates, allowing customers to mix and match pieces.</figcaption>
</figure>


## Implementing the Right UX for Your Cross-Selling Needs

As we've seen, these approaches aren't mutually exclusive—they can be combined strategically based on your specific business goals and product relationships.

To help streamline the decision between different cross-selling experiences, we suggest looking at your product relationships through two key dimensions:

* **Variation Complexity:** How different are the products? This ranges from simple variations like color and size to entirely separate but complementary products.
* **Purchase Intention:** How likely are customers to want these items together? This can range from items that are almost always purchased together to those that are only occasionally complementary.

By understanding where your products fall on these dimensions, you can choose the right tools to create an intuitive shopping experience that aligns with your business goals.

When you take time to analyze how your products relate to one another, you create shopping experiences that improve customer experience and increase transaction value, boosting sales and setting your brand apart from competitors.


Related Products in Shopify: Picking The Right Tool for the Job

Nick Belzer

If you're coming from a traditional e-commerce platform like Solidus or Magento, working with Shopify can feel like a significant adjustment. Unlike these open platforms where you can modify virtually any aspect of the codebase, Shopify operates more like a black box. You can't simply rewrite core functionality or directly access the underlying systems.

But that doesn't mean customization is impossible. Shopify has evolved to provide specific extension points where developers can inject custom functionality. These carefully designed interfaces allow you to expand Shopify's capabilities while maintaining the platform's stability and security.

Let's take a look at each one of them!

## 1. Theme Blocks: Customizing the Storefront Experience

When you install apps on your Shopify store, they can expose theme blocks that render within your storefront. This allows you to add new functionality to your theme without directly editing theme files.

Theme blocks come in two main types:

### Section Blocks

These render inside existing theme sections. If a section supports app blocks, you can include blocks exposed by your installed apps. The app defines the liquid template that gets rendered, the data being used, and the settings available.

For example, a ratings app might display a star rating block that shows both the average rating and individual reviews.

### Embedded Blocks

These are smaller UI elements that aren't specific to a section but appear throughout your site. Examples include helper tags, accessibility features, or customer service elements.

This approach is especially valuable when you don't have control over the theme but need to introduce visual elements. At Nebulab, we've used this for our Sprout app, creating visual elements in merchants' themes by exposing theme logic through app blocks.

For more details on implementing theme blocks, check out [Shopify's Theme Blocks documentation](https://shopify.dev/docs/storefronts/themes/architecture/blocks/theme-blocks/quick-start).

## 2. Web Pixels: Tracking Solutions for Checkout

Shopify is transitioning to a new checkout experience that will be fully controlled by the platform. By August 2025, all stores will be required to use this new system, which has significant implications for tracking and analytics.

The primary impact? **You'll no longer be able to add custom JavaScript to checkout and order status pages.** This limits your ability to track events using client-side tracking.

To address this limitation, Shopify has introduced web pixels - isolated containers that exist around tracking pixels:

### App Pixels

These are included with apps you install on your Shopify store. Examples include Instagram or TikTok pixels. Once installed and connected to your ad accounts, they automatically subscribe to relevant events and send data to their respective platforms.

Some, like TikTok, employ a hybrid approach:
- Client-side tracking through the app pixel
- Server-side enrichment by using the app's API credentials to fetch additional order information

### Custom Pixels

If you need to send data to a platform that doesn't offer an official Shopify app, you can create custom pixels. These allow you to:
1. Subscribe to specific events (like checkout completion)
2. Import the tracking platform's pixel 
3. Use their API to send the data provided by Shopify

This approach creates a unified tracking system across your theme and checkout pages, despite Shopify's checkout limitations.

Learn more about implementing web pixels in our blog post: [Web Pixels on Steroids: How To Enrich Your Shopify Analytics](https://nebulab.com/blog/shopify-web-pixels).

## 3. Shopify Flow: Merchant-Controlled Automation

Shopify Flow enables merchants to create their own automation workflows through a user-friendly interface. While Shopify provides many built-in triggers, conditions, and actions, the real power comes from custom extensions.

As developers, we can extend Flow by creating:

1. **Custom Triggers**: Events that initiate workflows (e.g., "subscription created" or "subscription renewed")
2. **Custom Actions**: Operations that can be performed (e.g., "pause subscription")

By exposing these elements to Shopify Flow, we empower merchants to build their own business logic without developer intervention. 

For example, a merchant might create a workflow where when a subscription containing a specific product is created, an email notification is sent to their fulfillment team. This creates powerful automation possibilities without custom development for each use case.

For more insights, read our post on [Building Custom Shopify Automations](https://nebulab.com/blog/custom-shopify-automations).

## 4. UI Extensions: Customizing Key Experiences

As Shopify takes more control over critical customer touchpoints like checkout and account pages, they're providing UI extensions to maintain customization possibilities. These extensions let you inject custom UI elements at specific points:

### Checkout UI Extensions

With Shopify's new checkout experience, you can add custom elements like:
- Product information displays
- Upsell opportunities
- Delivery information
- Custom fields

At Cometeer, we use checkout extensions to display virtual product information, helping customers understand what's in their cart, and to offer relevant upsells.

### Account Portal Extensions

As Shopify's new customer account experience gains adoption, UI extensions let you integrate custom functionality. For subscription businesses, this might include subscription management interfaces directly within the customer account.

Like admin UI extensions, these must use Shopify's component libraries and follow their design patterns.

For a hands-on guide, check out our tutorial on [How To Build Your First Shopify POS UI Extension](https://nebulab.com/blog/building-shopify-pos-extensions).

## 5. Admin UI Extensions: Enhancing the Shopify Admin

Admin UI extensions allow you to render UI elements at specific points within the existing Shopify admin. Unlike embedded apps, these extensions integrate directly into admin pages like orders, products, or customers.

For example, we implemented an extension at Cometeer that displays coffee mapping details directly on the order page:

- When a customer orders a virtual product (like a coffee box)
- The extension shows which specific coffees were selected
- It displays the scoring logic used to select those coffees
- Operators can see this context without leaving the order view

Admin UI extensions must use Shopify's component libraries, ensuring they maintain the admin's look and feel. This creates a seamless experience where your custom functionality feels like a native part of Shopify.

Learn more about implementing these in our post: [Into the Light: Bringing Visibility to Your Shopify Customizations](https://nebulab.com/blog/custom-shopify-uis).

## 6. Embedded Apps: Creating Admin Interfaces

Embedded apps provide the most flexible way to extend Shopify's admin interface. When a merchant installs your app, it appears in their admin navigation. Clicking on it renders an iframe containing your custom interface.

This approach gives you complete control over the UI and functionality, allowing you to build complex interfaces for managing custom data and workflows. For instance, a subscription app might use an embedded app to display:

- All active subscriptions
- Detailed subscription information
- Management controls (pause, cancel, etc.)

While you have freedom in what you render, using Shopify's Polaris component library creates a native-feeling experience that integrates seamlessly with the rest of the admin.

Embedded apps support multiple pages and navigation, making them ideal for complex workflows that require dedicated interfaces.

For a detailed guide on building embedded apps, see [Shopify's Embedded App documentation](https://shopify.dev/docs/apps/auth/oauth/getting-started).

## 7. Shopify Functions: Injecting Custom Logic

Shopify Functions represent the closest thing to the traditional plugin architecture found in open platforms. They allow you to inject custom code directly into Shopify's processing flow at specific extension points.

These functions receive inputs from Shopify, process them according to your logic, and return outputs that influence Shopify's behavior. Current extension points include:

- **Discount Functions**: Create custom discount types beyond what's available in the admin
- **Location Rules**: Control which fulfillment locations are chosen during checkout
- **Validation Rules**: Define when orders can proceed through checkout

Functions come with constraints:
- Limited execution time
- Restricted code size and resource usage
- Must be deterministic
- Written in Rust or JavaScript
- Hosted on Shopify's infrastructure

Despite these limitations, Functions enable powerful customizations. For example, a loyalty program might use a custom discount function to provide member-specific discounts on certain product combinations - something not possible with standard Shopify discounts.

For more information, refer to [Shopify's Functions documentation](https://shopify.dev/docs/api/functions).

## Conclusion: Choosing the Right Extension Approach

When extending Shopify, selecting the right approach depends on what you're trying to accomplish:

- **For visual customizations**: Theme blocks let you inject UI components into the storefront without theme modifications.
- **For tracking and analytics**: Web pixels provide a standardized way to capture checkout events despite Shopify's checkout restrictions.
- **For merchant-controlled workflows**: Shopify Flow extensions empower merchants to create their own business logic.
- **For checkout and account customization**: UI extensions maintain customization as Shopify standardizes these experiences.
- **For enhancing standard admin pages**: Admin UI extensions integrate directly into existing workflows.
- **For complex admin interfaces**: Embedded apps give you complete control over custom management interfaces.
- **For custom business logic**: Shopify Functions let you modify platform behavior at specific points.

The extension landscape continues to evolve as Shopify balances merchant customization needs with platform stability. Staying current with these options ensures you can deliver the custom experiences clients need while working within Shopify's constraints.

Remember that sometimes combining approaches yields the best results. For instance, an embedded app might manage configuration while Shopify Functions implement the actual logic.

If you need expert guidance on your Shopify integration strategy, [reach out!](https://nebulab.com/services/shopify) At Nebulab, we specialize in building high-performing Shopify store for midmarket and enterprise brands, and we'd love to help you build the e-commerce experience you need to shine.

The Complete Guide to Customizing Your Shopify Store in 2025

Andrea Vassallo

Ryan Woods

The subscription economy has become one of the most significant business transformations of the 21st century, reshaping industries from media and e-commerce to software and mobility. With projections estimating its market valuation to reach $3 trillion by 2025([1](https://blulogix.com/blog/the-2025-blueprint-for-scalable-growth-in-the-subscription-economy/), [2](https://recurly.com/blog/subscriptions-weekly-25-01-07/)), this shift is fueled by technological advancements, changing consumer expectations, and businesses prioritizing predictable revenue models.

For e-commerce executives, few technology decisions carry more strategic weight than choosing between building a custom subscription engine or purchasing a third-party solution. This choice affects not only your technology stack but also your operational flexibility, customer experience, and long-term profitability. Many successful e-commerce brands have recognized that off-the-shelf Shopify subscription solutions don't always align with their unique business needs, leading them to explore more tailored approaches.

## Buy vs. Build: Evaluating the Trade-Offs

At its core, the decision between purchasing a third-party subscription management platform and building a custom solution is a trade-off between convenience and control. While third-party solutions like Recharge provide a fast and accessible way to implement subscriptions, businesses that scale beyond a certain threshold often find themselves constrained by these platforms. Let's explore both paths through key considerations.

### Speed and Ease of Implementation

Third-party platforms like Recharge offer a plug-and-play solution, allowing businesses to quickly launch a subscription model with minimal technical overhead. These platforms handle the complexities of recurring billing, customer portals, and integration with existing e-commerce operations. For early-stage subscription businesses, this is a huge advantage, as it enables rapid market entry without a heavy upfront investment in technology.

However, the convenience of ready-made solutions comes with trade-offs. Most third-party systems are built to serve a broad range of businesses, which means they may not fully align with the specific needs of a rapidly growing or highly differentiated subscription business. While these platforms accelerate the initial setup, they can introduce rigid framework constraints that limit customization options in the long run.

### Flexibility and Customization

As subscription volumes grow, many businesses find that third-party platforms that initially accelerated their growth become limiting factors. The universal design that makes these platforms broadly applicable also makes them difficult to customize for specific business needs.

For instance, standard subscription platforms typically treat each subscription as a separate contract, resulting in multiple shipments and shipping charges for customers with multiple subscriptions. Businesses with complex product offerings often need to create subscription bundles and personalized delivery schedules that aren't supported by off-the-shelf platforms. This lack of flexibility is one of the main reasons why high-growth businesses start considering custom solutions.

A custom-built subscription engine, on the other hand, provides complete control over the customer experience. Companies can build flexible delivery frequency options, pattern-matching algorithms for product recommendations, and seamless pause/resume functionality that enhance customer loyalty. These become strategic differentiators that would be difficult or impossible to achieve within the confines of a third-party system.

### Strategic Control and Business Sovereignty

When relying on a third-party subscription platform, your business is dependent on the vendor's development priorities and strategic decisions. If the platform discontinues features, raises prices, or pivots its business model, your subscription business must adapt accordingly. This lack of control can be a significant risk, especially when subscriptions are a core component of your revenue model.

Building a custom solution eliminates this dependency. Developing an in-house subscription engine represents an investment in business sovereignty. It allows companies to dictate their own product roadmap, prioritize features based on customer needs, and innovate freely without waiting for a platform provider to release updates.

### Cost Considerations: Short-Term vs. Long-Term Economics

For businesses just entering the subscription space, third-party platforms provide a cost-effective entry point. Monthly fees are predictable, and there is no need for a large upfront investment in software development. However, as subscription revenue scales, the economics shift dramatically.

At scale, monthly platform fees for third-party solutions can reach $20,000 or more, directly impacting profit margins. These per-transaction or revenue-percentage fee structures become increasingly painful when business volumes spike. For businesses with tens of thousands of subscribers, the fee structure can threaten to consume an unsustainable portion of subscription profits.

By contrast, while custom development requires significant upfront investment, the total cost of ownership (TCO) often favors bespoke solutions beyond a three-year horizon. For enterprises with over $50M in annual recurring revenue, custom builds typically achieve 22-35% TCO savings over a five-year period, assuming in-house DevOps capabilities.([3](https://www.ishir.com/blog/110513/build-vs-buy-software-analysis-which-is-right-for-your-business-in-2024.htm)). Most businesses determine that the crossover point where building becomes more economical than buying occurs approximately 48 months after launch, with increasing savings thereafter.

### Integration and Data Control

Third-party platforms often create data silos and integration challenges with existing business systems. This can limit the ability to build seamless connections with inventory management, customer service platforms, and marketing automation tools. Without deep integration, businesses must rely on workarounds or manual processes, which can introduce inefficiencies and errors.

A custom-built subscription engine allows for full integration with a company's existing tech stack. Growing brands need to maintain real-time connectivity with their customer experience stack—support platforms, SMS marketing tools, and email communication systems, among others. A custom implementation preserves these connections, ensuring seamless data flow and minimizing disruption for both employees and customers.

### Competitive Differentiation and Innovation

When subscription functionality is merely a transactional feature of your business, third-party platforms provide adequate solutions. However, when the subscription experience is a fundamental aspect of your brand differentiation, a custom-built solution can create a long-term competitive advantage.

For many direct-to-consumer brands, subscriptions aren't just a revenue model; they're central to the brand experience. By building a custom solution, companies can implement sophisticated algorithms that analyze customer preferences and purchase history to optimize renewal timing, suggest complementary products, and create truly individualized subscription experiences. These innovations help increase retention rates and customer lifetime value—outcomes that would be difficult to achieve with an off-the-shelf platform.

## Case Study: MeUndies' Subscription Transformation

MeUndies, a leading direct-to-consumer underwear brand, provides an illuminating example of successfully navigating the build vs. buy decision for subscription technology.

The company initially found that their custom subscription system was not well-aligned with off-the-shelf Shopify subscription solutions. As their subscriber base grew into the tens of thousands, the limitations of third-party platforms became increasingly apparent.

For MeUndies, several factors drove their decision to build a custom solution:

* **Unique product bundling needs**: They needed to create subscription bundles and personalized delivery schedules that weren't supported by standard platforms.

* **Brand differentiation through experience**: Subscriptions weren't just a revenue stream but central to their brand identity. Their custom solution implemented pattern-matching algorithms for product recommendations and flexible pause/resume functionality that significantly enhanced customer loyalty.

* **Integration requirements**: MeUndies needed seamless connectivity with their tech stack, including Kustomer for support, Attentive for SMS marketing, and Iterable for email communications.

* **Economic considerations**: The company determined that their build vs. buy crossover point would occur at approximately 48 months post-launch, after which their custom solution would provide increasing cost advantages.

The results validated their decision. MeUndies' custom subscription engine delivered flexible delivery frequency options and personalized experiences that increased retention rates and customer lifetime value—achievements that would have been challenging to implement using a third-party platform.

## Making the Transition: Key Considerations

If your business is approaching the tipping point where custom development makes sense, consider these critical factors:

* **Development Resource Planning** – Building in-house requires dedicated engineering teams with subscription commerce expertise. Alternatively, partnering with an experienced development agency like Nebulab can streamline production, mitigate risks, and prevent costly mistakes.

* **Migration Strategy** – Transitioning from a third-party platform to a custom solution requires careful planning. A phased migration approach—starting with small customer cohorts—helps validate functionality before a full transition.

* **Future-Proofing Architecture** – A custom solution should be designed with scalability in mind. Planning for future growth, maintenance, and integrations ensures that the platform remains cost-effective over time.

* **Data Strategy** – Subscription businesses thrive on data. A custom solution should prioritize data collection, accessibility, and actionability to drive strategic insights and operational efficiency.

## When to Build: Making the Right Investment for Your Business

Building a custom subscription engine delivers strategic advantages that off-the-shelf solutions simply cannot match. While it requires an initial investment, a tailored solution provides long-term benefits that go beyond cost savings, offering complete control over customer experience, operational workflows, and business innovation.

Before choosing the build route, assess your subscription volume, growth trajectory, and unique business requirements. Custom solutions deliver maximum ROI for businesses with >$50M ARR and specialized operational needs—particularly those where subscription experiences represent a core competitive differentiator.

Is your business hitting the ceiling with third-party platforms? Are transaction fees eating into your margins? Could subscription innovation drive competitive advantage in your market? If so, it's time to explore building your own subscription engine to secure your place in the rapidly growing subscription economy.

Partnering with an experienced team—such as Nebulab—can significantly reduce development costs by streamlining the process, mitigating risks, and preventing costly mistakes. A knowledgeable partner ensures that scalability, maintenance, and integrations are planned from the outset, minimizing total cost of ownership (TCO) over time. The result is a tailored, flexible solution that grows with your business rather than forcing you to conform to the limitations of a generic off-the-shelf platform.

Should You Build or Buy Your Shopify Subscriptions App?

When your e-commerce site needs updating, the instinct is often to go big—to completely redesign the site and transform every aspect of the user experience. But is that always the right choice? Whether you're addressing performance issues, implementing new features, or adapting to market changes, the scope of your website update deserves careful consideration. 

This brings us to a critical question: Should you opt for a complete website redesign, or would a strategic refresh better serve your goals? The answer isn't always as straightforward as it might seem, and it rarely depends on aesthetics alone. Let's explore how these two approaches differ and when each might be the right choice for your business.

## The Difference Between Redesign and Refresh

A **website redesign** represents a fundamental transformation of your digital presence. Think of it as rebuilding a house from the ground up—you're not just changing the appearance, but restructuring the entire infrastructure, electrical systems, and layout to meet completely new living requirements. In the e-commerce context, this means reconsidering every aspect of your digital architecture, from your technical stack to user flows and business logic.

This solution can be considered when a brand's goal is scaling and it needs complex features that its current platform can't support.

A **website refresh**, conversely, is like a strategic home renovation. You're keeping the solid foundation and basic structure while modernizing specific areas to enhance functionality and aesthetics. For e-commerce, this means targeted improvements to specific aspects of your site while maintaining your core digital infrastructure.

This fits better when an online store is experiencing challenges with conversion rates, for example. In this case, efforts are focused on navigation and checkout flow optimization.

## When to Consider a Complete Redesign

Before diving into real-world examples, it's crucial to understand that successful redesigns depend heavily on meticulous implementation planning. A redesign requires careful orchestration, starting with less critical features, conducting thorough A/B testing, and maintaining rollback capabilities throughout. Content migration must be comprehensive, with clear strategies for URL restructuring and template testing.

Most importantly, timing is everything: avoid peak seasons, build in adequate testing periods, and maintain parallel systems until the new website proves itself.

These implementation principles have guided several successful transformations:

- **Business Model Shifts**: Take [Caraway](https://www.carawayhome.com/)'s expansion from cookware to a full home goods brand. This wasn't just about adding new product categories—it required rethinking the entire shopping experience, from site navigation to bundling options and product education. The shift demanded a more flexible e-commerce experience, ensuring that customers could seamlessly explore and purchase across multiple home categories. This called for a complete digital transformation to support their growth.
- **Technical Limitations**: MeUndies' [migration](https://nebulab.com/case-studies/meundies) from a custom platform to Shopify Plus exemplifies this scenario perfectly. Their existing infrastructure couldn't scale with their growth, necessitating a complete platform change.
- **Market Repositioning**: [Ritual](https://ritual.com/shop/multivitamins)'s evolution from a women's vitamin brand to a comprehensive wellness platform required a comprehensive redesign. Their platform needed to support multiple product lines across age groups and genders, integrate educational content, and provide personalized supplement recommendations—transforming their site from a single-product store into an evidence-based wellness destination that builds trust through transparency.

<figure>
	<img src="https://cdn.sanity.io/images/kqgmf0g2/production/9d2043572c625dd8b1bd225915ffacdb77894d2b-1600x1052.jpg?fit=clip">
  <figcaption>MeUndies' recent replatform supported its growth while uncovering new opportunities to enhance the user experience.</figcaption>
</figure>

## When a Strategic Refresh Makes More Sense

A successful refresh hinges on precise, measured implementation. The key is prioritizing changes based on impact versus effort—focusing on high-traffic pages and addressing known pain points first. Updates should be modular, allowing for independent testing and controlled rollouts through feature flags.

Throughout the process, analytics should guide every decision, with clear metrics tracking each change's impact against the baseline. Brand consistency remains paramount, with new elements seamlessly integrating across all devices.

Here are a couple of relevant examples:

- **[LAKE](https://lakepajamas.com)**'s approach to accessibility improvements perfectly illustrates these principles. Faced with compliance requirements, they turned a potential challenge into an optimization opportunity. Their focused refresh improved mobile usability and conversion rates without disrupting their core experience.
- **[Lilac St](https://lilacst.com/)**'s refresh follows the same measured approach. Rather than overhauling their entire experience, it introduced strategic updates like the gamification program that [increased its subscription revenue by 72.7%](https://www.magnetmonster.com/blog/10-dtc-brands-growing-subscriber-revenue-with-loop-gamification). The company incentivized bulk purchases with discounts, encouraging higher spending per transaction.

<figure>
	  <img src="https://cdn.sanity.io/images/kqgmf0g2/production/7db895b078be1b2e0d65a3f4159bdf281d083af9-1600x1052.jpg?fit=clip">
  <figcaption>Lilac St.'s engaging interface allows users to create custom bundles while encouraging them to increase quantity for greater savings.</figcaption>
</figure>

## Making the Decision: A Practical Framework

Every e-commerce platform has its own mix of technical debt, business goals, and customer expectations. While there's no one-size-fits-all solution—budgets and timelines often dictate decisions—we can use a structured framework to navigate this critical choice.

### Step 1: Identify Objectives and Pain Points

Start by defining what you want to achieve with your website and ask these key questions:

* Are you aiming to enhance user experience?
* Does your brand image feel outdated?
* Is mobile responsiveness an issue?
* Are conversion rates lower than expected?

Leverage user feedback and analytics to identify underperforming areas. Your audience's needs should drive your decision—if the current site no longer aligns with their behavior and expectations, a redesign may be necessary.

### Step 2: Analyze Current Performance

Conduct a thorough audit of your website, focusing on:

* **User Experience (UX):** Navigation, checkout process, and friction points
* **Mobile Responsiveness:** How well does the site function across devices?
* **Content Effectiveness:** Identify high-performing pages vs. drop-off points

At Nebulab, we know how crucial design audits are in this process—we conduct them regularly as part of our services. If you're looking for expert insights into your site's performance, [we'd be happy to help!](https://nebulab.com/contact-us)

If only specific elements need improvement, a refresh might be enough. If multiple areas underperform, consider a redesign approach.

### Step 3: Test and Implement Changes

Finally, whatever path you take, adopt a structured implementation approach:

* If opting for a redesign, outline the project scope, budget, and timeline. Prioritize changes that impact user experience and business outcomes.
* If choosing a refresh, focus on quick wins like visual updates and small UX improvements.
* Run A/B tests before implementing major changes to minimize risks and ensure that decisions are based on user behavior, not assumptions.

By following a standardized process, you can confidently decide whether a refresh or full redesign is the best path for your e-commerce site.

<figure>
  <img src="https://cdn.sanity.io/images/kqgmf0g2/production/91bfb81b07113b772fa1f02cd5745be38aa34beb-1600x1052.jpg?fit=clip">
  <figcaption>These cards contrast when choosing a refresh vs. redesign. Timelines are indicative and may vary based on project scope.</figcaption>
</figure>

## Execution Is Key

Whether you choose a redesign or a refresh, success lies in thoughtful execution. For redesigns, phased rollouts, rigorous testing, and smooth transitions are key. For a refresh, focus on quick wins like visual updates and small UX improvements while maintaining clear measurement protocols.

Ultimately, your decision should be guided by business objectives and data, ensuring that changes improve both the customer experience and performance. A successful transformation isn't just about making your site look different—it's about making it work better.

If you're unsure wheher your site needs a redesign or refresh, [feel free to reach out!](https://nebulab.com/contact-us) We'd be happy to hlep you navigate this decision and follow through!

Website Redesign vs Refresh: A Guide for E-commerce Brands

Alessandro Desantis

The battle for e-commerce growth has never been more challenging. As brands navigate an increasingly complex digital landscape, they're caught in a perfect storm of rising costs and shifting consumer behaviors that's fundamentally reshaping the economics of e-commerce.

The data paints a clear picture: [marketplaces](https://www.modernretail.co/technology/modern-retail-research-as-dtc-dominates-marketplaces-edge-out-retailer-channels-for-brand-investment/) now command 67% of global e-commerce sales volume, while DTC engagement continues to decline. [Recent data shows](https://www.retaildive.com/press-release/20241015-73-of-consumers-are-moving-their-shopping-more-online-in-2024-1worldsync/) only 15% of consumers reported browsing DTC sites more frequently in 2024, with 21% actually reducing their usage. This isn't a temporary trend—it reflects a fundamental shift in how consumers approach online shopping.

Two critical factors are driving this transformation. First, customer acquisition costs have risen dramatically, driven by increased competition and evolving privacy regulations. Second, consumer spending patterns have fundamentally changed—[data shows](https://www.mckinsey.com/industries/consumer-packaged-goods/our-insights/the-state-of-the-us-consumer) 76% of consumers actively traded down across categories in Q3 2024, with this behavior even more pronounced among younger generations, where 86% of Gen Z and millennials report making such adjustments.

The economic context makes this particularly challenging. [Research indicates](https://www.mckinsey.com/industries/consumer-packaged-goods/our-insights/the-value-now-consumer-making-sense-of-us-consumer-sentiment-and-spending) 53% of consumers remain pessimistic about the economy, creating a "value now" mindset where every purchase must thoroughly justify its cost. Looking ahead, [projections suggest](https://www2.deloitte.com/us/en/insights/economy/consumer-pulse/state-of-the-us-consumer.html) 61% of consumers plan to maintain or reduce their overall spending levels in 2025.

## Navigating the New DTC Economics

This environment has created a strategic dilemma for DTC brands.

The traditional growth playbook—centered around aggressive customer acquisition and premium pricing—is becoming increasingly unsustainable. While many brands are responding by shifting focus to marketplaces for easier scale and broader reach, this approach creates its own challenges: marketplaces inherently promote price-based competition, creating a race to the bottom that erodes brand value and profit margins. This is a trend we also explored in our recent article, [Redefining the Digital Value Chain for Multi-Brand Retail](https://nebulab.com/blog/multi-brand-retail-strategy).

However, our experience working with mid-market and enterprise brands suggests there's an underutilized lever that could help companies break free from this conundrum: customer experience (CX). When leveraged correctly, we've observed that customer experience can be transformed into a powerful engine for sustainable growth.

In this series of articles, we'll explore how brands can elevate customer experience from a basic operational requirement to a strategic differentiator that drives both top-line growth and bottom-line profitability.

## Promoting Customer Experience from Cost Center to Value Driver

For too long, brands have viewed customer experience primarily as a cost center–a necessary investment to meet basic competitive standards. This perspective, while common, overlooks the tremendous potential of CX as a strategic growth driver. The evidence for this missed opportunity is compelling, both in terms of rising consumer expectations and documented business impact.

Today's consumers have radically higher expectations for their digital shopping experiences. [Studies show](https://lucidworks.com/post/50-customer-experience-trends-2025/) 80% of customers now consider the digital experience to be just as important as the product itself, marking a fundamental shift in how value is perceived in e-commerce. These expectations manifest across multiple dimensions:

- **Personalization has become non-negotiable**: [Research indicates](https://www.salesfire.co.uk/articles/ecommerce-customer-experience/) 60% of consumers become repeat buyers when offered tailored experiences, while 42% express frustration with generic content. Despite this clear preference, [only 14%](https://www.bloomreach.com/en/blog/ecommerce-customer-experience) of consumers report fully personalized online experiences, highlighting a significant opportunity gap.
- **The cost of poor experiences has skyrocketed**: [Analysis reveals](https://www.bloomreach.com/en/blog/ecommerce-customer-experience) 80% of shoppers abandon purchases due to poor navigation, slow load times, or unclear product information. Even more concerning, [41% of customers](https://www.agilitypr.com/pr-news/public-relations/the-state-of-consumer-attitudes-on-ecommerce-fraud-and-cx-in-2023/) permanently abandon brands after a single false decline.
- **Speed and convenience set new benchmarks**: [Data shows](https://www.sekologistics.com/en/resource-hub/knowledge-hub/the-evolution-of-customer-expectations-in-ecommerce-and-how-to-meet-them/) 65% of consumers abandon their carts if delivery takes more than a week, demonstrating how operational excellence has become inextricably linked with customer experience.

The democratization of e-commerce technology, led by platforms like Shopify, has created an interesting paradox. While these platforms have made it easier for brands to deliver competent customer experiences, they've also led to a form of complacency. Many brands settle for the default experience provided by their platform, viewing it as "good enough" rather than a potential source of competitive advantage.

This is quite unfortunate, because recent research from McKinsey provides compelling evidence that savvy brands can transform customer experience from a cost center into a powerful growth engine. The numbers are striking:

- [Research shows](https://www.mckinsey.com/capabilities/growth-marketing-and-sales/our-insights/experience-led-growth-a-new-way-to-create-value) compensating for one lost customer requires acquiring three new customers, highlighting the multiplicative effect of customer experience on acquisition costs.
- Companies that excel at customer experience achieved more than double the revenue growth of "CX laggards" between 2016-2021.
- [Data indicates](https://www.mckinsey.com/capabilities/growth-marketing-and-sales/our-insights/experience-led-growth-a-new-way-to-create-value) companies that get growth right deliver 30% higher total return to shareholders and nearly double the shareholder value compared to industry peers.

Hopefully, the business case for treating customer experience as a value driver is clear and compelling. Yet many brands struggle to translate this opportunity into actionable strategies that deliver measurable results.

## Deploying CX Strategically through Experience-Led Commerce

Based on our work with mid-market and enterprise brands at Nebulab, and inspired by McKinsey's research on Experience-Led Growth (XLG), we've been experimenting with an innovative approach we call "Experience-Led Commerce" (XLC). This framework treats customer experience not as a standalone function but as a systematic process for driving growth and profitability.

XLC differs from traditional growth strategies in several key ways:

1. It amplifies traditional marketing-led growth strategies, helping brands maximize their marketing ROI by increasing customer lifetime value and reducing acquisition costs.
2. It decouples value creation from product and pricing alone, providing a path to differentiation that allows brands to create incremental profit.
3. It creates a virtuous cycle where improved experiences lead to higher customer retention, which in turn fosters organic customer acquisition and reduces the pressure created by acquisition.

McKinsey's research on companies that successfully implement experience-led approaches demonstrates the potential impact of this strategy. [Their findings](https://www.mckinsey.com/capabilities/growth-marketing-and-sales/our-insights/experience-led-growth-a-new-way-to-create-value) show that such companies can achieve remarkable results:

- 15-25% increase in cross-sell rates
- 5-10% boost in customer wallet share
- 20-30% improvement in satisfaction and engagement

For those willing to make the investment, the rewards can be transformative: all else being equal, brands with superior CX outperform their peers across all key performance indicators, creating a compelling case for treating customer experience not as a cost to be minimized but as a strategic business investment.

## Going From Idea to Action

While the case for investing in customer experience is clear, many brands find themselves overwhelmed by the sheer number of opportunities for improvement. From personalization to omnichannel integration, from self-service capabilities to loyalty programs, the possibilities can seem endless. Without a systematic approach to evaluating and prioritizing these opportunities, brands risk pursuing initiatives that deliver suboptimal returns or dilute their core value proposition.

Experience-Led Commerce solves precisely that problem: it helps brands cut through this complexity by providing a structured framework for identifying, evaluating, and executing customer experience initiatives that drive measurable business results.

In our next article, we'll take a deep dive into the XLC framework, exploring its key components and showing you how to put it into practice in your organization.

Turning Customer Experience Into Your Next E-Commerce Growth Engine

Alberto Vena

Last week, Shopify released their [Winter '25 Edition](https://www.shopify.com/editions/winter2025), aptly named “The Boring Edition.” Despite containing over 150 updates, the Winter '25 Edition contains very few new features, but rather a broad sweep of improvements touching everything from checkout to developer tools.

And honestly, we couldn't be happier about it.

While Shopify’s pace of innovation has delivered powerful new capabilities like Markets, Customer Accounts, and POS over the past few years, it has also created complexity within their ecosystem. Each new feature brings its own set of integration challenges and edge cases.

For merchants operating at scale, these seemingly minor compatibility issues can cascade into significant operational hurdles. Even when individual challenges have workarounds, the cumulative effect of managing multiple partial solutions creates friction in day-to-day operations.

By following up the Summer '24 Edition (“Unified”) with one that’s even more focused on stability, Shopify demonstrates a clear commitment to addressing these foundational challenges. This approach is particularly crucial as they continue expanding their enterprise presence, where system reliability and seamless integration are non-negotiable requirements.

Let’s explore how these improvements work together to create a more robust platform for enterprise commerce.

## Product Management and Discovery: Enhanced Control and Visibility

At the heart of any e-commerce operation is the product catalog, and this release brings several improvements to how merchants can manage and present different types of products.

Key updates include:

* Combined Listings now allows merchants to [choose if parent or child products should appear in search and product recommendations](https://www.shopify.com/editions/winter2025#configure-combined-listings-for-search), providing better control over catalog presentation.
* Bundles have been significantly improved with [new analytics](https://www.shopify.com/editions/winter2025#reporting-for-bundles), [more consistent presentation](https://www.shopify.com/editions/winter2025#a-clearer-view-of-bundles) across admin and customer touchpoints, and [accurate inventory status](https://www.shopify.com/editions/winter2025#accurate-bundle-inventory) when using fulfillable inventory.
* Subscription management has also been enhanced with [oversell protection](https://www.shopify.com/editions/winter2025#oversell-protection-for-subscription-renewals), ensuring renewals respect inventory settings and preventing out-of-stock issues.

All of these improvements aim at consolidating and improving interoperability between different features of the platform, making life easier for larger and more sophisticated merchants. We have run across several of these limitations in our own work in the past, so we’re glad to see them being addressed head-on.

## Checkout and Payments: More Flexibility and Customization

Building on the enhanced product management capabilities, Shopify has also made significant strides in making the checkout process more flexible and customizable.

Notable updates include:

* [Split shipping](https://www.shopify.com/editions/winter2025#split-shipping-now-available) is now available to all merchants, allowing customers to choose different shipping methods for different parts of their order when items will be fulfilled separately. This is critical for marketplaces, where the same order may be fulfilled by multiple vendors.
* [Checkout Blocks is now available on the thank you and order status page](https://www.shopify.com/editions/winter2025), and [chat apps can now hook into the checkout flow.] This unlocks completely new capabilities and customer touchpoints, and we can't wait to take the new customization APIs for a spin!

Checkout is an area where Shopify has historically been very restrictive. However, they have been opening up more and more customization APIs over the last couple of years, allowing merchants to build their own customizations without relying on ugly workarounds. We expect this trend to continue, enabling new use cases and further reducing the effort of checkout customizations for Shopify merchants across the board.

## Global Commerce and Compliance: Expanded International Capabilities

As merchants continue to expand globally, Shopify has introduced several features that make international selling more manageable and compliant.

This release brings significant improvements for merchants operating internationally:

* Semantic Search [is now available in more languages](https://www.shopify.com/editions/winter2025#natural-search-in-more-languages), allowing customers worldwide to search using natural, everyday language. While Shopify's native solution cannot compete with more robust paid offerings, it's an excellent starting point for brands looking to elevate their search experience—and now, it's available to even more merchants!
* Shopify Tax [has expanded to the EU and UK](https://www.shopify.com/editions/winter2025#shopify-tax-in-the-eu-uk), offering automated VAT compliance including automated calculation and [VAT invoice generation.](https://www.shopify.com/editions/winter2025#vat-invoices-with-shopify-tax) 
* [Customer account extensions](https://www.shopify.com/editions/winter2025#customer-account-extensions) have finally entered general availability, allowing merchants to customize the New Customer Accounts UI with proprietary and third-party apps. We’ve been using these in beta for a while now (e.g., see Nick's [excellent blog post on POS extensions](https://nebulab.com/blog/building-shopify-pos-extensions)), so we’re pretty excited about this!

On the compliance front, we would have loved to see a hint at more robust compliance primitives for international merchants and regulated industries (e.g., alcohol). However, this doesn't seem to be an area that Shopify is interested in exploring at the moment, which means these merchants will still need to rely on custom-built or third-party solutions.

## Order Management: Better Control Over Complex Fulfillment

The enhancements to global commerce capabilities are matched by improvements to order management, particularly for complex fulfillment scenarios.

Significant improvements include:

* The ability to [use custom metafields to inform order routing rules](https://www.shopify.com/editions/winter2025#metafields-for-order-routing), allowing merchants to create more sophisticated fulfillment logic based on their specific business needs.
* Several improvements to Shopify Flow, the platform's built-in automation platform. Flow now [supports all Admin API actions](https://www.shopify.com/editions/winter2025#automate-more-tasks-in-flow), [can be triggered by metaobjects](https://www.shopify.com/editions/winter2025#metaobject-triggers-in-flow), and [can automate returns](https://www.shopify.com/editions/winter2025#return-automation-in-flow).
* Product catalogs [can be synced via custom IDs](https://www.shopify.com/editions/winter2025#sync-catalogs-with-custom-ids), which makes it easier for brands to integrate with in-house or third-party ERPs/PIMs. Shopify has also introduced a new [Upsert API](https://changelog.shopify.com/posts/better-data-syncing-with-custom-ids-and-upserts) to reduce the number of API calls needed for data sync.

Granted—these are all quality-of-life improvements, especially since most of this logic was already achievable via other approaches. Still, they will help a lot of brands and agencies to simplify their customizations, allowing them to redirect their efforts to initiatives that actually move the needle!

## Organizations and RBAC for More Robust Multi-Store Setups

As operations scale and become more complex, team management becomes increasingly critical. Shopify has responded with several improvements to their billing, authentication and authorization systems.

Key changes in this area include:

* The ability to [group all your stores into a single organization](https://www.shopify.com/editions/winter2025#organizations-for-all-plans) with consolidated billing and user management, a feature previously reserved for Plus merchants.
* A new [role-based access control system](https://www.shopify.com/editions/winter2025#staff-access-by-role) that lets you define granular permissions and assign multiple roles to staff members. This was announced in the Summer '24 Edition and is now entering general availability.
* Improved support for [custom authentication flows in the admin](https://www.shopify.com/editions/winter2025#standardized-reauthentication), allowing organizations to roll their own authentication provider rather than leveraging Shopify.

These organizational improvements reflect Shopify's growing focus on enterprise-level merchants who manage multiple stores and complex team structures. By democratizing features previously limited to Plus merchants and providing more granular control over permissions, Shopify is building a foundation that can better support sophisticated organizational hierarchies and security requirements. This is particularly valuable for brands operating across multiple markets or running several distinct storefronts.

## Developer Tools to Support More Complex Implementations

When it comes to developer tooling, Shopify has been hard at work to make custom storefronts and custom apps more powerful and more customizable.

Significant changes include:

* A lot of limits being raised: function executions now [support carts with up to 200 line items](https://www.shopify.com/editions/winter2025#dynamic-scaling-for-execution-limits) (useful for B2B) and [payloads of up to 128 KB](https://www.shopify.com/editions/winter2025#increased-function-input-limit). Plus, brands can now have [up to 25 app-based automatic discounts](https://www.shopify.com/editions/winter2025#functions-work-with-25-automatic-discounts).
* A number of improvements to Hydrogen, including [support for gift cards](https://www.shopify.com/editions/winter2025#hydrogen-supports-gift-cards), a [Sitemaps API](https://www.shopify.com/editions/winter2025#sitemaps-api-for-hydrogen), and a [richer GraphQL API](https://www.shopify.com/editions/winter2025#more-content-in-graphql-apis) with support for menus, pages, articles, and blogs.
* [Self-serve return endpoints](https://www.shopify.com/editions/winter2025#self-serve-return-api) as part of the Customer Accounts API, allowing brands and apps to easily build self-serve return experiences.

These developer-focused enhancements demonstrate Shopify's commitment to supporting more sophisticated implementations while reducing technical limitations that previously constrained larger operations. The increased limits and expanded APIs give developers more flexibility to build complex, custom solutions that enterprise merchants often require, making the platform increasingly viable for technically demanding enterprise implementations.

## B Is For Boring, B Is For Better

For enterprise and upper mid-market merchants, all of these improvements mean fewer workarounds, better operational efficiency, and a more reliable platform for complex implementations. This release shows that Shopify understands the needs of larger merchants and is willing to do the “boring” work necessary to support them effectively across all aspects of the platform.

As always, we recommend reviewing the full [Editions changelog](https://www.shopify.com/editions/winter2025) to understand all the changes that might impact your business.

If you need help implementing any of these new features or would like to discuss how they could benefit your operation, don’t hesitate to [reach out](https://nebulab.com/contact-us) to our team for a consultation!

Shopify Winter ’25 Edition: Not So Boring After All

In our work with e-commerce brands, we frequently encounter a common challenge: how do you build trust in systems that operate invisibly? While custom algorithms and automation solutions may be working flawlessly behind the scenes, both business teams and customer service representatives often struggle to confidently explain these processes to stakeholders and customers.

This scenario plays out repeatedly across e-commerce operations. While custom solutions deliver tremendous value, their invisible nature creates four critical challenges:

* Reduced trust in automated systems
* Limited opportunities for cross-team collaboration
* Increased support resolution times
* More difficult iterative improvements

The good news? We've developed several approaches to solve these visibility challenges, each suited to different business needs and constraints.

Let's explore each approach, starting with the quickest to implement and moving toward more comprehensive solutions. We'll share real implementation experiences and help you understand which solution might work best for your specific situation.

## 1. Tags

The simplest place to start is with Shopify's built-in tagging system. These lightweight markers can provide immediate visibility into system states and trigger automated processes. The beauty of tags lies in their simplicity – they're provided out of the box on Shopify and integrate seamlessly with existing workflows.

At Tannico, one of Italy's leading wine retailers, we use tags to control their product synchronization with their enterprise resource planning system. When products need to be synced, the operations team can simply add a specific tag, and our middleware picks up these tagged products for processing. This gives the team direct control over the sync process without needing to understand the underlying technical complexities.

## 2. Metafields

As your needs grow more sophisticated, metafields offer structured data storage capabilities that go beyond simple flags.

Again looking at our work with Tannico, we use metafields to store and control parameters for their third-party pricing engine. This allows the team to fine-tune pricing rules and see their effects directly within Shopify, making complex pricing management feel like a native part of their workflow.

While metafields require more planning and development effort than tags, they provide much richer data visibility without adding significant complexity to operations. They're particularly valuable when you need to store detailed configuration data or track complex states that can't be captured with simple tags.

## 3. Admin UI Extensions

When simple flags and data storage aren't enough, Admin UI Extensions offer a more sophisticated approach. These extensions allow you to create custom interfaces directly within the Shopify Admin, making complex operations more intuitive and accessible to your team.

[Our work with Cometeer](https://nebulab.com/case-studies/cometeer) serves as a perfect example of this approach. Their algorithm was making sophisticated decisions about which coffees to include in each box, considering factors like customer preferences, previous orders, and inventory availability. However, without visibility into this process, it was difficult for teams to understand and trust these selections.

![](https://cdn.sanity.io/images/kqgmf0g2/production/a6b7f0a08d0748f778e20893e2dbb0a5373d226f-1386x1050.png?fit=clip)

We transformed this "black box" system into a transparent one through a comprehensive Admin UI extension that visualizes the entire decision-making process. The results were remarkable: customer service representatives could now explain algorithm selection decisions, the time required for algorithm adjustments dropped as developers could now see exactly how their changes affected the selection process and, perhaps most importantly, non-technical team members began contributing valuable suggestions for improvements.

While this approach requires more initial investment in development time and resources than tags or metafields, it offers the most flexibility for complex interactions and rich data presentation.

## 4. Third-Party Platforms

As systems grow more complex, teams often need more sophisticated ways to interact with custom logic. While the previous solutions work well within Shopify's Admin interface, sometimes the best approach is to meet your teams where they already work by integrating with their daily platforms.

Many customer service and operations platforms like Zendesk and [Kustomer](https://developer.kustomer.com/kustomer-apps-platform/docs/widgets) provide robust API integration capabilities. This means you can surface key data from your custom Shopify solutions directly within these platforms and, more importantly, enable actions to be taken from there.

![](https://cdn.sanity.io/images/kqgmf0g2/production/15f920216eff929c332ecf67a9c340c42f28cd27-956x1168.png?fit=clip)

At [MeUndies](https://nebulab.com/case-studies/meundies), we integrated their custom subscription logic directly with their customer service platform. This meant that when handling customer inquiries, support teams could see relevant subscription data (like upcoming shipment dates and product preferences) and perform actions like skipping deliveries or updating preferences—all without leaving their familiar support interface. The integration eliminated constant switching between tools and made customer interactions more efficient.

The complexity of this approach varies based on the platform you're integrating with. Data exposure typically involves formatting and forwarding information through authenticated API requests. Enabling actions requires more setup as you'll need to create secure endpoints in your middleware to handle authenticated requests from the third-party platform. While this requires careful planning and ongoing maintenance, it can significantly streamline workflows for teams that spend most of their day in these platforms.

## 5. Custom Frontends

While the previous approaches cover most use cases we encounter, there are times when you need complete control over the user experience. In these situations, creating a custom frontend offers the ultimate in flexibility. Shopify provides robust support for embedding custom applications directly into the Admin Panel through their embedded app framework, with dedicated libraries for both Remix and Rails to handle the complexities of setup and authentication.

This approach gives you complete control over the user interface and functionality, allowing you to create exactly the experience your team needs. While we haven't found this level of customization necessary for most clients at Nebulab – the other solutions typically provide sufficient flexibility – it's worth considering for unique use cases that require specialized interfaces or workflows.

![](https://cdn.sanity.io/images/kqgmf0g2/production/53bfe0a056a980d2d3bc89539ca562d0f4993be7-2880x1620.png?fit=clip)

Development platforms like [Retool](https://retool.com), [Replit](https://replit.com) and [Gadget](https://nebulab.com/blog/building-shopify-apps-with-gadget) can significantly accelerate this process. Retool's drag-and-drop interface builder and pre-built components can reduce frontend development time by 50-70%, while Replit's collaborative development environment streamlines the iteration process. These platforms handle much of the foundational setup work, letting your team focus on building the unique features your business needs.

The trade-off here is still higher development effort and maintenance complexity compared to other solutions we've discussed, even with these acceleration tools. However, for organizations with highly specific needs or unique operational requirements, the investment can pay off through perfectly tailored workflows and improved team efficiency.

## Choosing Your Path

The best visibility solution for your organization depends on your specific needs and constraints. Here's a quick decision guide:

* **Tags**: Best for simple status tracking and quick wins with minimal investment
* **Metafields**: Ideal for structured data storage and analysis platform integration
* **Admin UI Extensions**: Perfect for complex interactions and rich visualizations
* **Third-Party Integration**: Choose when teams primarily work in other platforms
* **Custom Frontends**: Best for highly specialized needs requiring complete control

**Our experience has taught us that successful implementations start small and scale up based on actual usage patterns.** Begin by identifying which processes are currently invisible and causing pain points for your teams. Then start with simple solutions that address these immediate needs, gather feedback from users, and iterate based on real-world usage. Document everything thoroughly and train your teams effectively – visibility tools are only valuable if people know how to use them.

**You'll know your implementation is successful when you see**:

* Customer service resolution times decreasing
* Internal teams expressing greater confidence in automated systems
* Cross-team collaboration increasing
* System maintenance time and error rates improving

**These metrics consistently improve with better visibility into custom solutions.**

Ready to explore how these visibility solutions might work for your specific needs? [Contact our team](https://nebulab.com/contact-us) for a consultation. We'd love to help you bring your custom solutions into the light.

Into the Light: Bringing Visibility to Your Shopify Customizations

Davide Di Stefano

The European Accessibility Act (EAA), set to take effect on **June 28, 2025**, will establish new standards for digital accessibility, transforming the lives of **over 87 million people with disabilities across the European Union**. This landmark legislation does more than enforce compliance—it challenges businesses to rethink their digital experiences and embrace inclusivity as a core priority.

For e-commerce brands operating locally or globally within the EU, this means re-evaluating your website to meet accessibility requirements. But accessibility isn’t just about legal compliance—it’s an opportunity to expand your audience, improve usability, and demonstrate your brand’s commitment to creating universally accessible online experiences.

The time to act is now. In this article, we’ll explore the significance of the EAA, what it means for your business, and actionable strategies to help you integrate accessibility into your e-commerce strategy.

## What Is the European Accessibility Act?

The European Accessibility Act (EAA), grounded in the principles of the [UN Convention on the Rights of Persons with Disabilities](https://employment-social-affairs.ec.europa.eu/policies-and-activities/social-protection-social-inclusion/persons-disabilities/united-nations-convention-rights-persons-disabilities_en), seeks to make products and services more accessible to individuals with disabilities, older adults, and people with temporary impairments. Its ultimate goal is to foster a fair and inclusive society where everyone can access the opportunities and resources modern life offers.

The EAA applies to various industries, including e-commerce, and mandates compliance with accessibility standards by 2025. Failure to meet these standards could result in significant legal and financial repercussions, with specific penalties determined by each EU member state.

However, certain exemptions exist:

* **Microenterprises** (companies with fewer than 10 employees and an annual turnover of under 2 million euros) are exempt from mandatory compliance but are encouraged to prioritize accessibility.
* **Member states** may also introduce limited exceptions tailored to specific contexts.

Businesses that are not exempt must prioritize compliance to mitigate financial risks and safeguard their reputation in the European market. Let’s explore the key requirements they need to follow.

## What Are the Requirements Requested by the EAA?

The EAA does not mandate specific technical standards, providing businesses with flexibility and room for innovation. However, the [Web Content Accessibility Guidelines](https://www.w3.org/TR/WCAG21/) (WCAG) 2.1 are often referenced as the de facto framework for achieving compliance.

WCAG 2.1 is an internationally recognized set of standards developed by the World Wide Web Consortium (W3C) to ensure that web content is accessible to individuals with disabilities, including those with visual, auditory, physical, cognitive, or neurological impairments. These guidelines, also referenced in other major accessibility legislation like the **Americans with Disabilities Act** (ADA), offer a robust foundation for creating accessible digital experiences.

The guidelines are built around four core principles, ensuring that web content is:

* **Perceivable**: Information and user interface components must be presented in ways that users can perceive (e.g., providing text alternatives for images).
* **Operable**: Navigation and user interface elements must be operable (e.g., all functionalities must work via keyboard input).
* **Understandable**: Content and operation must be clear and intuitive (e.g., avoiding overly complex language and ensuring consistent navigation).
* **Robust**: Content must be compatible with assistive technologies, such as screen readers.

![](https://cdn.sanity.io/images/kqgmf0g2/production/a4856ec01e1d0310914fd4a5865a54c6a64f975e-2120x1324.png?fit=clip)

WCAG 2.1 defines accessibility through three levels of compliance:

* **Level A (Minimum)**: Covers the most basic web accessibility features and barriers.
* **Level AA (Recommended)**: Addresses a broader range of accessibility issues, making it the standard most commonly adopted by organizations.
* **Level AAA (Highest)**: The most stringent level, though not all content can realistically achieve this due to its complexity.

While the EAA does not explicitly mandate WCAG 2.1, its principles align closely with the framework, making WCAG 2.1 an essential reference for compliance. Businesses operating within the EU are encouraged to adopt **Level AA compliance** as a baseline to meet the EAA’s requirements by June 28, 2025. 

However, accessibility extends beyond mere compliance—it’s a strategic investment with tangible business benefits. By prioritizing accessibility, you not only fulfill legal obligations but also unlock opportunities for growth, customer satisfaction, and long-term economic advantages.


## What Are the Economic Benefits of Accessibility?

### Expanded Market Reach

Accessible websites and services open your business to a broader audience, including the over 87 million people with disabilities in the European Union alone. But the benefits extend beyond this demographic:

* **Aging Population**: As populations age, more users experience visual, auditory, or mobility-related challenges. Accessible design ensures these customers can engage with your e-commerce platform.
* **Temporary or Situational Impairments**: Accessibility considerations benefit people with temporary disabilities (e.g., a broken arm) or situational limitations (e.g., poor lighting or loud environments).
* **Global Audience:** Accessibility features like clear navigation, alt text, and keyboard usability often enhance cross-cultural usability, making it easier for non-native speakers and global audiences to interact with your brand.

By removing barriers, your brand becomes more inclusive, expanding its customer base and increasing revenue potential.

### Improved User Experience

Accessibility often aligns with usability best practices, benefiting all users, not just those with disabilities. For example:

* **Simplified Navigation**: Clear layouts, logical flow, and intuitive interfaces make it easier for users to find products and complete purchases.
* **Faster Checkout Process**: Accessible forms with clear labels and instructions reduce frustration and cart abandonment rates.
* **Mobile Optimization**: Many accessibility improvements, such as touch-friendly buttons and adaptable layouts, enhance the mobile shopping experience—a critical factor as mobile commerce continues to grow.

When users have a smooth, frustration-free experience, they are more likely to return and recommend your brand to others.

### Stronger Brand Reputation

Consumers increasingly value brands that demonstrate social responsibility. By prioritizing accessibility, you position your company as:

* **Inclusive and Ethical**: Showing commitment to inclusivity fosters trust and goodwill among diverse customer groups.
* **Progressive**: Leading in accessibility can position your brand as an innovator in the industry, setting an example for competitors.

Positive public perception translates into stronger customer loyalty, more referrals, and a brand that stands out in a crowded market.

Now that we’ve outlined the benefits of successfully implementing accessibility in your e-commerce strategy, let’s dive into some actionable steps to help you get started.

## How To Get Started With Accessibility

### 1. Conduct an Accessibility Audit

![](https://cdn.sanity.io/images/kqgmf0g2/production/7d1ba181aa6eb44c7a1af6a2e65012492e9ada3a-2120x1324.png?fit=clip)

The first step, once you familiarize yourself with the specific accessibility standards and requirements, is to conduct an accessibility audit of your e-commerce website.

This can be done manually—by navigating your site with a keyboard, testing screen reader compatibility, and reviewing color contrast—or automatically, using tools like [Level Access](https://www.levelaccess.com/), [WAVE](https://wave.webaim.org/), or [Lighthouse](https://chromewebstore.google.com/detail/lighthouse/blipmdconlkpinefehnmjammfjpmpbjk?hl=it), to identify areas that do not meet WCAG 2.1 standards.

### 2. Define Accessibility Goals

Once you have the audit, you can establish clear, measurable objectives to guide your accessibility efforts. 

When doing this, you’ll want to **prioritize high-impact areas** that have the most significant effect on user experience, including:

* **Navigation menus** to ensure seamless site exploration.
* **Product pages** for clear and accessible product information.
* **Checkout forms** to reduce barriers and improve conversions.
* **Search functionality** to help users find what they need effortlessly.

Remember: you should aim for **WCAG 2.1 Level AA** compliance as a baseline.

Develop a comprehensive roadmap that outlines the scope of your accessibility improvements, sets priorities, and defines a realistic timeline for implementation.

### 3. Educate Your Team About Accessibility

Accessibility is an ongoing effort, so educate your team to maintain compliance. 

* **Developers**: Train them to write accessible code using best practices and tools like Accessible Rich Internet Applications ([ARIA](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA)) for enhancing screen reader compatibility. Implement a workflow that includes automated accessibility checks—such as using the Lighthouse API—to review accessibility scores for every change to the code before deploying updates to the production environment. This ensures continuous monitoring and improvement.
* **Designers**: Educate your design team on WCAG 2.1 principles, including color contrast guidelines, scalable text, and keyboard accessibility. Encourage them to integrate accessibility considerations from the very beginning of the design process, ensuring that every layout, component, and interaction is inclusive by design.
* **Content Creators**: Train content creators to write clear, concise, and descriptive content that is inclusive and accessible. This includes using plain language, providing meaningful alt text for images, creating descriptive link text, and ensuring proper use of headings for better readability and navigation.

### 4. Monitor and Maintain Accessibility

Accessibility isn’t a one-time project—it requires continuous monitoring and adaptation to ensure your website remains inclusive and compliant over time.

Here’s how to maintain accessibility effectively:

* **Conduct Regular Audits**: Conduct periodic accessibility reviews to identify and address new issues that may arise from updates or changes to your website.
* **Collect User Feedback**: Actively seek feedback from users with disabilities to uncover pain points and prioritize improvements based on real-world experiences.
* **Stay Up-to-Date**: Keep track of updates to accessibility standards, such as WCAG revisions and changes in related legislation, to ensure your site remains compliant and up-to-date.

### 5. Seek Professional Support

If the complexities of accessibility implementation seem overwhelming, you don’t have to navigate them alone. Partnering with experts can provide the specialized knowledge, tools, and strategies needed to achieve compliance efficiently and effectively.

Professional accessibility consultants can perform a comprehensive audit of your website, identify areas of non-compliance, and provide actionable recommendations tailored to your website. They can also work with your team to develop a long-term accessibility strategy, ensuring that future updates align with standards like WCAG 2.1.

## EAA: An Invitation to Innovate and Empathize

The EAA should not be viewed as a constraint but rather as an opportunity to innovate and build more inclusive digital experiences. By following the steps outlined above, accessibility can become a core focus of e-commerce development, driving both compliance and user satisfaction.

If you need assistance implementing accessibility in your e-commerce strategy, our team is here to help. We can audit your website to identify areas for improvement and guide you through achieving compliance. [Get in touch](https://nebulab.com/contact-us) to ensure your website is not only accessible but also a model of inclusivity and innovation.

European Accessibility Act: A Primer for E-Commerce Brands

Over the last couple of years, a lot has been written about [the rise and fall of Digitally-Native Vertical Brands (DNVBs)](https://www.retaildive.com/news/dtc-brands-are-dead-retail-wholesale-long-live-dtc/729365/). These players vowed to eliminate the middleman and sell their products exclusively online, seizing an incredibly profitable arbitrage opportunity that revolved around cheap advertising and meager interest rates.

As it turned out, this strategy was doomed to fail as the market saturated, advertising became more expensive, consumers resumed shopping in-store after the pandemic, and venture funding dried up. These (and a few more) factors led to a sharp and dramatic deflation of the DNVB bubble, with several giants falling from grace and having to file for bankruptcy or face drastic valuation adjustments.

Today, savvy commerce operators understand that DTC is a sales channel, not a business model, and must be deployed as part of a much more comprehensive marketing and distribution strategy to have a net positive impact on the brand. The result is a more mature retail scene, with operators that seek to be omnichannel and profitable from day one—a refreshing return to Brand Building 101.

However, one particular type of retailer has been struggling more than others to catch up to the new reality due to its unique business model and (in some cases) low digital maturity: the Multi-Brand Retailer (MBR).

In this article, we’re going to explore why MBRs have it harder than the rest and what they can do to establish, maintain, and further their competitive advantage.

## The Problem and Opportunity of Multi-Brand Retail

If retail is a tough business, multi-brand retail takes the difficulty level up a notch by eliminating product features from a retailer’s potential sources of competitive advantage. When you sell the same products as tens of other retailers, you need to give the consumer a reason to buy that product from you vs. the competition.

For brick-and-mortar MBRs, that reason has historically been mere geographic proximity. In the physical world, it’s impractical for the average consumer to travel long distances “just” to find a better deal or get a slightly better experience. As a result, many brick-and-mortar MBRs have historically operated a business of arbitrage, where their main job was to acquire and then monetize foot traffic.

Unfortunately, these retailers quickly realized that online shopping is a different game altogether. With every one of your competitors just a Google search (or, soon, [a Perplexity prompt](https://www.perplexity.ai/hub/blog/shop-like-a-pro)) away, the Internet is a giant comparison machine. It costs the digital consumer virtually no effort to find the best possible deal on that pair of boots they’re looking for.

To survive, most MBRs focused on the only factor within their immediate control: price. They deployed ever more aggressive discounting strategies in an effort to win the consumer’s business. Unfortunately, this resulted in a race to the bottom that destroyed their margins and diluted their brands. This phenomenon contributed to the demise of smaller, family-owned operations and larger, more established players—a prime example being [the recent sale of YNAP to Mytheresa.](https://www.voguebusiness.com/story/companies/without-farfetch-whats-next-for-ynap)

On the other hand, the same aspects that make multi-brand retail so complicated to crack also make it a high-potential business model. Unlike most mono-brand shopping destinations, MBRs can become a one-stop shop for entire product verticals or consumer segments, reaching more consumers and commanding larger wallet shares than a single brand could ever do.

But if price wars are not the way to do this, what is?

## Mapping the Actors Involved in Multi-Brand Retail

Before answering the question, it’s essential to map the actors involved in a multi-brand retail operation and how they typically interact.

In its most basic form, the relationship looks like this—a brand sells to a retailer, which in turn sells to the end consumer (often, things are slightly more complicated, but this simplification will work for the purpose of our article):

![](https://cdn.sanity.io/images/kqgmf0g2/production/f773f93199f44a0bc87c4d5977e8c26e883f7a3a-400x100.svg?fit=clip)

In reality, though, brands always sell through multiple retailers, which means the relationship graph _actually_ looks like this:

![](https://cdn.sanity.io/images/kqgmf0g2/production/ec2621cfffeabd8919ad8f80c01306ffa5258a30-500x200.svg?fit=clip)

To make matters more complex, most brands _also_ sell directly to the consumer, either online or through their brick-and-mortar stores:

![](https://cdn.sanity.io/images/kqgmf0g2/production/2967e7060654d23e2a9b59a3c78b2511f58fcf56-500x200.svg?fit=clip)

Each of these relationships creates opportunities and constraints for all the parties involved in the system. As a couple of examples:

- Brands need retailers in order to increase their market share and penetration. At the same time, most brands ultimately want customers to shop on their direct channels, where they can collect more data and increase their profits.
- Most consumers want the best price, which pressures retailers into offering discounts. At the same time, brands don’t want to dilute their market positioning or cannibalize their own channels, so they regulate product pricing and availability.

For a multi-brand retailer, there are many more similar contradictions to navigate—each brings challenges but also creates opportunities.

In fact, savvy operators are experts in creating outsized value for each actor in the ecosystem while “satisficing” all constraints. In doing so, the retailer eschews its transactional role as a mere middleman between the brand and the consumer and builds its own identity; in other words, the retailer becomes _its own brand._

This approach allows retailers to compete on factors other than value, such as product selection, customer experience, and value-added services, giving them more bargaining power (literally and figuratively) in their relationships with brands and consumers.

So far, this is all very theoretical. Let’s see what it looks like in practice by analyzing how multi-brand retailers can compete across three dimensions: Merchandising, Customer Experience, and Value-Added Services.

## A Retailer for Everyone Is a Retailer for No One

When it comes to merchandising, multi-brand retailers should lead with a strong value proposition, understanding what kind of consumer they want to serve and how they want to position themselves. This will serve as a North Star in determining not only product selection but the retailer’s entire go-to-market strategy.

Unfortunately, most MBRs err on the side of caution and try to be everything to everyone. This choice (or lack thereof) often spurs from the fear of alienating specific market segments. Unfortunately, it comes two significant drawbacks:

- It generates massive operational overhead for the retailer’s merchandising, marketing, logistics, and operations teams.
- It dilutes the retailer’s identity in the eyes of both consumers and brands, turning them into a commodified middleman rather than a standalone entity.

The primary value of a multi-brand retailer is to act as a tastemaker, helping consumers navigate the brand landscape through a distinct point of view. Retailers that neglect this aspect are giving up a significant competitive lever and will only be able to compete across other dimensions, further reducing their ability to maneuver in the market.

This is not to say that this approach can _never_ work. In fact, it’s exactly what Amazon does: it carries (or aims to carry) every single product from every single brand in every single category, generates massive efficiency through economies of scale, and reinvests those savings to compete exclusively on price and convenience.

Unfortunately, there can only be a handful of Amazons in the world; everyone else needs to take a stance if they want to stand out.

Furthermore, having a unique value proposition also enables and enriches the other two competitive dimensions we’re exploring in this article–customer experience and value-added services. Let’s see how.

## Nailing the Multi-Brand Customer Experience

Consumer expectations for customer experience have never been higher, as evidenced by [Shopify’s recent State of Commerce report](https://www.shopify.com/uk/enterprise/state-of-commerce-report-2024): Offering a modern, robust digital shopping experience is a must-have for anyone selling online today. Luckily, the technology to do so has been largely commoditized, and the playbooks are available for everyone to peruse and implement.

However, while mono-brand players may be able to settle for “good enough,” multi-brand retailers do not have that luxury. For an MBR, customer experience is a lever to exploit rather than a bar to clear. The reason for this is two-fold:

- As we’ve mentioned, multi-brand retailers rarely compete on product. As a result, customers will place more importance on the quality of the customer experience in a multi-brand retail context than they would for a mono-brand transaction since they have alternative shopping channels to choose from for that same product.
- Furthermore, multi-brand retailers lend themselves to higher AOVs and more frequent purchases, which means customers will be exposed to their shopping experience more often and deeply. Again, this means they will emphasize CX quality more than usual.

The leading multi-brand retailers understand this, and they create innovative shopping experiences that don’t settle for the bare minimum. Instead, they include advanced elements which may include any of the following:

- **Dynamic cross-selling:** MBRs can mix and match brands in ways that a customer wouldn’t (easily) be able to experience elsewhere. This can lead to cross-selling opportunities and contextual product recommendations.
- **Experience personalization**: By building a deep understanding of their audience, multi-brand retailers can create concierge experiences that help customers navigate what may be an otherwise intimidating product catalog.
- **Loyalty/membership programs:** Given that the ultimate goal of a multi-brand retailer is to become the one-stop shop for their customers, loyalty and membership programs can be highly impactful in improving customer retention—in some cases, they can even generate entirely new revenue streams.

All of these initiatives have the added benefit of helping the retailer collect data that can fuel merchandising decisions and further CX improvements.

In multi-brand retail, the customer experience is not just something you slap on top of the product. In fact, insofar as “product” is defined as the distinctive value the retailer offers its customers, customer experience is _the_ product they should worry about.

## Going the Extra Mile with Value-Added Services

Finally, multi-brand retailers can compete on what are typically called Value-Added Services (VAS). This is a broad term that often overlaps with the Customer Experience bucket. For the purpose of this article, we define VAS as any elements that are not part of the core shopping experience but are still perceived as valuable by the consumer.

Value-added services allow MBRs to create unique value that consumers couldn’t get through other channels—sometimes, not even through the brands’ direct-to-consumer channels. A few examples of VAS are:

- **Product alteration:** This may include services such as tailoring, embroidering, engraving, and any other product alteration and customization services relevant to the categories the MBR operates.
- **End-of-life options:** Through economies of scale, multi-brand retailers are well-positioned to offer customers the ability to repair, recycle, or resell their products. For example, [Net-a-Porter allows customers to resell products through Reflaunt.](https://netaporter.reflaunt.com/choose-your-location?redirect_url=%2F)
- **Community, content, curation, collabs:** [The 4Cs of the modern brand.](https://andjelicaaa.medium.com/4cs-of-the-modern-brand-8bb96c5b3597) Multi-brand retailers can expand their brand universe through community activations, bespoke and curated content, and collabs with adjacent verticals/categories.

Through Value-Added Services, multi-brand retailers build up their own brand, repositioning themselves from middlemen to value-creators in the consumer-brand relationship and adding a new dimension to their competitive strategy.

## Where to Start?

In this (very long) piece, we’ve seen how MBRs can stay competitive by identifying a distinctive and compelling value proposition, offering a best-in-class and innovative customer experience, and investing in value-added services to build a standalone brand.

Nebulab friend and [Commerce Thinking](https://www.commercethinking.com/) co-founder Luke Hodgson, interviewed for this piece, shares our perspective:

> “The economics of multi-brand retail demands a precise approach to everything, particularly digital merchandising. Without the cushion of production margins or brand marketing budgets and faced with high return rates, particularly in luxury fashion, successful MBRs master a different kind of value creation.
> 
> “Rather than competing on price or rushing to discount, \[multi-brand retailers\] become curators of lifestyle – they're crafting immersive digital and IRL experiences through photography, detailed product storytelling, and carefully constructed edits that speak directly to their customer. The future belongs to those who can understand and influence their customer's style journey better than the brands themselves.”

With that said, it’s also important to acknowledge that most of these investments require significant time, advanced know-how, and deep pockets. Very few retailers have the capabilities or the means to pursue a full-blown digital strategy from day one.

As always, we suggest [talking to your customers,](https://nebulab.com/blog/ecommerce-product-management) starting from low-hanging opportunities, and using data to iterate in a disciplined and intentional way. By truly understanding what their customers care about, MBRs can focus relentlessly on the areas more likely to make a difference and ignore everything else.

Over the following years, e-commerce will only get more challenging for MBRs as new players enter the market and brands ramp up their direct channels. While adjusting to this new reality may prove expensive, we believe that failing to keep up will further reduce a retailer’s competitiveness—and may ultimately prove fatal.

Redefining the Digital Value Chain for Multi-Brand Retail

Nicolò Rebughini

The Shopify ecosystem features a plethora of services and frameworks designed to help developers launch their own apps, whether they’re custom apps only meant to be installed on a specific store or public apps that will be listed on the Shopify app store.

Among these tools is [Gadget](https://gadget.dev/), claiming to be “the fastest way to build and run web apps.”

Gadget wants to be your one-stop shop for all of your full stack app development needs by providing a platform to handle all of the infrastructure needed to build and deploy an app.

At its core, it offers a managed PostgreSQL database and auto-generates an API package, complete with TypeScript support and React client integration. Developers can write server-side JavaScript code that runs on a serverless Node.js platform powered by Fastify, while the frontend development is simplified with a pre-configured React scaffold powered by Vite.

![](https://cdn.sanity.io/images/kqgmf0g2/production/ccc1ec82bad8e5a6f57c4d51528ddd41b1a9278a-2856x2172.png?fit=clip)

Gadget apps are always live from the moment they are created, and development environments can be promoted to production with a couple of clicks. On top of this, it offers an Integrated Development Environment (IDE) to manage both code and data in a unified location.

While Gadget is now a tool for building any sort of Web app, it was originally born to accelerate the development of Shopify apps. The Shopify integration provided by Gadget streamlines a lot of boilerplate work by offering:

- Data models for all your Shopify objects that you can augment with new attributes, stored on Shopify as custom metafields.
- Webhook subscriptions for object creation, update and deletion.
- So-called **actions** which allow you to run custom logic to keep Gadget in sync with your Shopify instance.

Gadget also publishes a TypeScript API that you can use to manage your custom data models. As an added bonus, this package is then made available through a registry, so it can be integrated in your Shopify storefront or any other JavaScript application.

Today, we’re going to take Gadget for a spin by using it to build a simple custom app that records the history of price changes for our Shopify products.

## Building Our Sample Gadget App

When creating a new app, we suggest starting with an  **Empty React embedded app**. Gadget also offers some pre-built app templates, but these don’t always work out of the box unfotunately, making for a subpar development experience.

Our Gadget app will need to read **productVariant** objects, as that’s where Shopify stores the variant price, so we need to select the **Product variant** scope when creating the app:

![](https://cdn.sanity.io/images/kqgmf0g2/production/50696d4cc9fd8601284264d42b53520aeae783ed-2910x2160.png?fit=clip)

At this point, can install the app in our Shopify store. To do this, we need to:

1. Create a Shopify app from the Shopify Partner Portal.
2. Copy the Shopify app’s Client ID (the app identifier) and Client Secret and plug them into Gadget’s configuration panel for our Gadget app.
3. Copy the URLs generated by Gadget and paste them in our Shopify app’s configuration panel. 
4. Go back to the Shopify app overview and select a store where we want to install the app.
5. Grant our app the required permissions in the dialog that pops up.

If all went well, we should now be able to see the default Gadget app UI in our Shopify store’s admin panel.

### Syncing Data Between Gadget and Shopify

To experience a bit of Gadget’s magic, we can check the **Installs** tab in the Gadget sidebar and start a **Sync** for the store we just installed our app in. This will sync our Gadget database with our Shopify store.

![](https://cdn.sanity.io/images/kqgmf0g2/production/4d65fe5ba7b9900c0d9944b25cff6d13aa58793f-2480x518.png?fit=clip)

To explore our data, we can head over to the **shopifyProduct** model and check out its data view. 

The **data** view is one of the highlights of Gadget: without Gadget, we’d have to make GraphQL API calls to be able to see the data. Being able to quickly see our Shopify data in a tabular form feels like magic.

![](https://cdn.sanity.io/images/kqgmf0g2/production/c00c913b45be8117514f0aa5fe3574c989eb79ab-3034x2244.png?fit=clip)

Furthermore, Gadget automatically creates webhook subscriptions for every accessible Shopify model, and by default, reacts to every change in the Shopify stores by ingesting changes: object creations, updates deletions are synced in near-real-time with Gadget’s database. If we attempt to edit a product, we should be able to see the changes shortly thereafter in the corresponding data view.

### Extending Our Gadget App with Custom Functionality

The simple app we're building just needs to record the history of prices set for our products. To do that, we need to store this data *somewhere*.

One way to do this would be to add a metafield to our variants. However, reading and writing the metafield would still requires going through the good old Shopify GraphQL queries and mutations, which requires a lot of boilerplate code. This is an annoying limitation of Gadget’s operating model.

Instead, let’s create a new **priceChange** model via the sidebar. Given we don't need to run calculations or any fancy analyses, we can structure the price field as a string, just as it is presented in the **productVariant** model.

We also want to correctly model the relationship between the **productVariant** model and the **priceChange** model: each **productVariant** should have multiple **priceChange** records. Setting this up via the Gadget UI is a breeze and very intuitive:

![](https://cdn.sanity.io/images/kqgmf0g2/production/1a30f13a82c332cfb7d06c17b3a903ad6af445cd-3034x1710.png?fit=clip)

Finally, we need to actually create a **priceChange** record on every price change. In order to do that, we can edit the **update** action for the **shopifyProductVariant** model, which governs what happens when variants are updated:

```jsx
// api/models/shopifyProductVariant/actions/update.js

export async function onSuccess({ params, record, logger, api, connections }) {
  const newPrice = params.shopifyProductVariant.price;

  if (newPrice != api.shopifyProductVariant.findOne(record.id).price) {
    api.priceChange.create({ newPrice, shopifyProductVariant: { _link: params.shopifyProductVariant.id } });
  }
};

```

With all of this in place, we can then test it by editing a product price on our store and then heading to the **priceChange** data view to verify the new addition:

![](https://cdn.sanity.io/images/kqgmf0g2/production/3fc38fe79407ae829db1952d8485118b7cb1cf73-2470x612.png?fit=clip)

### Taking It Further

Consuming the API built on the Gadget backend from any JavaScript or TypeScript application is as easy as installing an NPM package hosted directly in the Gadget registry, or including a minified script in your already existing web application. The API is kept in sync and documented automatically for you by the Gadget platform, which makes it a breeze to work with.

This would allow us, for instance, to read the record of price changes in our Shopify theme in order to show them to the customer (something that may be useful for compliance with the European Omnibus directive).

## Is Gadget Right For Your Shopify Customizations?

The answer is “it depends.”

If your team is already familiar with Gadget’s underlying technologies and ecosystem, picking up Gadget and feeling the magic of the robust webhook management and data synchronization  is a huge productivity boost, greatly reducing time-to-market for the applications you’ll be building.

However, if your Shopify application needs to deploy a checkout extension, a Shopify Function, or some other feature that’s not directly integrated in the app codebase, you can’t just use the Gadget UI. Instead, you’ll need to clone the code locally via the `ggt` command line tool, and then rely on the Shopify CLI to complete these tasks. While this adds some friction, it also allows you to use your preferred tools to work on the codebase, and `ggt` will still keep your data models in bi-directional sync between Gadget and your codebase.

Developers evaluating Gadget should also be mindful of platform lock-in: the platform takes over pretty much your entire custom app infrastructure, forcing you to play by their technical and commercial rules. If you ever need to migrate off of Gadget, the price to pay may be significant.

In conclusion, for teams prioritizing rapid Shopify app development over platform independence, Gadget offers a compelling and solid foundation to build upon. If, on the other hand, you value owning your infrastructure and want full control over your development environment, you’re probably better off developing your app from scratch.

The Nebulab