Rendering or modifying images with different colors dynamically

Hello All,

We have an idea where in we display the clothing line in the iPhone/iPad application and provide the selection option to the user. Once the user chooses a apparel, that will be displayed in the image and below this image we will provide all the available colors to select from.On click of each color, the apparel will be updated and user will get to see the updated apparel color.

We have thought of 2 approaches - 

1. Maintain separate and different images for each of the options given to user in the form of png/jpeg (this will make the app heavy). CMS can be used here to deliver the right images. 

2. Make use SVG images in one standard color (maybe black/grey). This image will be loaded first and depending on the selection the color will be applied on it. We will have part by part of the apparel saved in the DB so that we can apply the apparel's design and colors accordingly.

We would require these functionalities to be pixel perfect for the end user experience to be smooth. How feasible is this in OutSystems with the in built features and support. 

Any thoughts on the approaches and guidance in the right direction will be helpful in providing us more insights. If any related forge component is available to achieve this. 

Hi Ravi,

Like I said in the other thread, I think option 1 is the only thing you can feasibly do. An SVG is a vector graphics image. Like a cartoon image. You can't hope for people to accept that as an image for clothing. Also, you'd want to have images of an actual garment in the actual colour, or people might order something that has a different colour than on screen.