I'm working on a site that will have hundreds, and eventually thousands, of paper products that users can customize online. Here is a very simple sample of what needs to be generated based on the product id:

demo.

This is a very simple version. I plan on replacing text fields with prettier elements(like the slider on tab 3). I imagine most of this can be achieved via jquery.

So basically a product will have multiple pages(tabs), with multiple form elements on each page.

I've never done a large scale project like this before and I am looking for ideas/suggestions for how I can store the info for each product that needs to be generated to create the UI. For each product, I need to store how many pages there are, what form fields are on each page, and the order of the fields on the page. As well as setting default text values and form options(font size, etc). Then with all this info stored somewhere, I can have the web app retrieve it and generate the UI with text fields, sliders, and other jquery-ish form enhancements, for that particular product.

Can anyone toss out some suggestions, links, blogs, tutorials? I'm not really sure where to begin with this or what I need to start to investigate. I have experience with php, mysql, javascript, jquery, html, css, and that is really about it.

I'm open to learning(and would enjoy exploring) new frameworks, programming, etc that will really get this web app working correctly, efficiently, and effectively. Maybe I should start looking into a mvc framework? like i said, i really have no idea what is the best approach.

please let me know your suggestions!