First off I love what you are trying to do. I seems that you are looking to make a simulator for people to test out different hair styles online before they commit. I would have avoided some of the worst folicle errors of my life if I had this tool.
The first concern I have with using this as your template is size. You have no real way of making the image being uploaded the same size as your sample hair styles. Unless you give the user the ability to resize the uploaded image or the hair samples you seek to add the hair will either be too small or too big for the image they upload. Also the subject in the photo will need to either be bald or in the case of someone with long hair they will need to have it pulled back in the image.
To make this simulator truly functional the image uploader needs to allow for cropping and resizing as well as adjusting the position. The catalog of images that simulate the hair styles will also need to be scaled and repositioned by the user. I do not know of a tutorial that does this but I would start my search with video games that allow for image manipulation and with software used by artists that do composite sketches for the police. Something may exist out there.
Lol Just Be.
I also would have made diffrent hair choices as well.
I was actually going to have diffrent sizes and mutiple choices. As you click the scribble it changes so I was hopeing of some type of button to pull the images and the user could postion their image under the hair style and chose the one that best fits. Plus it might be fun for them to put a big hair on a little picture (to bring back the 80's). But I will look at the options you gave me and see what I can come up with. Thank you.