Flash Image Resizing Preupload

Downtoearth.com has a really good image uploader that is done in flash.    It allows you to resize the image before submitting to a asp.net upload page.    This would dramatically reduce the 10 megs a second of images uploaded to my site! And fix the image sizing problems.

Where did they get this?    If its a custom job  who could I hire to replicate this?   I had always thought this could only be done in java.

imageuploader

42 Responses to “Flash Image Resizing Preupload”

  1. Hugo Gameiro Says:

    hi:

    This guys http://www.plugoo.com/ have a very similar one.

    So probably theres a script for that.

    I want one too…

    Congrats on the front-page…
    You are getting famous… :) and all the stuff you have achieved lately. I have been following you for a while now… Not a stalker. Just tryng to learn.

    Regards

    Hugo

  2. delconte Says:

    Flash 10 lets you get at the data on the client side before uploading. So you can resize and then upload. We did something like this before Flash 10 on http://photosleeve.com, but it required Silverlight + Flash 9. Been thinking about updating our site to Flash 10 for this reason. Feel free to contact me directly.

  3. Smarty Says:

    This can be done in Javascript as well. If you go for Flash solution, make sure it works in Flash 8 to support the whole market. yes, it can be done with Flash 8.
    Markus, you just need to contract a good web developer who knows javascript or flash well, such tool can be done in 1-2 month stretch and with average rate of $75/hour your expense will be $12,000-$24,000, but it will save you more in bandwidth costs…

  4. sarvesh Says:

    You could try http://www.pixlr.com/ they have an API not sure it would be easy to integrate though.

    With flash 10 it is possible to resize on client side.

  5. Denis Laprise Says:

    Don’t spend a fortune on that. Take http://blog.mediablur.com/2008/02/20/flex-image-cropping-component/ and add a file upload button (see http://livedocs.adobe.com/flex/201/html/wwhelp/wwhimpl/common/html/wwhelp.htm?context=LiveDocs_Book_Parts&file=17_Networking_and_communications_173_6.html )

  6. Stever Says:

    I just Googled around for ‘asp image resize crop script’ and there looks to be a few around. But do the same search for a php script and there are lots of real goodies. Like this baby for only 29 euros http://kroppr.rborn.info/

    Markus, there must be sometimes when you just wish you had built in php instead of asp??

  7. Kebie Says:

    If you want to go cheap since Flash 10 is new, and you keep an eye on developer forums someone will probably have a free or cheap widget in near future for something like these. There are already good JavaScript libraries for resizing and generating thumbnail previews.

  8. Matthias Says:

    To do this with older versions of flash, it may be a matter of looking at each pixel, and having one’s own jpeg compression algorithm in actionscript. So it may be non trivial and potentially use quite a few cycles on the client. I looked into doing something similar briefly for a client for a customized version of chartgame.com

    If you haven’t found somebody who already has an implementation they can give you, drop me a line and we can discuss it further.

    A side benefit, I would make sure the images get cropped square. I can’t believe the distorting images to square thumbnails hasn’t been fixed yet :)

  9. Nick C Says:

    Have a look at this http://www.swfupload.org/ – the new beta (2.2) works very well for us.

  10. Juan Luis Says:

    Smarty…you can get this done for max 2000-3000$. Just change the $75 for 7.5$ (in India or other countries).
    Markus, you can post it in Elance or scriptlance.

  11. Hugo Gameiro Says:

    Markus:

    Reading the above posts makes me laugh. 12000-24000$ and 2000-3000$ you must be joking. I should be working for you.

    Sorry guys. In my country a good salary for a full month is around 1000$ and I get an app like that working in less then 15 days.

    Anyway… I found this http://www.sephiroth.it/file_detail.php?pageNum_comments=20&id=109# the basic upload, crop, save functionality is there.

    Regards

    Hugo

  12. Kebie Says:

    You guys don’t understand the app. It holds the file client side and crops it there so he doesn’t have to handle the bandwidth of a large image. People are pretty dumb, and don’t really understand file uploading or image resizing that well so you really have to hold their hand, but you don’t want to do it on your server with 4MB image uploads.

    It needs Flash 10 or some newer web techs that allow file handling on the computer. This is a new concept because it was always frowned upon due to security settings. I don’t know how to program it off the top of my head either, and I am pretty sure some dude in India doesn’t know how to program it either but says he does. Foreign programmers like that fall apart when you ask for anything besides basically a registration form. He will have to pay the money for real experienced developer who understands good UI design. It is a 1 man job, just has to find the right person.

    I would try something like Smashingmagazine.com jobs board or some good flash programming website where good quality developers read tutorials. It is worth getting quality when it is something as many people on POF are going to use it.

  13. Andreas Says:

    We use this one:

    http://www.aurigma.com/

    But the interesting thing for us is that many users still fall back to the good old upload form. Even though this plug in makes uploads much faster.

  14. Markus Says:

    The main thing is I want a user selected thumbnail drawn from the main image… I suppose i’d be find with them uploading the entire picture and not cropping it client side.

  15. Hugo Gameiro Says:

    Hi again:

    After reading the comments decided to give it a go and create a crop scirpt using flash.

    Is just a little example but it can be used as an example to do this SERVER SIDE.

    I even wrote an english post on my blog just for you guys :)

    Here you have the link: http://www.hugogameiro.com/image-crop-using-flash/

  16. Smarty Says:

    @Juan Luis

    About cheap labor… I actually have a business “cleaning” up projects after they were outsourced to India/etc, you get what you pay for. A lot of companies are realizing that and keep “flagship” products local while outsourcing “crap” ;)

    @Marcus
    What’s the point of the cropping it server-side? Do you mean, you want a user define an image area for the thumbnail and use that for the thumbnail? If you dont want anything but cropping – Flash 8/Javascript is just fine as solution…

    This all gave me an idea on how I can optimize bandwidth with accounts on my site.

  17. Hugo Gameiro Says:

    I agree there are many “crap” works that are delivered to cheap labour. But I would also add that there are many over paid works that are delivered to developers.

    I bet that if Markus aproachs a company or developer to ask for some kind of UI the first thing on this guys mind is: “He is making the money, so I can ask more to this one”.

    I am sayng all this. Not because I need/want work from any of you guys. I run my own sites and have more then I can handle in my hands. I am tryng to improve user experience and funcionality of my own sites. And would never ever consider payng more then 500$ for this kind of tool.

    But that is just me.

    About client side resize I found this:

    http://fluxcapacity.net/fluxtools/

    But it uses SilverLight

  18. John Says:

    I went to an opensource meeting this week at FarHeap software, they are behind the site overnightprints.com which does extensive image manipulation for user files, before using their current image editing tool, they had one based in flash which did a great job.

  19. Hugo Gameiro Says:

    Finally.

    There it is:

    http://www.hugogameiro.com/flash-resize-and-crop-faces-thumbnails/

    exactly the same as Downtoearth.com that by the way also works server side.

  20. Arne Says:

    Hugo: The whole point is that the crop is done client side, so the pof servers won’t need to receive as much data. That is what make it tricky.

    I’m on the board of a small consultancy that are working on this exact same solution for a client, albeit for a ruby site. They are imeediately resizing all images to a max size of 1000px any side before they are uploaded, then letting the user crop it once it is uploaded.

  21. Rey Bango Says:

    @Markus: Here’s a JavaScript image cropper based on the popular jQuery JavaScript library. (http://deepliquid.com/content/Jcrop.html). It’s licensed MIT so you can use it commercially. It’d be nice to see Plenty of Fish use jQuery.

    Rey
    jQuery Project

  22. Jason N Says:

    Seems like it’d certainly be better to keep it client side save the load on his pipe and servers.

  23. dan Says:

    what makes you think it’s on the client side?

    i tried it and i realized i had to wait before cropping the image. To me, it’s still uploading the image to the server using Flash. It doesn’t crop the image on the client side whatsoever.

    you really want to know why i think they used flash? To fight off spam.

    How do you write a script to spam a Flash site? You can’t. You can with specific GUI regression tools, but that’s too much effort, and one pixel change screws it up.

    Besides, you have to be prepared for mobile devices that can browse the web. iPhone, the device with the most advanced web browsing capability…doesn’t support Flash.

  24. Jason N Says:

    Dan,

    While I’m sure people would love to browse a dating site on their iPhone / BlackBerry, I have doubts that many would initiate an account and upload their profile pic via one any time soon. Yes, a small percentage would be willing and able to do this, but the great majority of users would simply want to view profiles, etc. on their phones.

  25. Robert Says:

    The idea is solid and definitely valuable. I see you want to choose thumbnails from a picture before being uploaded. Myspace has a similar feature for choosing the thumbnail for photo albums. However it is server-side. I am currently looking around for an open license version of essentially the same thing. If I locate anything I’ll let you know.

  26. Brian McIntosh Says:

    Markus,

    I just read the article in Inc. Wow! It really lit a fire under me.
    As for the “Image Uploader,” I’ve done that in Flash at http://www.ifiwerefamous.com. I’m sure I could extend my image uploader to account for resizing.

    Regards,

    Brian McIntosh

  27. goodlux Says:

    i’ve done this if you want to hire me.

    Let me know!

  28. Eqqy Designs Says:

    Markus,

    Inspirational work.
    If you ever come across any type of ideas you would like to implement, we can talk and discuss opportunities.

    Cheers.

  29. robertfrew Says:

    Here is a flash based app that you can use for only $20.

    http://www.resize-before-upload.com/

  30. robertfrew Says:

    Here is another that has some extra cool features such as multiple selections, rotations, etc… but it’s $230 for an unlimited domain license.

    http://quadroland.com/q_imageuploader

  31. Alex Says:

    Yeah, that Flash based Q-ImageUploader from http://quadroland.com/q_imageuploader
    is pretty cool.
    We integrated it successfully to our social network project. Before we used that aurigma java solution but many users complained that they don’t have java.

  32. James Says:

    Now they also have Open Source Flash Multiple Files Uploader

    http://quadroland.com/q_imageuploader/opensource/

    It’s simple and adjustable.

  33. Tom Says:

    This one is good and free.

    http://www.adylevy.com/index.php/2009/07/22/multiple-files-uploader-with-preview-on-client-side

    You’ll need to edit the main.as file and re-compile the swf though (OR edit it and let the values be passed in from the embed code) if you want to change the max width and max height.

    It doesn’t crop. It just resizes the image to fit longest dimension. One could extend it and add in the cropping…It’s a good head start.

  34. John Says:

    markus is a moron who lives in his basement and fakes his google earnings. lame lame lame and putting banner ads that appear to be busty women but are really clicky click ads is now he makes his $4 a day.

  35. Up2Long Says:

    I found this one:

    http://www.shift8creative.com/projects/agile-uploader/index.html#

    Nice, small and fast. Free too.

  36. Medo Says:

    This one runs on flash 10 and has client-side resize :

    http://flur.maurivard.com/

  37. Fish Killer Says:

    Hey Marcus what are you doing about the serial killer on your fish site that has been killing women. How is it that its not all over the place yet. Your system sucks and it can not stay free forever. You will be forced to charge a fee to stop these maniacs from killing again. I recommend a paid service. Marcus is only init for the money the ads provide for him. I have met marcus in person years back and he really needs to do something before he finds himself in a bad place.

  38. Boston Website Design Says:

    Boston WebDesign…

    Flash Image Resizing Preupload « Plenty of fish blog…

  39. water remediation atlanta Says:

    water remediation atlanta…

    […]Flash Image Resizing Preupload « Plenty of fish blog[…]…

  40. sek Says:

    we can get nice info from http://www.alertinfo.in

  41. Hotels in Manali Says:

    There is straight forwardly a lot to know about this. I think you made some good points in features also. Keep working on , have a great job.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s


Follow

Get every new post delivered to your Inbox.

Join 276 other followers

%d bloggers like this: