Electronics Store with EMI and Trade-In

Project overview

We built a headless eCommerce store for an electronics retailer selling phones, laptops, audio and accessories online and through its own shops. Shoppers choose a model, configure storage, colour and add-on warranties, compare specifications side by side, pay upfront or by instalments, and can trade in an old device for instant credit against the new one.

The engagement covered commerce discovery, a custom storefront on Shopify Hydrogen, Node.js services for trade-in and financing, integration with store stock and a staged launch. It is part of our eCommerce app development work for retail and eCommerce brands.

The client and the challenge

The retailer's theme-based store could not model electronics well. Each storage and colour combination was a loose product, compatibility between devices and accessories was unclear, and shoppers left to compare specs elsewhere. Instalment options were only offered in shops, and trade-ins required a store visit and manual valuation. Page speed on mobile was also poor, because heavy theme scripts loaded on every product page.

The retailer wanted a fast storefront, configurable products, instalment and trade-in options online, and returns that tracked exact serial numbers, because high-value devices attract fraud and warranty claims depend on knowing precisely which unit was sold.

Solution architecture & delivery

We used Shopify Hydrogen for the storefront so product, cart and checkout stayed on the commerce platform while the front end was fully custom. Product pages are built around a configurator: the shopper picks model, storage, colour and warranty, and the page resolves that choice to the exact variant, price and stock, including stock at nearby stores for click-and-collect. Structured specifications feed a comparison view and an accessory compatibility check that only suggests chargers, cases and cables that fit the selected device.

Trade-in runs as a Node.js service. The shopper answers a short condition questionnaire for their old device, the service applies the retailer's price grid for model, storage and grade, and returns a provisional quote that is applied as credit in the cart. When the device is collected or dropped at a store, staff grade it with the same questions in a staff tool; if the grade differs, the quote is adjusted and the customer is asked to accept or have the device returned.

At checkout, eligible baskets show instalment plans from the retailer's financing partners. The Node.js service calls the partner's eligibility and plan APIs, shows monthly amounts with total cost of credit before the shopper commits, and records the approval reference against the order. Financing and card data are handled by the partners and payment gateway, never stored by us.

Warehouse staff scan serial numbers when orders ship, so every order line records the exact unit. Returns and warranty claims must match that serial, which stops swapped-device fraud. Performance budgets, image optimisation and caching followed our high-traffic architecture guide.

Key features we built

• Product configurator resolving model, storage, colour and warranty to exact variants
• Side-by-side specification comparison and accessory compatibility checks
• Instant trade-in quotes from a condition questionnaire, applied as cart credit
• Staff grading tool that confirms or adjusts trade-in value on collection
• EMI and instalment plans shown with total cost before commitment
• Serial-number capture at dispatch for returns and warranty validation
• Click-and-collect with live stock at nearby stores
• Promotions, bundles and extended warranty add-ons

How we delivered it

1. Discovery. We reviewed search and basket data with the retailer's team, spoke to store staff about trade-in and financing, and defined the product data model for configurable devices.
2. UX and prototype. Configurator, comparison and trade-in flows were prototyped and tested with shoppers on mobile, where most browsing happened.
3. Build. Two-week sprints delivered the Hydrogen storefront, trade-in and financing services and store stock integration, with product data migrated in parallel.
4. Launch. The new storefront launched for one category first, then the full catalogue once trade-in grading and financing flows had run cleanly with real customers.
5. Support. Ongoing work covers new device launches, trade-in price grid updates and seasonal campaign pages.

Technology choices

• Shopify Hydrogen — a custom, fast storefront on top of a reliable commerce back end for catalogue, cart, checkout and orders.
• Node.js — lightweight services for trade-in valuation, financing partner calls and store stock lookups alongside the storefront.

Outcomes

• Shoppers configure the exact device they want instead of hunting through loose product listings
• Instalment plans and trade-in credit are available online, not only in shops
• Accessory suggestions only show items that fit the chosen device
• Every sold unit is tied to a serial number, making returns and warranty claims verifiable
• Store staff grade trade-ins with the same rules customers saw online
• Merchandising teams launch new devices through structured product data rather than duplicated pages

FAQ