woocommerce添加图像变化色板

I've created a color variation using jquery colorpicker. Now I need to create image variation. So if I'm right, I need to add image loader field, in woocommerce add variation form and then output this image on product page. So I don't ask you to give me complete solution. I just want to ask, may be someone can give me some example or information to read. And also, can I do this only using jQuery or I need to have knowledge in PHP too. Also I add screen's where I need to insert image load field. This is admin page in wordpress