Luxury Car 3D Shopify Experience
Budget / Salary$10–30
TypeFreelance project
LocationRemote
Posted1 hour ago
I’m upgrading my Shopify store for a high-end automotive brand and need a developer who lives and breathes Three.js / WebGL. The goal is to replace static product photography with a fully interactive 3D experience that feels as premium as the cars themselves.
Core interaction
• Shoppers should be able to rotate the vehicle a full 360°, pinch-to-zoom on mobile and scroll-wheel zoom on desktop, all while maintaining buttery-smooth frame rates.
• A dedicated customization panel will let them swap exterior colours and explore alternate interior trims in real time. Changes must update instantly on the model without page refreshes so customers see exactly what they’re ordering.
• Beyond simple spins, the car needs subtle highlight cues—opening doors, animated light sweeps, and camera hotspots—to create an immersive showcase that invites exploration.
Tech requirements
• Pure WebGL using Three.js; no iframes or Unity embeds.
• Clean, modular code that slots into Shopify’s theme files (Liquid / ES6).
• Texture and mesh optimisation for fast load times, with graceful fallback images for older devices.
• All assets lazy-loaded and GPU-decoupled where possible to keep CLS and LCP scores green.
Deliverables
1. Commented Three.js component(s) handling model loading, material swaps, and user input (zoom & rotation).
2. Liquid snippets or app integration instructions so the experience can be dropped onto any product page.
3. Build pipeline (Webpack/Vite) or Shopify Theme App Extension setup.
4. A short markdown guide so my in-house team can add future models, colours, or interiors without touching the core code.
Hand-off is complete only when the demo runs flawlessly on Chrome, Safari, Edge, and iOS/Android devices. If you’ve shipped similar luxury or automotive visualisers, include a link—I’m eager to see them in action.
Core interaction
• Shoppers should be able to rotate the vehicle a full 360°, pinch-to-zoom on mobile and scroll-wheel zoom on desktop, all while maintaining buttery-smooth frame rates.
• A dedicated customization panel will let them swap exterior colours and explore alternate interior trims in real time. Changes must update instantly on the model without page refreshes so customers see exactly what they’re ordering.
• Beyond simple spins, the car needs subtle highlight cues—opening doors, animated light sweeps, and camera hotspots—to create an immersive showcase that invites exploration.
Tech requirements
• Pure WebGL using Three.js; no iframes or Unity embeds.
• Clean, modular code that slots into Shopify’s theme files (Liquid / ES6).
• Texture and mesh optimisation for fast load times, with graceful fallback images for older devices.
• All assets lazy-loaded and GPU-decoupled where possible to keep CLS and LCP scores green.
Deliverables
1. Commented Three.js component(s) handling model loading, material swaps, and user input (zoom & rotation).
2. Liquid snippets or app integration instructions so the experience can be dropped onto any product page.
3. Build pipeline (Webpack/Vite) or Shopify Theme App Extension setup.
4. A short markdown guide so my in-house team can add future models, colours, or interiors without touching the core code.
Hand-off is complete only when the demo runs flawlessly on Chrome, Safari, Edge, and iOS/Android devices. If you’ve shipped similar luxury or automotive visualisers, include a link—I’m eager to see them in action.
Apply on Freelancer →
Project sourced from Freelancer.com. Applications happen directly on the original platform — we never collect your data.