Interactive Room-Shopping Site

Замовник: AI | Опубліковано: 05.04.2026

I’m building a web experience called “Shop the Scene” where visitors explore beautifully rendered, Modern interiors instead of scrolling endless product grids. As they move their cursor across a room image, subtle hotspots appear on hover, revealing a quick card with the item name, price, and a link to add it to the cart. A key part of the experience is a “Buy the Whole Look” button. When a shopper loves everything they see, they can click once, and the site will automatically calculate a bundled-discount price that reflects the total savings before dropping every piece into the cart. The stack is straightforward—clean, semantic HTML, responsive CSS (Flexbox/Grid), and vanilla JavaScript for all interactivity. I’ve sketched the layouts and have product data ready in JSON; what I need coded is the full front-end: room gallery, hover-based hotspot logic, dynamic price aggregation for the bundle, and a smooth, minimal checkout handoff. Deliverables • Fully responsive single-page application with room images and hover hotspots • “Buy the Whole Look” logic: real-time bundled discount calculation tied to the existing JSON feed • Clean, documented source (HTML, SCSS or CSS, JavaScript) ready to drop into my Shopify back end If you have recent examples of interactive image mapping, lightweight carts, or similar modular JS work, that will help me pick quickly. Let’s create a shopping journey that feels as seamless as browsing inspiration on Pinterest but checks out in a couple of clicks.