Budget: 300 EUR Deadline: 5 days
A very interesting and ambitious project — visualizing the color change of the car design directly in Shopify through a custom application — the task is not standard, but quite feasible.
A few clarifying questions to better understand the technical part:
- Do you already have SVG or vector design elements that need to be recolored programmatically?
- Do you plan to support multiple car models at once or just one?
- Are the colors fixed (for example, 6–8 options) or will the user be able to choose arbitrary shades through a palette?
- Is it necessary to save the selected configuration so that the customer can add the custom design to the cart?
If I were in your place, I would suggest using an SVG container with separated layers for each design element (zip, text, accents, etc.), and changing their colors via JavaScript directly in the browser. This will provide smooth interactivity and eliminate the need to manually render dozens of images. This approach can be easily adapted for a Shopify App and embedded on the product page.
In a similar project, we created a color visualizer for sneakers: the customer selected the color of each part of the shoe (laces, sole, fabric), and everything changed on the fly via SVG + JS. The main challenge was ensuring cross-browser compatibility and adequate loading on mobile devices, but we managed it, and as a result, the user could see their custom product before purchase, which significantly increased conversions.
To understand the scope of work and the timeline for its completion, we need to discuss the points described above.