Online Image Editor - Ajax or Flex / Flash?

Question

I am working on a plan to build an online image editor with just some basic functions. It should (obviously) contain a canvas working area and support the following functions:
1. Upload an image from your computer or submit a link
2. Resize image (by dragging the corner)
3. Rotate and flip
4. Drag / move / pan
5. Layering (if more then one image is on the canvas, select vertical order)
6. And very important: it should be able to do some sort of background deletion using simple edge detection.
Images I am using are going to be mostly of fashion items so I want to be able to take off the background if its not white. For example automatically make this gray background, white: Click for image - T-Shirt Black BG

I guess my best starting point is to grab some open source image editor and just use the parts of the code I need. My question is what will be better for me: Flash / Flex, or Javascript based editor. Each have some very nice implementations online, like Sumopaint, Aviary, and obviously Photoshop.net for Flash and some other good ones for JS.

Should I use Flash or go with a Javascript based solution? My gut feeling is towards JS with HTML5 coming around the corner.
Also if you recommend Javascript, can you please include your preferred framework for something like this??

Thanks!

Exhaustion

Answer 1

Ajax version would have to use something on the server processing the images, like the GD Library or ImageMagick. With flash you/flex you could do the image processing on the client side, and with Flash Player 10 you can take advantage of Pixel Bender for image processing. I guess it depends on the size of your images. I would be interesting to see a benchmark on some big images, flash vs ajax/php.

Good question.

Covenantee

Thanks George... small follow up: Most of my images are going to be imported from other fashion sites. I assume that using an Ajax based solution will allow me to keep the image format (jpeg, gif...) and a Flash based solution will require conversion to SWF. Someone told me that converting to SWF automatically might effect image quality (pixelation, blur, change colors) and its recommended to do it manually (which I cant) Second: will I need Flash Media Server to convert the images to SWF or can it be done on the client (Flash 10)? Thanks! – Exhaustion

No worries.Why would you need to convert images to SWFs ?you can load the images in the swf, process them, send the resulting bytearray to a server to write the file to disk. As for multiple image formats, although there are GIF,PNG,BMP,etc. libraries in as3, why add that extra layer when you might not need that with Ajax, I see your point. I don't think you need Flas Media Server to convert images to SWF.I think it can be done in as3, doing some nasty bytearray business, but it might be easier to use the PHP Ming library to create a SWF out of an image on the fly from PHP. why is that needed? – Covenantee

Thanks George... So what's is your recommendation... My gut feeling tells me to go with Ajax. I want to do something like this: polyvore.com/cgi/app What do you think? – Exhaustion

I'm not saying go for Flash or go for Ajax, which doesn't help you much. I was just suggesting that a benchmark of the common tasks that your app should do (really basic test, background deletion 400x400 for example), how fast is it in flash (client side) or ajax (server side image processing) and how well does it scale for your maximum predicted users. If the difference isn't that big performance wise, I'd say ajax, as you'll probably have less headaches with SEO. Then again, you ajax team should be prepared to fix any problem that may arise in each browser. I don't think I can say yes or no. – Covenantee

doing something like polyvore.com/cgi/app is very hard, I think, cuz is really messy try to make it works on IE :(, so anyone have a thecnique to do it like polyvore's team? japaneses did it god!! – Danieledaniell