Build your own widget

How on earth am I going to do this?

[balinor]

Hi all, just received a call from a potential client who would like to build an e-commerce site for customizable widgets. For example, a user would 'build' this widget, starting with the shape, then adding color, features, etc. So far, not so difficult. But what they also want is for the user to be able to see the widget getting built as they go, you know, they click on a swatch of color and the preview image change). First question is, what would be the best way to construct this feature? Shockwave? Flash?

Next question: how the heck am I going to find a shopping cart system that can handle this? I frequqently use products like Xcart, but that just isn't going to cut it for this site. I do not want to build my own cart system (nor will the client want to pay for the time to do so) Anyone have any suggestions for where to start? Any advice would be greatly appreciated, thanks!

[Abdelrhman Fahmy]

For the first question, I think using flash will help you a lot in the part of visual customization, and during the process of the visual customization of the product you've to collect the custom configuration data and then post it at the final step to the shopping cart script.
And about the shopping cart: early impact offering a BUILD TO Order cart which is very good but I think it's not very cheap

[PatrickDeese]

why not use a dichotomous screen for each stage and a product ID for every possible variant?

ie:

widget ->
red or blue -> blue widget
large or small -> small blue widget (code: product01)

widget ->
red or blue -> red widget
large or small -> large red widget (code: product02)

Not too hard to set up. I would agree that a small Flash animation window may be a way to show your visitors their product as they move along through the steps.

[balinor]

Patrick,

Yea, that would be great, but there are way too many options...10 widgets, each with hundreds of different options. Plus, how would you change the image on the fly without having to photograph each possible variation? I need an application that will build it on the fly from one 'template' image.

[Herath]

The shopping cart will only carry the description of the finished product right?. So, that might not be an issue here.

For dynamic images, you could use a server side Java servelet to generate the picture based on the parameters you pass. The servelet can then place the image in a folder and refresh the page with it.

I have done somthing similar in the past using Java 2D API and worked out great. We had a "preview item" button which updated the page with the latest image created by the servelet.

[Abdelrhman Fahmy]

I think flash will be more faster and smoother than java in previewing the pictures ,also you have a full control over the image parameters by using action scripting so you can fully integrate the flash movie with your ASP or PHP script

[balinor]

Ok, we were going great and now we seemed to have stalled. Anyone else have any suggestions? I'm not as concerned with how to make the dynamic image, I am more concerned with how to tie this into a cart system. Would be even better if it could tie into an 'out of the box' cart system. Thanks in advance for any advice!

[mbennie]

Can be done with Flash.

Set the options in the FLA, pull them dynamically from a .php or .asp script.

Fairly easy to do technically. Very difficult to do in reality due to the tremendous amount of possible variations.

[jetboy_70]

"The shopping cart will only carry the description of the finished product right?"

Herath was on the right track. It's only a purchasable (sp?) item when it's finish. Only at that point do you need to integrate with a shopping cart (where there will be an individual product code for every possible permutation).

Hold the build parameters in a simple session or cookie as the build takes place. When it's done, poll your database for the product code using the build parameters and chuck one of these items in the cart.

If you're allowing the user to go back and edit a build, fire the product code at the database and populate the session with the returned build parameters.

Two systems: An all bells and whistles shopping cart, and a very simple session system. The two only interact when you have a finished product.

[TheDave]

I tried doing this once, and Webmaster to Webmaster I would say "RUN" ;) As someone said, technically, yes, reality, argh. Mind you this was years ago and I was using HTML and Javascript, doing it now I would use less java and more server-side processing. Also, if you can break the process up into steps it makes it a lot easier for both you and the user.

[balinor]

Ok, so it is complicated as all hell, but it CAN be done using Flash, PHP and a MySQL database, correct? This MUST exist on the web somewhere, it's not like I'm trying to build a time machine here. Maybe the boys at Xcart would be willing to build me a custom module? ;)

[justgowithit]

it's not like I'm trying to build a time machine here.

I've got it! It's really quite simple. Just use a Flex-Capacitor... Oops, still watching back to the future -- sorry ;)

[WibbleWobble]

You could always use an out of the box cart+CMS solution, and hack it to do something like this: [I'm currently contemplating a similar venture/problem with osCommerce, FYI]

Set up a number of select boxes, radio boxes or check boxes [Product attributes in osC, there's likely to be similar functioning items in every other decent cart system about], and create a number of 'layers' (divs, or suchlike) that hold images for each different choice. With a little [lot?] of nifty coding, it should be possible to get the layers to show or hide based upon the selected choice. You could source the JS to an external file, and throw the images and stuff at the very end of the document, and voila, you have a customizable basket that ought to be search engine friendly, with any luck.