How to simulate clothing changes in a 2D image?

Question

I am working on a small project that requires: changing the clothes (shirt / pants, etc.) of a person in any 2D image that he wants to upload. Thus, it is necessary to somehow define the edges, and the corresponding areas should be filled with new templates. I see many other complications, but let it be assumed that simple templates should be filled only.

• For a web application, can this be done in HTML5? Any other alternatives?

• For a stand-alone application, which technology is preferable, C ++ / Java?

Update

Based on Bart's comment:

• Any helpful pointer like Bart would be really helpful
• Assumption: a transparent, traceable “permanent” human figure in the 2nd image
• Since this is an image, there is no real-time scenario.

Answer 1

Assumption: transparent traceable “human figure” in 2d image

The way to do this is to require the user to take two photos. One image is an image with the image of the user, another image must be executed in the same camera position and orientation, but the user leaves the frame for this.

Since both images will have the same background, you can compare pixel by pixel between two images and mark those pixels that have a difference above a certain threshold. Of course, the threshold should be chosen so that camera noise is not detected as a difference. When you have a collection of pixels that are different from each other, you can filter them out and calculate the approximate silhouette for the user from pixels around the edge.

Simplification of the above method can be performed if you have control over the background. You can use bluescreen to avoid having a second image with a background.