WooCommerce Card Designer

In 2020 My Card box asked me to develop a clone of the MoonPig.com greeting card personaliser. The personaliser had to be capable of importing PSD files.

I created a WooCommerce plugin which added a new WooCommerce product type (card) and attached a new metabox to the WooCommerce product edit screen. This utilised a html canvas element. I added html controls which added images and text elements to the canvas. You can edit the position, font size, container dimensions and set the element to be editable in the personaliser. I also used a PSD to JS conversion library to import PSD documents into the application.