Analyze the interactive process from the three steps of the image upload

Traditional image upload interaction is simple: A file domain requires the user to select a picture file, a Submit button (pictured below).

This way has a lot of shortcomings, such as the selection of pictures can not see the preview, at a time only to select a picture, upload process can not see progress. Of course, also has its own advantages: HTML itself form control, code simple, upload error-prone, suitable for low-speed network environment. Now rich media rampant era, users need long passes a large number of pictures, this traditional form of the way to upload pictures obviously have not keep up with the needs of the Times, based on Flash, HTML5 new upload methods are widely used.

We analyze the interactive process from uploading images, uploading, and uploading three steps.

Before uploading

Upload the picture before general can: see uploaded photos, choose Layout, source, etc.

↑ Weibo to select a single or multiple before uploading a picture

↑ First select layout and then upload the leaflet

↑QQ Space Mood Release box first let the user select the image source

Upload in

Upload a large number of pictures, whether you can allow users to take advantage of the waiting time, such as in the upload process can add picture description, remove unwanted pictures. Upload the picture process the most basic demand is upload progress show, mass upload is not easy to cause users irritability.

↑ dot net upload picture process has upload progress show, uploaded successful pictures can add description, you can choose picture Layout, you can delete pictures

↑ NetEase Album upload picture process can view upload progress, can add picture description

↑qq album upload picture process only progress show.

After the upload is complete

Add description, select layout, simple modification (rotation, cropping, etc.)

↑ Picture upload completed, QQ album recommended you to add a description of the picture, write a picture log

↑ on Weibo, after the upload of the picture can drag the mouse to sort, enlarge, reduce the picture and so simple processing.

Changes brought about by new technologies

In the local program, you can copy and paste the picture directly into the document, you can drag and drop the picture into the program to achieve open and modify, the current Google Doc Web page to achieve the above two ways to upload the image, so that it is more like a local application. QQ Space published in the log if there is an external reference to the picture, the successful release will prompt the user whether the chain will automatically transfer pictures to the album. This series of interactions, seemingly simple, requires support from the back-end complex technology. Less user action, upload pictures more convenient, perhaps this is the details, retain more users, so that they do not want to migrate to other platforms.