Client Project · Built with Shopify (Liquid) and JavaScript Web Components

‍

https://www.doors.com/

‍

Doors.com is a high-volume custom door retailer running on Shopify with a fully custom storefront built using Liquid templates and JavaScript web components for modular, interactive UI elements.

‍

As the tech lead on a highly complex product configuration challenge, I architected a solution to bypass Shopify’s 100-variant limit using Metaobjects and custom product logic. I led the planning and delegation of tasks to junior devs, provided guidance on Liquid and JS implementations, and ensured the frontend stayed performant and scalable. My role included translating ambiguous client needs into structured, maintainable solutions.

‍

A key challenge in this project was overcoming Shopify’s 100-variant limit, which posed a significant barrier for a product like custom doors that can have hundreds of configuration options (sizes, finishes, handles, hinges, glass types, etc.).

‍

The Solution

‍

To work around Shopify’s variant limitations, we architected a solution that leveraged:

• Metaobjects to define complex configuration data structures
• Custom products tied to each metaobject, dynamically rendered based on user selections
• Seamless front-end logic to mimic native variant behavior while keeping the UX intuitive and fast

‍

This allowed customers to customize a single door product with a wide array of options — without sacrificing performance or breaking Shopify’s constraints.

‍

The final result is a scalable, flexible product architecture that supports complex configurations and improves the customer experience without requiring third-party apps or external systems.