Tresco Lighting
Created a User-Friendly Configurator Platform to Simplify Lighting Purchases for Tresco Lighting
About Project
Since 1989, Tresco® has consistently surpassed market expectations by offering innovative, high-quality, and affordable lighting solutions. Their in-house designs and patented products, backed by over 30 years of expertise, showcase their dedication to “Innovation Through Illumination.” As pioneers, they introduced North America’s first UL-listed under-cabinet track lighting system in 1992, setting the stage for their ongoing success across various industries, including offices, hospitality, and kitchens.
Tresco Lighting Configurator
BusinessNorth America
Location
Business Goal
Our goal was to create a user-friendly product configurator platform that simplifies lighting purchases for Tresco Lighting. We wanted to allow users to input their specific lighting needs, such as location, dimensions, and options, which eventually would lead the platform to generate a list of all necessary products, helping them discover additional items they may need.
Project Highlights
- Custom Product Configurator
- Real-Time Data Fetching
- Multi-Step Product Selection
- Adobe Commerce Integration
- PDF Download Option
Smart Lighting Configurator
Key Challenges
Step Complexity Increased
Developing a multi-step configurator complicated the user experience, making navigation challenging.
Data Integration Issues
Fetching product data from Adobe Commerce faced delays, affecting real-time display and configuration.
PDF Generation Delays
Generating product configuration PDFs for distributors encountered technical setbacks, causing delays.
Product Display Errors
Initially, all distributor products were displayed incorrectly, complicating offline collection and fulfillment.
Our Solutions
Step-Based Custom Configurator for Accurate Product Matching
We developed a step-based custom solution using React JS and Adobe Commerce integration. This allows users to select their specific lighting needs step by step, ensuring accurate product recommendations tailored to their requirements. We utilized a headless approach to improve performance and maintain flexibility. With this solution, users navigate seamlessly through the process, receiving compatible products that match their unique configurations, enhancing the overall shopping experience.
GraphQL API Integration for Real-Time Data Sync
To ensure fast and real-time product data display, we implemented GraphQL API to sync Adobe Commerce with the custom configurator. This API fetches product information quickly, ensuring users receive accurate product suggestions through each configurator step. The integration significantly improved performance and minimized delays, offering users a smooth experience while selecting their ideal lighting configurations based on their specific inputs.
PDF Download and Email Feature for Offline Purchases
We developed a feature enabling users to download a PDF for offline purchases. If the user opts for this feature, an email with the product configuration details is triggered to the selected distributor, ensuring smooth order processing. Simultaneously, the PDF is downloaded to the user’s device, simplifying the purchasing process for those preferring offline transactions while maintaining efficient communication between the customer and the distributor.
Distributor-Specific Product Selection for Accurate Display
We added a step to the product configurator, allowing users to choose a distributor based on location. This ensured that only products from the selected distributor were displayed, avoiding confusion. By tailoring the product display to specific distributors, users could easily find and select the exact items they needed without seeing unnecessary options. This solution streamlined both the online and offline purchase processes.
Our Approach
We used targeted strategies and solutions to gather and manage the operations efficiently.
Customization
Optimization
Discovery
Revenue
Technology Stack
Front-end Tech
ReactJs
Back-end Tech
ReactJs
Cloud
ReactJs
Project Management Tool
ReactJs
Key Results
Simplified Product Discovery
Users can quickly find relevant products through multiple configurations, reducing returns and boosting revenue.Real-Time Product Fetching
Products are fetched instantly from Adobe Commerce to the configurator, enhancing efficiency.Streamlined Distributor Preparation
Distributors receive customer requirements early, allowing them to prepare orders in advance smoothly.Efficient Order Fulfillment
Our team successfully redirected the order to the appropriate distributor for prompt fulfillment.
Similar Projects!
Transform your business with an Adobe-based solution!
Join forces with us to design a customized Adobe-powered platform for your company today!