Tag Info

Hot answers tagged

25

Since this is a form, I would actually just provide two buttons inline to choose the image, and not a separate dialog or a set of radio buttons. I believe this is actually better (in this instance) than having a single image button which opens a dialog to choose the option to then choose your picture. If you're choosing from your computer, the button on ...


20

I would go with Dropbox's approach. 'Choose files' is clear enough to tell you the action it performs and concise enough to fit within two words. 'Select files' also works. When labeling buttons, try to explain what the button does. Are choosing files and uploading two steps or a single step? Since in dropbox's case, you choose the files and then press ...


14

I recommend not restricting to jpeg only: Social media sites (usually) rely on people creating profiles and becoming active on the site. If at any point it becomes a pain to create a profile, users won't do it. If they have only a .png, they likely aren't going to go create a .jpeg to create a profile unless there is a huge incentive for them to continue. ...


8

If you are concerned about the number of options being overwhelming, then you should consider the concept of progressive disclosure, where the more advanced features are generally hidden until specifically requested by a user action. That keeps the interface simple, but lets power user have access to the features they want/need. ...


7

To answer the last part of your question first: how uploading an image works on different devices depends largely on the support for and implementation of HTML5 features such as the File API and file form input fields. On iOS, for example, a prompt appears asking whether the user wants to take a picture with the camera or upload an existing file (see this ...


7

The default file uploading element can be confusing for non-power users, who might be seeing it for the first time. You should redesign it to something more user-friendly, which tells the user what he's doing exactly - like Facebook: there's a link saying, "Upload pictures", and when you click it it shows the OS window for uploading files. Also, looking at ...


6

Our very own Stack Exchange has this implemented relatively well (just click the image icon in the toolbar above the answer field): Though, I would just improve the switch between the 2 modes by increasing the clicking affordance of the inactive method (right now it doesn't look clickable). The key in this patterns is having some semblance of tabs: they ...


6

I like using link UI conventions in this case, because that is what the user is doing... linking. download bmml source – Wireframes created with Balsamiq Mockups


6

Are users genuinely confused by how the file input element works? Only you can answer that specific to your users. You could try attaching some behind the scenes logging to record the number of times someone chooses a file but then doesn't save the form, and especially if they choose a file, navigate away without saving, and then they come back to ...


4

Your sample guy doesn't look like he enjoys following instructions... Don't use a random sample, use a dedicated picture with annotations (e.g use a generally bright photo, and circle the important elements in red, and label them): You xhamster.com your username Use a few smaller ones to show common mistakes, e.g. like that: Rationale: People don't ...


4

In my opinion 'Choose Files' or 'Choose File' (for single file upload) is the best way. as said it's clear. and it isn't large. My experiences with long labels for upload are that people ain't going to read what's on the label. So limit your words to like 2 instead of 4 of more. (Choose files to upload) for example.


4

I just tested uploading a header photo on Twitter. It uploads automatically after I select the file I want to use. So there is no submit button. Google does this for avatars, as does Facebook. If you can pull that off with your avatar upload (so the user can see results before having to click "submit"), that would probably offer the best user experience. ...


3

I'd like to add that behavior of the control is prior to the wording. There is not one true best wording; the wording depends on the behavior and the purpose; and there are many different ways to approach this. Assuming the user first selects the file, then submits: Do you want to support selecting several files, before submitting? Will a user be able to ...


3

Yes, the need to upload an image to a 3rd party server, then going there, retrieving the URL, going to your site and pasting it there - is annoying. It makes you work much harder to share an image and many users just decide it's not worth the trouble. However, this doesn't necessarily mean you need to develop the whole image hosting infrastructure by ...


3

I was very pleased with how Pinterest handled this conundrum, but I thought it could be improved a little (and made more generic). I created the below wireframe for an internal process, and would recommend it for you, too. Wherever it says "Product," substitute "image" or whatever element you intend. This wireframe was for a specific form to add products ...


2

A recent blog from Zurb talked about this issue on Facebook. Have a look at it, http://www.zurb.com/article/515/podcast-of-julie-zhuos-talk-on-how-facebo Problem: The team found that of 85% who uploaded a photo would only upload one photo. Solution: The team thought perhaps people don’t know how to hold down shift and select multiple photos to upload. ...


2

Save at the time & constant update This gives the user feedback that she is doing the right things. And also a safe feeling that all hard work is not lost. Also I've seen a lot of people being scared for hitting the submit button if there was no feedback in between. In general it gives a much nicer experience. Remember though that it would be good if ...


2

Personally I think WordPress's method of uploading is fairly intuitive, i.e the directory structure (Year/Month/), with a plethora of options available after uploading, size, float, style, alt...etc. ModX CMS uses a similar fashion whereby you have one resource browser, and the user may create additional folders if required, or just upload to a central ...


2

First question to ask is "Why did the users prefer to go back to the old style when the new process just made it easier to categorize the information?". I think there might be more to it than just the fact they "don't like change". For example, in the new process, did the text area provide them the same rich text editor options that Word offers? In other ...


2

One thing I personally stay away from is putting both options equally visible on a same page. Speaking generally, I'd say first determine whether from your or the point of view of your company, one option is more desirable than another. Do you expect one option to be more frequently used than another by your users? Unless, your and users points of view are ...


2

Two possible options (that avoid an additional selection of the type of input) are: Selectively enabling/disabling the unused control When the user fills in the URL field, disable the file upload and vice-versa. Here it is important to clearly communicate the either-or relationship and give the user an clearly visible way to change his mind at any time. ...


2

Definitely this is something that can be confusing for users. I would separate the two halves of the pane - with a divider between image and details, thus making the 'Update Profile' button more clearly related only to the fields. Yes, immediately upload and display the picture, and immediately delete the picture as soon as the delete button is pressed, ...


2

Considering all you have posted so far, I'd say Yes and no. The user is the most important part there, no the information itself, if they are not happy, they will be sloppy and will make more mistakes. Keep the simple copy paste, but start a process of identification and parsing of the information, think what is the best way to detect those blocks of ...


2

Being an amateur photographer I've noticed that the good uploading tool is one that just quietly uploads my photos without forcing me to enter anything. It seems like it's not only because I have no idea of how to name or describe the photos sometimes, but because it's much easy to do on the web (especially for multiple photos). So I suggest to not make any ...


2

To answer your questions one by one : I mean, is it better to show the filename inside a button, and when the user touch it, it ask him if want to delete the file? - The challenge involved with this is that the filename can be pretty large and the button is often an affordance to inform users to select it or in this case to open it. To get an option to ...


2

Drag-and-Drop is a lot more easier and I prefer to it over "Browse-Locate-Upload" Function whenever it comes to attaching files to email, creating albums or upload files to drop-box. With Drag-and-Drop, you use your favorite image browser and locate the file more easily then using a small "Locate File Dialogue Box" which often doesn't show preview and ...


2

YES, people get confused! For a change, I am honored to answer with some real evidence: During my last usability testing, a significant amount of people got confused. They were sure they uploaded the file, but in reality they have just chosen the path, and missed the "upload" button. Two major issues generated these results: Uploading files is done in a ...


1

It depends greatly on the device and how old its OS is and which browser is being used. You should definitely consider the scenario where the user is unable to upload something with his device. If the user is able to upload, it happens often with a flow similar to that of desktop devices. The browser will open a dialog that allows the selection of media ...


1

It is supported on opera browser via getusermedia feature of html5 http://dev.opera.com/articles/view/playing-with-html5-video-and-getusermedia-support/ If the user has to leave the app to fetch any data and come back to you application, then it doesn't give a good experience especially if it has to be done repeatedly.


1

if 1 photo is the 70% situation, you can place photos vertically one by one. 1 and 2. I suppose the photo selection is almost like the first one, when user taps "done", all UI elements fade out except the photo user choose. the chosen photos will remain and fly to the left side as thumbnail. 3 and 4. Use float keyboard and scroll picker to enable ...



Only top voted, non community-wiki answers of a minimum length are eligible